| 9장 | | | 9:1 명확한 카테고리 레이블의 사용 |
|
9:1 명확한 카테고리 레이블의 사용 (상대적 중요도: 5, 증거의 강도: 4)
지침 : 링크를 포함하여 카테고리 레이블은 그 카테고리안에 있는 정보와 항목을 명확하게 반영하도록 하라.
주석 : 카테고리 제목은 전형적인 사용자층이 이해할 수 있어야 한다. 모호하고 일반적인 링크 레이블을 쓰면 이해하기 힘들다. 그러므로 이해하기 쉽게 특정되고 구체적인 링크와 식별어(descriptors)를 써야 한다. 역주 : 레이블링(labeling)은 사실상 정보 설계에 있어 휴리스틱한 부분이므로 설계자의 능력에 전적으로 의존한다고 보아야 한다. 개념 설명에 대해서는 번역서가 나와 있는 ''웹사이트 구축을 위한 인포메이션 아키텍쳐''(한빛미디어) 5장 "레이블링 시스템"을 참조하기 바란다. |
| 9장 | | | 9:2 구별되고 설명력 있는 헤딩의 사용 |
|
9:2 구별되고 설명력 있는 헤딩의 사용 (상대적 중요도: 5, 증거의 강도: 3)
지침 : 서로 잘 구별되고 표현하고자 하는 콘텐츠에 개념적으로 연관이 있는 헤딩(headings)을 사용하라.
주석 : 잘못된 헤딩(사용자가 예상했던 것과 찾아낸 것이 불일치)의 사용은 웹사이트에서 흔한 문제이다. 헤딩은 설명력이 있으며 소개하고자 하는 콘텐츠와 연관이 있어야 한다. 헤딩이 서로 너무 비슷하면 사용자는 망설이다가 차이점을 확인하기 위해 다시 읽어야 할 수도 있다. 제일 좋은 헤딩을 확인하려면 광범위한 사용성 테스트와 다른 방법들이 필요할 수도 있다. 역주 : 다음은 네이버의 디렉토리 서비스이다. 구별되고 설명력 있는 헤딩의 사용례이다.
 |
| 9장 | | | 9:3 설명력 있는 열과 행 헤딩들의 사용 |
|
9:3 설명력 있는 열과 행 헤딩들의 사용 (상대적 중요도: 3, 증거의 강도: 3)
지침 : 데이터 테이블은 명확하고 간결하며 정확한 열과 행(row and column) 헤딩을 갖고 있어야 한다.
주석 : 유니크한 셀(cell) 콘텐츠를 알려주는 열과 행 헤딩을 사용하여야 한다. 사용자는 효율적이고 효과적으로 테이블 정보를 사용하기 위해 명확하고 간결한 헤딩을 요구한다. 열과 행의 헤딩들은 데이터들이 어떻게 이름붙여졌거나 구별되는지를 스크린 리더에게 알려주며 따라서 이를 이용하는 장애인등의 사용자들은 테이블의 전반적인 구조속에서 셀이 지니는 의미를 이해할 수 있게 된다. 역주 : 설명력 있는 데이터 테이블 헤딩은 장애인 뿐만 아니라 비장애인에게도 테이블의 이해를 도와준다. 공간 부족으로 인해 테이블 헤딩에 약어를 쓰는 경우가 종종 있는데 다른 사람이 못 알아보는 약어를 쓰는 것은 곤란하다. 동 블로그 웹사이트의 접근성 메뉴의 ''접근성 문제의 이해(14)''를 참조바란다.
|
| 9장 | | | 9:4 설명력 있는 헤딩의 충분한 사용 |
|
9:4 설명력 있는 헤딩의 충분한 사용 (상대적 중요도: 3, 증거의 강도: 5)
지침 : 웹사이트 전반에 걸쳐 설명력 있는 헤딩을 충분히 사용하라.
주석 : 잘 쓰여진 헤딩(headings)은 사용자가 빠르게 훑어볼 수 있게 도와주는 중요한 수단이다. 헤딩은 따라 나오는 정보나 기능에 개념적으로 연관이 있어야 한다.
헤딩은 페이지의 구성이나 구조에 관해 정보를 전해주며 사용자를 이끄는 중요한 실마리를 제공한다. 헤딩은 페이지상의 정보를 분류하는 데도 도움을 준다. 각각의 헤딩은 원하는 목적물을 찾는데 유용해야 한다.
빠르게 훑어보는 능력은 나이든 성인에게 특히 중요한데 왜냐하면 이들은 젊은 사람보다 자주 훑어보는 것을 멈추고 읽기 시작하기 때문이다. 헤딩이 설명력이 없거나 많지 않으면 사용자는 찾고자 하는 정보가 없는 곳에서 읽기를 시작하게 만들어 불필요하게 느려지게 만들수 있다. 역주 : 제목이나 중간 제목등으로 쓰이는 헤딩은 포함하고 있는 콘텐츠에 대해 설명력이 있어야 할 뿐만 아니라 풍부하게 사용하는게 유익할 수 있다는 근거를 제시하고 있다.
|
| 9장 | | | 9:5 설명력 있는 페이지 타이틀의 제공 |
|
9:5 설명력 있는 페이지 타이틀의 제공 (상대적 중요도: 3, 증거의 강도: 2)
지침 : 각 웹 페이지에 대해 설명력 있고 유니크하며 간결하고 유의미하게 차별화된 타이틀을 써라.
주석 : 타이틀(title)은 브라우저의 타이틀 바(브라우저 제일 꼭대기에 있는 바)에 있는 텍스트를 지칭한다. 타이틀은 검색 엔진에 의해 페이지를 확인하는데 쓰인다. 둘이나 그 이상의 페이지가 동일할 경우 사용자가 구별할 수 없거나 브라우저의 즐겨찾기 기능을 활용할 수 없다. 사용자가 페이지를 북마크할 때 타이틀을 편집하지 않으면 안되는 상황이 되고 만다.
어떤 검색 엔진들은 검색 결과 페이지에 페이지 타이틀만 나열한다는 것을 명심하라. 모든 페이지에 간결하고 유의미한 페이지 타이틀이 사용되면 사용자들이 페이지를 찾아보거나 특정 URL에 관한 핫 리스트나 히스토리 리스트(둘 다 브라우저의 기능)을 훑어볼 때 유용하다. 또한 다른 사람들이 페이지에 링크를 걸 때도 유용하다.
사용자를 혼란시키지 않기 위해선 타이틀 바의 타이틀과 페이지의 콘텐츠의 타이틀을 일치시키도록 하여야 한다. 역주 : 페이지 타이틀에 관한 지침이다. 국내 웹사이트의 타이틀 관리 실태는 한마디로 엉망이다(www.coolcheck.co.kr의 사이트 진단 통계를 따른 것임). 중복 타이틀은 말할것도 없거니와 아예 타이틀을 안 적는 경우가 부지기수이다. 웹이 정보 공유나 마케팅, 홍보를 위한 가장 중요한 매체라고 한다면 검색 엔진에서 해당 정보를 찾기 위한 결정적인 기초 자료가 페이지 타이틀임에도 불구하고 전혀 관리가 안 되고 있다. 특히 중복 타이틀의 경우 대부분의 검색엔진 알고리즘에서 노출 중요도에 있어 낮은 가중치를 부여받게 된다. 시급한 인식 전환이 요구된다.
|
| 9장 | | | 9:6 중요 데이터의 부각 |
|
9:6 중요 데이터의 부각 (상대적 중요도: 3, 증거의 강도: 3)
지침 : 사용자의 주의를 끌어야 할 그리고 자주 표시되지 않는 중요한 항목들에 대해서는 시각적으로 차별화(부각)시켜야 한다.
주석 : (데이터 테이블에서) 부각시켜야 할 항목들은 최근에 변경된 데이터거나 한계치를 초과한 데이터거나 그 밖에 정해진 기준을 만족시키지 못하는 데이터를 포함할 수 있다. 여기서 사용된 부각(highlight)이란 말은 말 그대로 강조의 의미이다. 부각은 드물게 쓰일 때 가장 효과적이다. 즉 페이지상에서 다른 것들은 상대적으로 보이는 모습이 동일하면서 몇 개의 항목들만 눈에 띌 때 효과적이다. 역주 : 다음 그림은 동 가이드에서 제시된 부각(highlight)의 사례이다. 오른쪽 위의 빨간색으로 표시한 데이터가 부각된 것을 확인할 수 있다.
 |
| 9장 | | | 9:7 선택을 줄일수 있는 좋은 방법의 제공 |
|
9:7 선택을 줄일수 있는 좋은 방법의 제공 (상대적 중요도: 2, 증거의 강도: 2)
지침 : 사용자에게 최대한 효율적으로 여러 선택사항들을 줄일 수 있는 좋은 방법을 제공하라.
주석 : 사용자들은 선택할 것을 줄이기를 원하는 것으로 보인다. 모든 선택사항들을 명확하게 제공하여 사용자들이 가장 중요한 선택사항으로 여기는 것에 우선 집중할 수 있도록 해야 한다. 역주 : 다음은 동 가이드에서 제공하는 사례이다. 암 정보를 찾는데 있어 암 종류를 모두 보여주면서도 흔한 암(Common Cancers), 아동/소아암(Childhood/Pediatric Cancers), 신체위치/조직(Cancers by Body Location/System)에 따른 암의 3가지 대분류를 제공하여 효율적으로 선택을 줄이면서 접근할 수 있게 해주고 있다.

|
| 9장 | | | 9:8 적절한 HTML 순서에 따른 헤딩의 사용 |
|
9:8 적절한 HTML 순서에 따른 헤딩의 사용 (상대적 중요도: 1, 증거의 강도: 2)
지침 : 헤딩은 적절한 HTML 순서에 따라서 사용하라.
주석 : 적절한 HTML 순서에 따른 헤딩(heading)을 사용하는 것은 사용자가 페이지상의 정보의 위계구조를 이해하는데 도움을 준다. 또한 H1-H3 헤딩 태그의 적절한 사용은 보조 장치를 사용하는 장애인들이 정보의 위계구조를 이해할 수 있도록 해준다. 역주 : 다음 역시 동 가이드에서 보여주는 사례이다. 헤딩 H1과 H2가 정보의 위계에 따라 적절히 사용되고 있는 웹페이지와 그 소스 코드이다.
 |