웹표준과 웹접근성
어떠한 운영체제나 어느 브라우저에서든 항상 동일하게 보여줄 수 있도록 W3C기구 표준에 마추어 모든 사람들이 사이트에 쉽게 접근할 수 있도록 구현 하는것이다. 라고 요약할 수 있다.
스터디 방법
막상 처음 시작할려면 무엇부터 해야할지 헤맬 경우가 많이 있다. 이때 가볍게 볼수 있는 책한권을 선택하는게 좋다. 요즘 인터넷이 발달되어있어 책은 필요없다고 하지만 실제로 책을 한번 읽은 것과 안읽은 것에는 엄청난 차이가 발생한다. 인터넷을 통해 검색을 할려고 해도 무엇을 어떻게 검색해야할지 모르는 반면 책을 읽은 뒤라면 무엇을 검색해야하는지를 알수가 있다. 그러므로 꼭 책은 한권 읽고 시작하는게 좋다. 나도 처음 무엇을 해야할 지, 무엇을 찾아야 할지를 몰랐으나 이런 문제들이 책한권으로 싹 다 사라졌다. 어떤 책이라도 좋다. 기본적으로 어떤 문장들이 사용되는지를 눈에 익히는게 첫목표인 것이다. 나는 아마도 5년전에 [크리에이티브 디자이너를 위한 웹표준] 이라는 책으로 시작을 했다.
내가 읽기에는 간결하고 쉬워보여서 이책을 선택했지만 몇년전 이야기다. 더 알차고 간결하고 핵심만 설명한 책들이 현제는 엄청나게 많이 있다. 천천히 보고 본인에 맞는 책을 구매하면 된다. 다만 너무 무거워서 중간에 포기하지 말아야 하기 때문에 쉬운내용의 책일 수록 좋다.
css 사용법
html 문서에 css를 사용하는 3가지 방법
- 외부 스타일 시트(external style)
- 내부 스타일 시트(internal style)
- html 태그내의 스타일 지정(inline style)
이렇게 총 3가지의 방법이 있다.
외부 스타일 시트(external style)
css라는 확장자를 가진 스타일 시트 파일을 만들고 이 파일을 html 문서에 연결하여 사용하는 방법이다.
<head>
<link rel="stylesheet" type="text/css" href="스타일시트url.css">
</head>
외부에서 불러들이는 형식으로 홈페이지 전체의 스타일을 일관성있게 유지하면서 변경시에도 일괄적으로 변경되므로 홈페이지 제작의 효율성을 높일 수 있다.
반면 외부 스타일 시트 파일을 계속적으로 관리해주면서 문서를 만들어 나가야 하기에 스타일 시트의 파일이 지나치게 복잡해지면 곤란하다.
내부 스타일 시트(internal style)
html 문서의 <head>와 </head>사이에 스타일을 정의하는 방법이다.
<head>
<style type="text/css">
<!--
body {font-size:12px;}
//-->
</head>
html문서마다 스타일을 매번 지정해 주어야 하지만, 하나의 문서에만 해당되는 스타일을 지정할때 사용하면 된다.
태그내의 스타일 지정(inline style)
태그 직접적으로 사용하는 스타일 시트로 적용범위가 좁은 형태이다.
<p style="font-size:14pt;">이 글자의 크기는 14pt의 크기입니다.</p>
일괄변경의 효율성 측면에서는 바람직하지 않는 방법이지만 직관적으로 사용이 가능다는 장점이 있다. 또한 스타일 시트가 중복이 되었을 경우 제일 우선순위로 적용이 된다.
'홈페이지 > 웹디자인' 카테고리의 다른 글
| 챗gpt 나도 한번 써봤다! 자동 코딩 소스 생성 (0) | 2023.08.23 |
|---|---|
| 웹 표준을 위한 태그사용 기본수칙 (1) | 2016.11.21 |
| 가독성을 높이는 css 폰트속성 (1) | 2016.11.18 |
| 웹 호환성을 위한 크로스브라우징 css핵 (0) | 2016.11.17 |
| 스타일시트 css의 문법 (0) | 2016.11.16 |