본문 바로가기

웹접근성지침(WCAG2.0)

[웹접근성 지침-일반기술 G161] 사용자가 콘텐츠를 찾는데 도움을 주는 '검색기능'을 제공하자.

728x90

 

원문: https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G161.html


복잡하고 페이지가 많은 홈페이지는 검색기능을 제공해야 사용자가 원하는 페이지를 쉽게 찾을 수 있습니다.


기술설명

사용자에가 검색기능을 이용하여 콘텐츠를 찾도록 합니다.

사용자가 웹페이지 구조를 파악하거나 탐색할 필요 없이 특정 단어나 구문을 검색하여 해당 콘텐츠를 찾을 수 있습니다.

이는 대규모 사이트에서 콘텐츠를 찾을 때 아주 유용합니다.

 

일부 검색 관련 회사에서는 서버에 검색엔진을 설치할 수 있는 '무료 검색 애플리케이션'을 제공하고 있습니다.

일부 웹 호스팅 회사에서는 고객이 만든 웹페이지에 적용할 수 있는 '검색 스크립트'를 제공합니다.

대부분 고급 기능이 있는 경우에는 유료입니다.

 

입력한 글자의 철자를 검색하고, 용어에 다양한 어미를 포함하고, 다양한 동의어도 검색 할 수 있다면,

검색 기능의 접근성은 더욱 높아집니다.

 

검색 기능은 웹 페이지에서 '간단한 양식(= 검색어 필드와 버튼으로 구성된 형식)'으로 제공됩니다.

또는 검색을 할 수 있는 페이지로 이동하는 링크를 제공합니다.

 

외부 검색을 위한 '검색 엔진 결과를 최적화로 만드는 기술'은 내부 검색 엔진에도 효율적인 기술입니다.

이 기술은 키워드, 메타 태그(meta tag), 접근 가능한 내비게이션 구조를 사용합니다.

구글 같은 검색 사이트에서는 검색에 최적화된 콘텐츠를 만드는 방법에 대한 지침을 제공하고 있습니다.

 

 

예시

[예시1] 쇼핑 사이트에서 여성복, 남성복, 아동복과 같은 다양한 카테고리로 제품이 정리되어 있습니다.

여기에 상의, 신발, 액세서리와 같은 하위 카테고리도 있습니다.

각 페이지 마다 검색 양식을 제공하고 있습니다. 사용자는 제품 번호나 제품 설명을 검색 필드에 입력하고 검색할 수 있습니다.

검색을 이요하면 카테고리를 탐색하지 않아도 해당 제품을 찾을 수 있습니다.

 

[예시2] 도움말 센터에서는 회사 제품에 대한 도움말 정보가 담긴 수천페이지가 있습니다.

검색을 이용하면 원하는 검색어가 포함된 도움말 페이지들을 찾을 수 있습니다.

 

 

자료

다음 자료는 참고만 해주세요. 

- Bravenet 사이트 검색 

- 무료 검색 

- Google 맞춤 검색 엔진 

 

 

관련기술

G63: 사이트맵 제공

G64: 목차 제공

G125: 관련 웹 페이지로 이동하기 위한 링크 제공

G126: 다른 모든 웹 페이지에 대한 링크 목록 제공

 

 

점검절차

1. 웹 페이지에 검색양식 이나 검색 페이지로 이동하는 링크가 있는지 확인합니다.

2. 검색 양식에 텍스트를 입력합니다.

3. 검색을 활성화 합니다.

4. 사용자가 입력한 검색어가 포함된 페이지로 이동하는지 확인합니다.

5. 사용자가 입력한 검색어가 포함된 페이지에 대한 링크 목록이 있는 페이지로 이동하는지 확인합니다.

 

 


 

나의 정리

웹 사이트에서 원하는 페이지로 이동하기 위해서는 '주 메뉴(Navigation)'나 '사이트 맵(Site map)'을 이용하여 웹 사이트의 전체적인 구성을 파악한 뒤에 해당 페이지로 이동합니다.

몇 페이지 안 되는 단순한 구성의 웹 사이트라면 사용하는 데 불편함은 없습니다.

하지만 구성이 복잡하고 많은 수의 페이지를 가진 웹사이트라면 어떨까요?

한 번에 원하는 페이지로 이동하는 것이 쉽지 않을 것입니다.

그래서 웹 사이트 내의 모든 페이지를 검색할 수 있는 검색기능이 필요합니다.

검색 기능을 이용하면 쉽게 원하는 페이지로 이동 할 수 있습니다.

 

예를 들어 보겠습니다. 의류 및 악세사리를 판매하는 쇼핑몰이 있습니다.

쇼핑몰에서 양말을 사려고 합니다. '주 메뉴(Navigation)'를 확인합니다. 상의, 하의, 셔츠, 바지, 점퍼, 계절 등으로 복잡하게 분류되어 있습니다. 원하는 제품을 빨리 찾기 위해 페이지 내에 있는 '검색 양식'으로 가서 '양말'이라고 입력한 뒤에 검색을 실행 합니다.

그러자 '양말'이라는 단어가 들어간 페이지에서부터 모든 양말 제품이 목록으로 나옵니다.

사용자는 목록 내에서 자신이 원하는 페이지를 찾으면 됩니다.

 

검색 기능을 이용하면 복잡한 카테고리나 메뉴를 볼 필요 없이, 단숨에 원하는 페이지를 찾을 수 있습니다.

 

이런 검색을 효율적으로 만들고 사용하기 위해서는 페이지를 만들 때, '키워드' 및 '메타태그'를 삽입해야 하고, 웹 페이지 구조를 접근성 있게 만들어야 합니다. 이런 방법은 구글이나 네이버 같은 포탈 검색 사이트에서 제공하는 검색 엔진 최적화 기술부분을 참고하면 됩니다.

 

복잡하고 페이지가 많은 홈페이지는 검색기능을 제공해야 사용자가 원하는 페이지를 쉽게 찾을 수 있습니다.


 

G161: 사용자가 콘텐츠를 찾을 수 있도록 돕는 검색 기능 제공

https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G161.html

 

G161: Providing a search function to help users find content | Techniques for WCAG 2.0

A shopping site organizes its products into different categories, such as women's clothes, men's clothes, and children's clothes. These have subcategories, such as tops, pants, shoes, and accessories. Each page also contains a search form. Users can type t

www.w3.org

 

 


공짜로 혼자서도 할 수 있는 웹퍼블리싱 공부 방법을 알려드립니다.

홈페이지 만들기, 혼자하기 힘들다면 무로 스터디에 들어오세요.

공부 방향을 모르겠다면 무료 과외를 신청하세요.

 

https://blog.naver.com/redoxup/223134941372

 

혼자서 웹퍼블리싱(HTML+CSS)입문과정 마스터 할 수 있다! + 도움을 받으면 더 잘 할 수 있다!!

웹디자이너, 웹퍼블리셔, 웹프로그램을 준비하시는 분들이라면, 다른 건 몰라도 HTML+CSS 입문과정...

blog.naver.com

 

728x90