웹 품질 - 스타일 시트

웹 품질 – 스타일 시트

당연한 이야기지만, 스타일시트를 사용하는 것은 웹페이지의 품질에 매우 중요합니다.

1. 태그를 사용하지 마십시오.

웹페이지의 정보를 표시하는데 사용되는 글자의 크기는 CSS를 이용해서 설정되어야 합니다.
HTML의  태그를 사용하지 마십시오.

태그를 사용하는 것은 문서의 크기를 증가시킬 것이며, 여러분이 표준 문자 크기를 바꾸려고 결정할 때마다 끔찍한 악몽을 겪게 될겁니다.

다음의 예를 생각 해 보세요:

어느날 여러분은 웹페이지의 모든 헤더들을 다른 색상과 크기로 바꾸기로 결정했습니다.

CSS로는 한 줄의 코드를 다시 작성하여 색상과 크기 속성을 바꿀 수 있습니다.

만일 여러분이 태그를 사용했다면, 모든 웹페이지 헤더들의 태그들을 하나 하나
수정해야 할겁니다.

태그대신 스타일 시트를 사용하는 것은 훨씬 더 쉽게 모든 웹페이지의 품질을 높일 수 있고, 일관된 외관을 유지할 수 있습니다.

2. 고정된 글자 크기를 사용하지 마십시오.

고정된 글자 크기 값을 사용하지 마십시오. 항상 상대적인 크기 값을 사용하세요.

이 조언이 중요한 가장 큰 이유는 크기 값이 고정된 글자는 웹브라우저로 텍스트 크기를 바꿀 수 없기 때문입니다.

여러분의 방문자는 서로 다른 장치(모니터)와, 서로 다른 조건과 환경(빛)을 가지고 있을 수 있고, 장애를 가지고 있을 수도 있습니다. (심각하게 낮은 시력)

일 례로, 여러분의 기본 문자 크기를 100%(혹은 중간)으로 맞추는 것, 메인 헤더를 140%(혹은 x-large)로 맞추는 것, 서브 헤더를 120%(혹은 large)로 맞추는 것은 여러분의 독자가 그들에게 가장 맞게끔 페이지를 리사이징 하는 것을 가능하게 합니다.

어떻게 동작하는지 보고 싶으세요? 브라우저의 보기 메뉴를 클릭한 다음, 텍스트 크기를 클릭하고 페이지에 알맞다고 생각되는 글자 크기를 고르세요.

웹페이지의 글자 크기를 조정하는 것은 또한 프린트된 페이지의 글자의 양도 변화시킵니다.

3. 기본 글자 크기를 작게 하지 마십시오.

몇몇 웹사이트들은 단지 더 많은 문자열을 각각의 페이지에 짜넣기 위해서, 혹은 페이지가 더 멋져보이게 하기 위해서 작은 글자 크기를 사용합니다.

다시 한번 말씀드리지만, 방문자들은 다른 장치, 환경을 가지고 있고, 글자를 읽는데 어려움을 가지는 것과 같은 장애를 가지고 있을수도 있습니다.

방문자가 여러분의 사이트를 방문할 때마다 글자 크기를 늘려야만 하는 상황으로 방문자들을 몰아가지 마십시오.

4. 항상 배경색을 설정 해 두십시오.

대부분의 웹페이지들은 서로 다른 글자 요소를 위해 색깔을 사용합니다. 헤더와 링크 모두 자주 본문의 글자와 색깔이 다른 경우가 많습니다.

웹 개발자로써, 여러분은 방문자가 기본 색상 설정을 변경할 수 있다는 사실을 알고 있어야 합니다.

웹 요소들(헤더나 링크 같은 것)에 색깔을 지정한다면, 여러분은 또한 배경 색상도 설정해 주셔야만 합니다.

여러분이 배경 색상을 지정하지 않으면, 웹사이트가 결국 매우 나쁜 색조합을 가지게 될 수도 있습니다.(적색 헤드라인과 적색 배경, 혹은 더 심한 경우, 흑색 배경위에 흑색 문자열)

배경 색상을 설정하지 않으면, 여러분의 문자열이 안보이는 사태가 발생할수도 있습니다. 흰색 배경이 필요한 경우도 흰색을 배경색으로 명시적으로 설정 해 두세요.

항상 이야기하듯이, 반드시 이렇게 해야할 필요는 없습니다.

하지만 제가 많은 생각을 거쳐서 정성들여 쓴글이니 한번 읽고 참고는 해주세요.

되도록이면, 정말로 도움이 되는 글을 쓰려고 노력하고 있습니다 ^_^

근데, 쓰고보니 말투가 영 아니네요 ㅠ_ㅠ..

말투도 좀 고민해봐야 겠습니다.