[C2]deview2012 웹접근성
Transcript of [C2]deview2012 웹접근성
웹접근성����������� ������������������ 어떻게����������� ������������������ 해야����������� ������������������ 하나요?
Wednesday, September 19, 12
웹접근성을����������� ������������������ 해야만(?)����������� ������������������ 하는����������� ������������������ 분들을����������� ������������������ 위한
NHN����������� ������������������ 웹접근성����������� ������������������ Project����������� ������������������ 경험담
시행착오
✓
Wednesday, September 19, 12
1.웹접근성이����������� ������������������ 뭔가요?
2.꼭����������� ������������������ 해야����������� ������������������ 하나요?
3.사용성이����������� ������������������ 떨어지진����������� ������������������ 않을까요?
4.얼마나����������� ������������������ 적용해야����������� ������������������ 하나요?
5.뭘����������� ������������������ 해야����������� ������������������ 하나요?
6.잘����������� ������������������ 모르겠어요..
7.하긴����������� ������������������ 했는데����������� ������������������ 맞게����������� ������������������ 했나요?
7Wednesday, September 19, 12
웹접근성이����������� ������������������ 뭔가요?
Wednesday, September 19, 12
1.웹접근성이����������� ������������������ 뭔가요?
웹����������� ������������������ 접근성����������� ������������������ 및����������� ������������������ 정보통신����������� ������������������ 접근성에����������� ������������������ 대한����������� ������������������ 주요����������� ������������������ 정의
장애인·・노인����������� ������������������ 등의����������� ������������������ 정보통신����������� ������������������ 접근성����������� ������������������ 향상을����������� ������������������ 위한����������� ������������������ 권장지침
정보통신����������� ������������������ 제품과����������� ������������������ 서비스를����������� ������������������ 활용하고자����������� ������������������ 하는����������� ������������������ 사람에게����������� ������������������ 이의����������� ������������������ 활용����������� ������������������ 가능성이����������� ������������������ 제공되는����������� ������������������ 것
웹����������� ������������������ 접근성����������� ������������������ 이니셔티브����������� ������������������ (WAI:����������� ������������������ Web����������� ������������������ Accessibility����������� ������������������ Initiative)
장애를����������� ������������������ 가진����������� ������������������ 사람들도����������� ������������������ 웹을����������� ������������������ 이용할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 보장하는����������� ������������������ 것으로,����������� ������������������ 장애를����������� ������������������ 가진����������� ������������������ 사람들이����������� ������������������ 웹����������� ������������������ 콘텐츠를����������� ������������������ 인지하고
(Perceivable),����������� ������������������ 운영하고(Operable),����������� ������������������ 이해하고(Understandable),����������� ������������������ 기술에����������� ������������������ 상관없이����������� ������������������ 이용할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 견고한
(Robust)하게����������� ������������������ 웹콘텐츠를����������� ������������������ 만드는����������� ������������������ 것
Wikipedia����������� ������������������
표준����������� ������������������ 브라우저����������� ������������������ 뿐만����������� ������������������ 아니라����������� ������������������ 다양한����������� ������������������ 사용자����������� ������������������ 에이전트(User����������� ������������������ Agent)를����������� ������������������ 사용하는����������� ������������������ 사람들이����������� ������������������ 웹����������� ������������������ 페이지에����������� ������������������ 접근하기����������� ������������������
쉽게����������� ������������������ 만드는����������� ������������������ 것으로,����������� ������������������ 이를����������� ������������������ 통해����������� ������������������ 장애인들도����������� ������������������ 웹을����������� ������������������ 사용할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 보장하는����������� ������������������ 것
한국정보화진흥원
어떠한����������� ������������������ 사용자(장애인,����������� ������������������ 노인����������� ������������������ 등),����������� ������������������ 어떠한����������� ������������������ 기술환경에서도����������� ������������������ 사용자가����������� ������������������ 전문적인����������� ������������������ 능력����������� ������������������ 없이����������� ������������������ 웹����������� ������������������ 사이트에서����������� ������������������ 제공하
는����������� ������������������ 모든����������� ������������������ 정보에����������� ������������������ 접근할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 보장하는����������� ������������������ 것
월드����������� ������������������ 와이드����������� ������������������ 웹����������� ������������������ (World����������� ������������������ Wide����������� ������������������ Web)을����������� ������������������ 창시한����������� ������������������ 팀����������� ������������������ 버너스����������� ������������������ 리(Tim����������� ������������������ Berners-Lee)는����������� ������������������ 웹이란
'장애에����������� ������������������ 구애����������� ������������������ 없이����������� ������������������ 모든����������� ������������������ 사람들이����������� ������������������ 손쉽게����������� ������������������ 정보를����������� ������������������ 공유할����������� ������������������ 수����������� ������������������ 있는����������� ������������������ 공간'이라고����������� ������������������ 정의
웹����������� ������������������ 접근성����������� ������������������ 연구소(wah.or.kr)����������� ������������������ 참고
Wednesday, September 19, 12
1.웹접근성이����������� ������������������ 뭔가요?
접근성이란����������� ������������������ 장애인뿐만����������� ������������������ 아니라����������� ������������������ 모든����������� ������������������ 사람이����������� ������������������ 정보통신����������� ������������������ 기기나����������� ������������������ 서비스를����������� ������������������
손쉽게����������� ������������������ 활용할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 만드는����������� ������������������ 것을����������� ������������������ 말하는����������� ������������������ 것이다.����������� ������������������
예를����������� ������������������ 들자면����������� ������������������ 장애인과����������� ������������������ 노인들을����������� ������������������ 위해����������� ������������������ 개발된����������� ������������������ 리모콘,����������� ������������������ 전화,����������� ������������������ 자동문����������� ������������������ 등의����������� ������������������ 제품들이����������� ������������������
널리����������� ������������������ 보급되면서����������� ������������������ 궁극적으로는����������� ������������������ 모든����������� ������������������ 사람들이����������� ������������������ 편리하게����������� ������������������ 활용하게����������� ������������������ 된����������� ������������������ 것을����������� ������������������ 들����������� ������������������ 수����������� ������������������ 있다.����������� ������������������
이러한����������� ������������������ 접근성����������� ������������������ 개념은����������� ������������������ 정보통신����������� ������������������ 분야에서����������� ������������������ 다양한����������� ������������������ 제품����������� ������������������ 및����������� ������������������ 서비스����������� ������������������ 간의����������� ������������������ 호환성����������� ������������������ 문제,����������� ������������������
이동����������� ������������������ 정보통신����������� ������������������ 기기����������� ������������������ 등으로����������� ������������������ 그����������� ������������������ 필요성����������� ������������������ 및����������� ������������������ 중요성이����������� ������������������ 더욱����������� ������������������ 증대되고����������� ������������������ 있다.
웹����������� ������������������ 접근성����������� ������������������ 연구소(wah.or.kr)����������� ������������������ 참고
Wednesday, September 19, 12
1.웹접근성이����������� ������������������ 뭔가요?
접근성이란����������� ������������������ 장애인뿐만����������� ������������������ 아니라����������� ������������������ 모든����������� ������������������ 사람이����������� ������������������ 정보통신����������� ������������������ 기기나����������� ������������������ 서비스를����������� ������������������
손쉽게����������� ������������������ 활용할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 만드는����������� ������������������ 것을����������� ������������������ 말하는����������� ������������������ 것이다.����������� ������������������
예를����������� ������������������ 들자면����������� ������������������ 장애인과����������� ������������������ 노인들을����������� ������������������ 위해����������� ������������������ 개발된����������� ������������������ 리모콘,����������� ������������������ 전화,����������� ������������������ 자동문����������� ������������������ 등의����������� ������������������ 제품들이����������� ������������������
널리����������� ������������������ 보급되면서����������� ������������������ 궁극적으로는����������� ������������������ 모든����������� ������������������ 사람들이����������� ������������������ 편리하게����������� ������������������ 활용하게����������� ������������������ 된����������� ������������������ 것을����������� ������������������ 들����������� ������������������ 수����������� ������������������ 있다.����������� ������������������
이러한����������� ������������������ 접근성����������� ������������������ 개념은����������� ������������������ 정보통신����������� ������������������ 분야에서����������� ������������������ 다양한����������� ������������������ 제품����������� ������������������ 및����������� ������������������ 서비스����������� ������������������ 간의����������� ������������������ 호환성����������� ������������������ 문제,����������� ������������������
이동����������� ������������������ 정보통신����������� ������������������ 기기����������� ������������������ 등으로����������� ������������������ 그����������� ������������������ 필요성����������� ������������������ 및����������� ������������������ 중요성이����������� ������������������ 더욱����������� ������������������ 증대되고����������� ������������������ 있다.
웹����������� ������������������ 접근성����������� ������������������ 연구소(wah.or.kr)����������� ������������������ 참고
Wednesday, September 19, 12
꼭����������� ������������������ 해야����������� ������������������ 하나요?
사전적����������� ������������������ 의미는����������� ������������������ 알겠어요.����������� ������������������ 하지만
Wednesday, September 19, 12
法
2.꼭����������� ������������������ 해야����������� ������������������ 하나요?
Wednesday, September 19, 12
2.꼭����������� ������������������ 해야����������� ������������������ 하나요?
도의적����������� ������������������ 책임(Moral Responsibility)
규제대응(Compliance)
장차법
법적분쟁����������� ������������������ 최소화
장애����������� ������������������ 접근성����������� ������������������ 향상
사용성����������� ������������������ 증가
못해도����������� ������������������ 본전 잘해도����������� ������������������ 본전
Wednesday, September 19, 12
2.꼭����������� ������������������ 해야����������� ������������������ 하나요?
無자발적����������� ������������������ 참여
관여,����������� ������������������ 관찰,����������� ������������������ 관심
Awareness느낄수����������� ������������������ 있도록내재화
온오프라인����������� ������������������ 교육
Wednesday, September 19, 12
사용성이����������� ������������������ 떨어지진����������� ������������������ 않을까요?
Wednesday, September 19, 12
3.사용성이����������� ������������������ 떨어지진����������� ������������������ 않을까요?
대부분은����������� ������������������ 오히려����������� ������������������ 좋아����������� ������������������ 집니다.
Wednesday, September 19, 12
3.사용성이����������� ������������������ 떨어지진����������� ������������������ 않을까요?
Wednesday, September 19, 12
3.사용성이����������� ������������������ 떨어지진����������� ������������������ 않을까요?
Wednesday, September 19, 12
3.사용성이����������� ������������������ 떨어지진����������� ������������������ 않을까요?
Wednesday, September 19, 12
고민되는����������� ������������������ 부분도����������� ������������������ 있습니다.
3.사용성이����������� ������������������ 떨어지진����������� ������������������ 않을까요?
Wednesday, September 19, 12
웹툰����������� ������������������ ����������� ������������������ ����������� ������������������ ����������� ������������������ ����������� ������������������ ����������� ������������������ ����������� ������������������ ����������� ������������������ ����������� ������������������ ����������� ������������������ ����������� ������������������ 베트남어사전
지식백과
N ?
N
책
?
일반����������� ������������������ 사용성����������� ������������������ VS����������� ������������������ 장애����������� ������������������ 접근성
지식백과 N
<span class=”hidden”>새글</span> 지식백과 <img alt=””>
<span class=”hidden”>새글</span> 지식백과
<div class=padding;>
</div>N
background
3.사용성이����������� ������������������ 떨어지진����������� ������������������ 않을까요?
[새글]
Wednesday, September 19, 12
얼마나����������� ������������������ 적용해야����������� ������������������ 할까요?
Wednesday, September 19, 12
Q.����������� ������������������ 어느����������� ������������������ 서비스의����������� ������������������ 어떤����������� ������������������ 페이지를����������� ������������������ 어느수준으로����������� ������������������ 적용해야����������� ������������������ 되나요?
4.얼마나����������� ������������������ 적용해야����������� ������������������ 하나요?
A.����������� ������������������ 모든����������� ������������������ 서비스의����������� ������������������ 모든����������� ������������������ 페이지를����������� ������������������ 전부다����������� ������������������ 적용해야����������� ������������������ 합니다����������� ������������������
우선순위에����������� ������������������ 의한����������� ������������������ 점진적����������� ������������������ 적용
Wednesday, September 19, 12
4.얼마나����������� ������������������ 적용해야����������� ������������������ 하나요?
접근성에����������� ������������������ 대한����������� ������������������ 효율적����������� ������������������ 접근����������� ������������������ 또는����������� ������������������ 전략
시각����������� ������������������ 장애
http://html.nhncorp.com/blog/42598
Wednesday, September 19, 12
뭘����������� ������������������ 해야����������� ������������������ 하나요?
Wednesday, September 19, 12
5.뭘����������� ������������������ 해야����������� ������������������ 하나요?
두����������� ������������������ 가지는����������� ������������������ 꼭����������� ������������������ 기억����������� ������������������ 해주세요!
Linearization
AlternativeText대체����������� ������������������ 텍스트
선형화
Wednesday, September 19, 12
5.뭘����������� ������������������ 해야����������� ������������������ 하나요?
LinearizationMake sense when linearized
x
y
y
Disabled Style
Wednesday, September 19, 12
5.뭘����������� ������������������ 해야����������� ������������������ 하나요?
LinearizationMake sense when linearized
Wednesday, September 19, 12
5.뭘����������� ������������������ 해야����������� ������������������ 하나요?
Alternative TextThe use of alternative-text is fundamental to accessibility
1.정보성����������� ������������������ 이미지는����������� ������������������ 대체����������� ������������������ 컨텐츠(텍스트)를����������� ������������������ 제공
2.동적����������� ������������������ 페이지의����������� ������������������ 경우����������� ������������������ (운영����������� ������������������ 툴로����������� ������������������ 업로드)����������� ������������������ 오브젝트들을����������� ������������������
업로드하면서����������� ������������������ 대체����������� ������������������ 텍스트가����������� ������������������ 선언될����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 정의
3. 유의사항)����������� ������������������ 대체����������� ������������������ 텍스트가����������� ������������������ 영문일����������� ������������������ 경우,
정확한����������� ������������������ 의미전달을����������� ������������������ 위해����������� ������������������ 국문으로����������� ������������������ 입력
1. HYUNDAI����������� ������������������ (현다이)����������� ������������������ alt=”현대”
2. UX����������� ������������������ (억스)����������� ������������������ alt=”유엑스”����������� ������������������ or����������� ������������������ “U����������� ������������������ .����������� ������������������ X”
4. 적용범위
1. 서비스����������� ������������������ 공급자가����������� ������������������ 제공하는����������� ������������������ 모든����������� ������������������ 정보성����������� ������������������ 이미지
2. 사용자����������� ������������������ 생성����������� ������������������ 컨텐츠(UCC)는����������� ������������������ 우선����������� ������������������ 제외1. 단,����������� ������������������ 대체����������� ������������������ 텍스트를����������� ������������������ 입력할����������� ������������������ 수����������� ������������������ 있는����������� ������������������ 필드를����������� ������������������ 제공2. 다양한����������� ������������������ 방법으로����������� ������������������ 대체����������� ������������������ 텍스트����������� ������������������ 입력����������� ������������������ 유도
Wednesday, September 19, 12
5.뭘����������� ������������������ 해야����������� ������������������ 하나요?
NWCAG1.0
http://a11y.nhncorp.com
NWCAG의����������� ������������������ 목적
NHN����������� ������������������ Web����������� ������������������ Content����������� ������������������ Accessibility����������� ������������������ Guidelines(이하����������� ������������������ NWCAG)����������� ������������������ 1.0은����������� ������������������ NHN
에서����������� ������������������ 제공하는����������� ������������������ 웹����������� ������������������ 콘텐츠의����������� ������������������ 접근성을����������� ������������������ 보장하기����������� ������������������ 위한����������� ������������������ 목적으로����������� ������������������ 만들어졌다.
NWCAG는����������� ������������������ 한국정보화진흥원에서����������� ������������������ 제정한����������� ������������������ KWCAG����������� ������������������ 2.0의����������� ������������������ 모든����������� ������������������ 내용을����������� ������������������ 포
함하고����������� ������������������ 있어,����������� ������������������ NWCAG를����������� ������������������ 모두����������� ������������������ 준수했을����������� ������������������ 경우����������� ������������������ 한국정보화진흥원의����������� ������������������ 웹����������� ������������������ 접근
성����������� ������������������ 품질����������� ������������������ 인증을����������� ������������������ 받을����������� ������������������ 수����������� ������������������ 있다.����������� ������������������ 또한����������� ������������������ KWCAG에는����������� ������������������ 포함되지����������� ������������������ 않았지만����������� ������������������ 웹����������� ������������������ 접근
성����������� ������������������ 개선에����������� ������������������ 도움이����������� ������������������ 되는����������� ������������������ 지침을����������� ������������������ 추가하였다.
NWCAG의����������� ������������������ 구조
핵심����������� ������������������ 지침(Key����������� ������������������ Points,����������� ������������������ 8개)
웹����������� ������������������ 접근성����������� ������������������ 준수를����������� ������������������ 위해����������� ������������������ 꼭����������� ������������������ 알아야����������� ������������������ 할����������� ������������������ 핵심����������� ������������������ 지침����������� ������������������ 8가지를����������� ������������������ 의미한다.����������� ������������������ 핵
심����������� ������������������ 지침은����������� ������������������ '1'과����������� ������������������ 같이����������� ������������������ 1단계����������� ������������������ 숫자로����������� ������������������ 표현하였다.
지침(Guidelines,����������� ������������������ 27개)
핵심����������� ������������������ 지침을����������� ������������������ 만족할����������� ������������������ 수����������� ������������������ 있는����������� ������������������ 구체적인����������� ������������������ 항목이다.����������� ������������������ 지침에����������� ������������������ 대응되는����������� ������������������ 장애����������� ������������������
환경과����������� ������������������ 담당자가����������� ������������������ 명시되어����������� ������������������ 있으며,����������� ������������������ 상세한����������� ������������������ 설명과����������� ������������������ 기대효과를����������� ������������������ 함께����������� ������������������ 제
시하고����������� ������������������ 있다.����������� ������������������ 지침은����������� ������������������ '1.1'과����������� ������������������ 같이����������� ������������������ 2단계����������� ������������������ 숫자로����������� ������������������ 표현하였다.
Wednesday, September 19, 12
5.뭘����������� ������������������ 해야����������� ������������������ 하나요?
체크리스트
http://a11y.nhncorp.com
직독직해(?)
전체����������� ������������������ 25개
직군별����������� ������������������ 필수����������� ������������������ 가이드����������� ������������������ 구분
UX����������� ������������������ 9개����������� ������������������ -����������� ������������������ 내재화����������� ������������������ 필요
마크업개발����������� ������������������ 11개
체크리스트 적용순서
1.����������� ������������������ 장애상황����������� ������������������ 이해
2.����������� ������������������ 해당사례����������� ������������������ 확인
3.����������� ������������������ 서비스별����������� ������������������ 이슈����������� ������������������ 점검
4.����������� ������������������ 내재화
Wednesday, September 19, 12
잘����������� ������������������ 모르겠어요..
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
뭘����������� ������������������ 해야����������� ������������������ 하는����������� ������������������ 지는����������� ������������������ 알겠는데,����������� ������������������
어떻게����������� ������������������ 구현해야����������� ������������������ 할지����������� ������������������ 모르겠어요..
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
Ajax Application
Fallback
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
Ajax Application Fallback
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
Ajax Application Fallback TEXT
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
.flv Player
Keyboard
wmode
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
.flv Player
Flash&Video&
기존&구조&
키보드&접근이&가능한&HTML&기반&대체&컨트롤러&별도&제공&
Inner&Component&
Flash&Video&
Inner&Component&
Accessible&Outer&Component&
HTML5로&동영상&및&컨트롤러를&모두&구현&
������� �����
Inner&Component&
��������
������
��
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
.flv Player
TAB$ TAB$ TAB$ TAB$
�$�$
�$
�$
�$ �$�$
�$
Acorn Media Player http://ghinda.net/acornmediaplayer/
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
.flv Player
SAMSUNG Website Video
키보드$접근시$숨겨진$메뉴$노출함$(html$$+$javascript$컴포넌트)$
TAB$ TAB$ TAB$ TAB$ TAB$ TAB$
http://www.samsung.com/sec/consumer/tv-video/tv
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
동영상����������� ������������������ 자막(원고)
동영상을����������� ������������������ 운영툴로����������� ������������������ 업로드����������� ������������������ 할����������� ������������������ 경우����������� ������������������ 동영상에����������� ������������������ 대한����������� ������������������ 대본이나����������� ������������������ 원고를����������� ������������������ 업로드����������� ������������������ 할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 설계해야����������� ������������������ 하며
프런트����������� ������������������ 화면����������� ������������������ 설계����������� ������������������ 시에도����������� ������������������ 영상을����������� ������������������ 보는����������� ������������������ 중간에����������� ������������������ 원고를����������� ������������������ 화면����������� ������������������ 밖으로����������� ������������������ 스크롤����������� ������������������ 하지����������� ������������������ 않도록����������� ������������������ 브라우저의����������� ������������������ 한����������� ������������������ 화면에����������� ������������������ 전부����������� ������������������ 노출이����������� ������������������
될����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 설계한다.
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
그래프(차트)의����������� ������������������ 대체����������� ������������������ 텍스트
차트나����������� ������������������ 그래프에����������� ������������������ 복잡한����������� ������������������ 정보를����������� ������������������ 담고����������� ������������������ 있는����������� ������������������ 경우����������� ������������������ 모든����������� ������������������ 정보를����������� ������������������ 전달할����������� ������������������ 수����������� ������������������ 없기����������� ������������������ 때문에����������� ������������������ 정보를����������� ������������������ 요약하여����������� ������������������ 선언����������� ������������������ 한다.
<img src="g.png" alt="일상생활의 소모 칼로리 빨리걷기110kcal 자전거타기90kcal 청소70kcal 요리하기70kcal 잠자기25kcal 춤추기150kcal 목욕85kcal ">
Wednesday, September 19, 12
6.잘����������� ������������������ 모르겠어요
그래프(차트)의����������� ������������������ 대체����������� ������������������ 텍스트
차트나����������� ������������������ 그래프에����������� ������������������ 복잡한����������� ������������������ 정보를����������� ������������������ 담고����������� ������������������ 있는����������� ������������������ 경우����������� ������������������ 모든����������� ������������������ 정보를����������� ������������������ 전달할����������� ������������������ 수����������� ������������������ 없기����������� ������������������ 때문에����������� ������������������ 정보를����������� ������������������ 요약하여����������� ������������������ 선언����������� ������������������ 한다.
Summary of Stock Price and Volume Day by Day Price and Volume Information
Wednesday, September 19, 12
하긴����������� ������������������ 했는데����������� ������������������ 맞게����������� ������������������ 했나요?
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
누가����������� ������������������ 맞나요?
되긴����������� ������������������ 하는데����������� ������������������ 서비스별로����������� ������������������ 다른데요
통일되지����������� ������������������ 않은����������� ������������������ 사용자����������� ������������������ 경험
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
UX가이드
지침����������� ������������������ 내용에����������� ������������������ 따른����������� ������������������ 적용방법����������� ������������������ 중,����������� ������������������ 효율적인����������� ������������������ 내용을����������� ������������������ 정하여����������� ������������������ 적용����������� ������������������ 방식을����������� ������������������ 통일한다.
1.스킵����������� ������������������ 네비게이션
1.����������� ������������������ 항목선정����������� ������������������ 방법
2.노출����������� ������������������ 인터랙션
2.자동재생����������� ������������������ 컨텐츠
1.����������� ������������������ 페이지����������� ������������������ 리프레시,����������� ������������������ 리다이렉트
2.롤링����������� ������������������ 컨텐츠
3.페이지����������� ������������������ 로딩����������� ������������������ 시����������� ������������������ 자동����������� ������������������ 재생
4.제어기능의����������� ������������������ 위치
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
UX가이드����������� ������������������ -����������� ������������������ 스킵����������� ������������������ 네비게이션
반복영역(동일한����������� ������������������ 컨텐츠가����������� ������������������ 동일한����������� ������������������ 위치에����������� ������������������ 걸쳐있는����������� ������������������ 영역)을����������� ������������������ 매번����������� ������������������ 탐색하지����������� ������������������ 않고����������� ������������������ 건너뛸����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 도와주는����������� ������������������ 링크의����������� ������������������ 모음
스킵����������� ������������������ 네비게이션����������� ������������������ 기본����������� ������������������ 규칙
문서의����������� ������������������ 최상위에����������� ������������������ 위치해야����������� ������������������ 하며,����������� ������������������ Tab키를����������� ������������������ 누르면����������� ������������������ 노출되어야����������� ������������������ 함.
건너띄기����������� ������������������ 요소는����������� ������������������ 메인����������� ������������������ 메뉴����������� ������������������ 바로가기/하위����������� ������������������ 메뉴����������� ������������������ 바로가기/본문����������� ������������������ 바로가기를����������� ������������������ 설정할����������� ������������������ 수����������� ������������������ 있으며,����������� ������������������ 하위����������� ������������������ 메뉴가����������� ������������������ 없는����������� ������������������ 경우에는����������� ������������������ 해당����������� ������������������ 건너띄기를����������� ������������������ 생략할����������� ������������������ 수����������� ������������������ 있다.����������� ������������������ ����������� ������������������
메뉴가����������� ������������������ 없는����������� ������������������ 단����������� ������������������ 페이지거나,����������� ������������������ 지도����������� ������������������ 서비스와����������� ������������������ 같은����������� ������������������ 경우,����������� ������������������ 스킵네비게이션을����������� ������������������ 생략할����������� ������������������ 수����������� ������������������ 있다
본문����������� ������������������ 영역을����������� ������������������ 제외하여����������� ������������������ 중요한����������� ������������������ 컨텐츠����������� ������������������ 영역이����������� ������������������ 없는����������� ������������������ 경우����������� ������������������ 불필요하게����������� ������������������ 제공하지����������� ������������������ 않는다.
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
UX가이드����������� ������������������ -����������� ������������������ 스킵����������� ������������������ 네비게이션����������� ������������������ >����������� ������������������ 항목선정
해당메뉴����������� ������������������ 영역이����������� ������������������ 없는����������� ������������������ 경우를����������� ������������������ 제외하고����������� ������������������ “메인����������� ������������������ 메뉴”����������� ������������������ 바로가기����������� ������������������ /����������� ������������������ “하위����������� ������������������ 메뉴”����������� ������������������ 바로가기����������� ������������������ /����������� ������������������ “본문영역”����������� ������������������ 바로가기를����������� ������������������ 모두����������� ������������������ 제공
1.����������� ������������������ 메인����������� ������������������ 메뉴����������� ������������������ 바로����������� ������������������ 가기����������� ������������������ Skip����������� ������������������ to����������� ������������������ main����������� ������������������ menu
시작����������� ������������������ 영역부터����������� ������������������ GNB,����������� ������������������ 검색����������� ������������������ 등����������� ������������������ 요소를����������� ������������������ 반복����������� ������������������ 영역을����������� ������������������ 건너뛰고,����������� ������������������ 메인����������� ������������������ 메뉴로����������� ������������������ 바로����������� ������������������ 이동할����������� ������������������ 수����������� ������������������ 있는����������� ������������������ 링크-����������� ������������������ 메인����������� ������������������ 메뉴����������� ������������������ 상단의����������� ������������������ 불필요한����������� ������������������ 반복요소를����������� ������������������ 건너띄고,����������� ������������������ 바로����������� ������������������ 메인����������� ������������������ 메뉴로����������� ������������������ 접근����������� ������������������ 할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 한다.
GNB
Main Menu
SUB Menu Main Contents
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
UX가이드����������� ������������������ -����������� ������������������ 스킵����������� ������������������ 네비게이션����������� ������������������ >����������� ������������������ 항목선정
해당메뉴����������� ������������������ 영역이����������� ������������������ 없는����������� ������������������ 경우를����������� ������������������ 제외하고����������� ������������������ “메인����������� ������������������ 메뉴”����������� ������������������ 바로가기����������� ������������������ /����������� ������������������ “하위����������� ������������������ 메뉴”����������� ������������������ 바로가기����������� ������������������ /����������� ������������������ “본문영역”����������� ������������������ 바로가기를����������� ������������������ 모두����������� ������������������ 제공
1.����������� ������������������ 메인����������� ������������������ 메뉴����������� ������������������ 바로����������� ������������������ 가기����������� ������������������ Skip����������� ������������������ to����������� ������������������ sub����������� ������������������ menu
상단����������� ������������������ 공통영역과����������� ������������������ 메인메뉴����������� ������������������ 영역까지의����������� ������������������ 반복����������� ������������������ 영역을����������� ������������������ 건너뛰고,����������� ������������������ 서브����������� ������������������ 메뉴����������� ������������������ 영역으로����������� ������������������ 이동할����������� ������������������ 수����������� ������������������ 있는����������� ������������������ 링크-����������� ������������������ 특정����������� ������������������ 페이지로����������� ������������������ 이동한����������� ������������������ 다음,����������� ������������������ 같은����������� ������������������ 메인����������� ������������������ 메뉴����������� ������������������ 카테고리����������� ������������������ 내에서����������� ������������������ 다른����������� ������������������ 하위����������� ������������������ 메뉴를����������� ������������������ 선택하고자����������� ������������������ 할����������� ������������������ 경우����������� ������������������ 사용-����������� ������������������ 하위����������� ������������������ 메뉴영역이����������� ������������������ 페이지����������� ������������������ 좌측이나����������� ������������������ 메인메뉴����������� ������������������ 하단에����������� ������������������ 별도����������� ������������������ 영역으로����������� ������������������ 존재하는����������� ������������������ 경우,����������� ������������������ 사용-����������� ������������������ 페이지����������� ������������������ 내����������� ������������������ 하위����������� ������������������ 메뉴����������� ������������������ 영역이����������� ������������������ 없는����������� ������������������ 경우,����������� ������������������ 스킵네비게이션에서����������� ������������������ 생략(ex.����������� ������������������ 서비스����������� ������������������ 메인����������� ������������������ 페이지)
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
UX가이드����������� ������������������ -����������� ������������������ 스킵����������� ������������������ 네비게이션����������� ������������������ >����������� ������������������ 항목선정
해당메뉴����������� ������������������ 영역이����������� ������������������ 없는����������� ������������������ 경우를����������� ������������������ 제외하고����������� ������������������ “메인����������� ������������������ 메뉴”����������� ������������������ 바로가기����������� ������������������ /����������� ������������������ “하위����������� ������������������ 메뉴”����������� ������������������ 바로가기����������� ������������������ /����������� ������������������ “본문영역”����������� ������������������ 바로가기를����������� ������������������ 모두����������� ������������������ 제공
1.����������� ������������������ 메인����������� ������������������ 메뉴����������� ������������������ 바로����������� ������������������ 가기����������� ������������������ Skip����������� ������������������ to����������� ������������������ Content
반복����������� ������������������ 영역을����������� ������������������ 건너뛰고,����������� ������������������ 해당����������� ������������������ 페이지의����������� ������������������ 핵심����������� ������������������ 컨텐츠로����������� ������������������ 바로����������� ������������������ 이동할����������� ������������������ 수����������� ������������������ 있는����������� ������������������ 링크-����������� ������������������ 뉴스����������� ������������������ 페이지의����������� ������������������ 경우����������� ������������������ 메인메뉴����������� ������������������ 영영역과����������� ������������������ 좌측����������� ������������������ 하위메뉴����������� ������������������ 영역을����������� ������������������ 제외하고,����������� ������������������ 뉴스����������� ������������������ 본문����������� ������������������ 영역으로����������� ������������������ 이동-����������� ������������������ 좌측����������� ������������������ frame이����������� ������������������ 나누어진����������� ������������������ 경우,����������� ������������������ GNB����������� ������������������ 등����������� ������������������ 매����������� ������������������ 페이지에서����������� ������������������ 반복되는����������� ������������������ 요소의����������� ������������������ 경우에는����������� ������������������ skip����������� ������������������ 영역으로����������� ������������������ 설정
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
UX가이드����������� ������������������ -����������� ������������������ 자동재생����������� ������������������ 컨텐츠
1.����������� ������������������ 커텐츠����������� ������������������ 자동����������� ������������������ 갱신����������� ������������������ 시����������� ������������������ 문제점
페이지����������� ������������������ 탐색����������� ������������������ 중����������� ������������������ 리프레시,����������� ������������������ 리다이렉트가����������� ������������������ 발생하게����������� ������������������ 되면����������� ������������������ 페이지를����������� ������������������ 새로����������� ������������������ 읽어오기����������� ������������������ 때문에����������� ������������������ 키보드����������� ������������������ 포커스를����������� ������������������ 잃고����������� ������������������ 다시����������� ������������������ 문서의����������� ������������������ 처음으로����������� ������������������ 이동하게����������� ������������������ 된다.����������� ������������������ 이런����������� ������������������ 경우����������� ������������������ 시각����������� ������������������ 장애인은����������� ������������������ 스크린리더를����������� ������������������ 통해����������� ������������������ 컨텐츠를����������� ������������������ 탐색하다가����������� ������������������ 다시����������� ������������������ 처음부터����������� ������������������ 컨텐츠를����������� ������������������ 읽어야����������� ������������������ 하며,����������� ������������������ 지적����������� ������������������ 장애인의����������� ������������������ 경우����������� ������������������ 컨텐츠를����������� ������������������ 채����������� ������������������ 읽기도����������� ������������������ 전에����������� ������������������ 컨텐츠가����������� ������������������ 변경되어����������� ������������������ 정보를����������� ������������������ 인지할����������� ������������������ 수����������� ������������������ 없다.����������� ������������������
롤링����������� ������������������ 컨텐츠(롤링����������� ������������������ 배너,����������� ������������������ 실시간����������� ������������������ 뉴스,����������� ������������������ 짧은����������� ������������������ 시간����������� ������������������ 동안����������� ������������������ 나타났다����������� ������������������ 사라지는����������� ������������������ 알림����������� ������������������ 레이어����������� ������������������ 등등)의����������� ������������������ 경우에는����������� ������������������ 컨텐츠를����������� ������������������ 채����������� ������������������ 읽기도����������� ������������������ 전에����������� ������������������ 컨텐츠가����������� ������������������ 화면����������� ������������������ 안에서����������� ������������������ 사라져서����������� ������������������ 컨텐츠를����������� ������������������ 인지할����������� ������������������ 수����������� ������������������ 없거나����������� ������������������ 특정����������� ������������������ 부분이����������� ������������������ 계속����������� ������������������ 업데이트����������� ������������������ 되어����������� ������������������ 포커스를����������� ������������������ 잃어버리는����������� ������������������ 경우가����������� ������������������ 발생할����������� ������������������ 수����������� ������������������ 있다.����������� ������������������ 또한,����������� ������������������ 롤링����������� ������������������ 된����������� ������������������ 이전����������� ������������������ 컨텐츠를����������� ������������������ 다시����������� ������������������ 확인하기����������� ������������������ 위해서는����������� ������������������ 원하는����������� ������������������ 컨텐츠가����������� ������������������ 다시����������� ������������������ 롤링될����������� ������������������ 때까지����������� ������������������ 기다려야����������� ������������������ 하는����������� ������������������ 문제점이����������� ������������������ 있다.
2.����������� ������������������ 사용자����������� ������������������ 제어����������� ������������������ 기능����������� ������������������ 제공����������� ������������������ 방법
서비스����������� ������������������ 구조����������� ������������������ 상����������� ������������������ 페이지����������� ������������������ 자동����������� ������������������ 갱신����������� ������������������ 혹은����������� ������������������ 컨텐츠����������� ������������������ 자동����������� ������������������ 갱신,����������� ������������������ 롤링����������� ������������������ 컨텐츠����������� ������������������ 기능이����������� ������������������ 필요한����������� ������������������ 경우에����������� ������������������ 사용자가����������� ������������������ 이를����������� ������������������ 제어할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 한다.����������� ������������������ 단,����������� ������������������ 페이지����������� ������������������ 전체가����������� ������������������ 일정����������� ������������������ 시간����������� ������������������ 후에����������� ������������������ 리프레시����������� ������������������ 혹은����������� ������������������ 리다이렉트����������� ������������������ 되는����������� ������������������ 경우에는����������� ������������������ 제어할����������� ������������������ 수����������� ������������������ 있는����������� ������������������ 기능을����������� ������������������ 페이지의����������� ������������������ 가장����������� ������������������ 상단에����������� ������������������ 두어����������� ������������������ 컨텐츠의����������� ������������������ 변화����������� ������������������ 이전에����������� ������������������ 제어할����������� ������������������ 수����������� ������������������ 있게����������� ������������������ 한다.
[자동재생����������� ������������������ 음성컨텐츠����������� ������������������ 기본����������� ������������������ 규칙]
-����������� ������������������ 페이지����������� ������������������ 리프레시,����������� ������������������ 리다이렉트����������� ������������������ :����������� ������������������ 최상단에����������� ������������������ 리프레쉬����������� ������������������ 제어����������� ������������������ 기능����������� ������������������ 제공.-����������� ������������������ 롤링����������� ������������������ 컨텐츠����������� ������������������ :����������� ������������������ 영역����������� ������������������ 내����������� ������������������ 이전/다음,����������� ������������������ 정기����������� ������������������ 기능을����������� ������������������ 반드시����������� ������������������ 제공함.-����������� ������������������ 페이지����������� ������������������ 로딩����������� ������������������ 시����������� ������������������ 자동����������� ������������������ 재생����������� ������������������ :����������� ������������������ 가급적����������� ������������������ 정지상태를����������� ������������������ 기본값으로����������� ������������������ 제공하되,����������� ������������������ 어려운����������� ������������������ 경우����������� ������������������ 정기����������� ������������������ 기능을����������� ������������������ 최상단에����������� ������������������ 제공함.
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
UX가이드����������� ������������������ -����������� ������������������ 자동재생����������� ������������������ 컨텐츠����������� ������������������ >����������� ������������������ 페이지����������� ������������������ 리프레시,����������� ������������������ 리다이렉트
리다이렉트����������� ������������������ 제어기능은����������� ������������������ UI상����������� ������������������
화면����������� ������������������ 안에����������� ������������������ 보이기만����������� ������������������ 하면����������� ������������������ 사용자의����������� ������������������ 인터랙션으로����������� ������������������
제어가����������� ������������������ 가능하지만����������� ������������������ 시각장애인의����������� ������������������ 경우에,
페이지의����������� ������������������ 가장����������� ������������������ 처음에서����������� ������������������ 읽어주지����������� ������������������ 않으면����������� ������������������
제어가����������� ������������������ 어렵기����������� ������������������ 때문에����������� ������������������ 시각적으로
하단에����������� ������������������ 위치하더라도,
HTML����������� ������������������ 코드상에서는����������� ������������������ 반드시����������� ������������������ 상단에����������� ������������������ 두도록����������� ������������������ 한다.
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
UX가이드����������� ������������������ -����������� ������������������ 자동재생����������� ������������������ 컨텐츠����������� ������������������ >����������� ������������������ 롤링컨텐츠
롤링����������� ������������������ 컨텐츠는����������� ������������������ 페이지����������� ������������������ 전체가����������� ������������������ 변경되는����������� ������������������ 것이����������� ������������������ 아니기����������� ������������������ 때문에����������� ������������������ 해당����������� ������������������ 컨텐츠를����������� ������������������ 만났을����������� ������������������ 때����������� ������������������ 사용자가����������� ������������������ 제어할����������� ������������������ 수����������� ������������������ 있도록����������� ������������������ 한다.
일반적인����������� ������������������ 방법 UI구현����������� ������������������ 공간이����������� ������������������ 없을����������� ������������������ 경우
Wednesday, September 19, 12
7.맞게����������� ������������������ 했나요?
UX가이드����������� ������������������ -����������� ������������������ 제어기능의����������� ������������������ 위치
①����������� ������������������ 자동����������� ������������������ 재생����������� ������������������ 음성����������� ������������������ 컨텐츠����������� ������������������ 순서,����������� ������������������ ②����������� ������������������ 페이지����������� ������������������ 자동갱신����������� ������������������ 제어����������� ������������������ 기능,����������� ������������������ ③����������� ������������������ 스킵����������� ������������������ 네비게이션
페이지가����������� ������������������ 로딩����������� ������������������ 되었을����������� ������������������ 때����������� ������������������ 무엇보다����������� ������������������ 먼저����������� ������������������ 정의해야����������� ������������������ 하는����������� ������������������ 기능은����������� ������������������ 다음과����������� ������������������ 같으며,����������� ������������������ 페이지����������� ������������������ 컨텐츠에����������� ������������������ 따라����������� ������������������ 정의����������� ������������������ 항목은����������� ������������������ 다르더라도����������� ������������������ 아래����������� ������������������ 순서를����������� ������������������ 반드시����������� ������������������ 지키도록����������� ������������������ 한다.
Wednesday, September 19, 12
어떤 장님이 수십 명의 사람들과 같이 금강산에 갔다가 돌아왔다. 어떤 사람이 유점사의 기둥과 지붕 형태를 물으니 대답하는사람이 없었다. 그런데 장님이 말하기를, "불전의 기왓골이 120이다."라고 하였다. 그 까닭을 물으니 장님이 다시 말하기를,"처음 갔을 때 갑자기 소나기가 내려 기왓골에서 떨어진 물이 땅을 파서 오목하게 되었다. 내가 그것을 더듬어 세어보아 알게 되었다."하였다.
(권별, 『해동잡록(海東雜錄)』, 『대동야승』 5, 민족문화추진회, 1973 -P. 57) [출처] 조선시대 장애인들은 어떻게 살았을까? |작성자 love한화
장애에����������� ������������������ 대한����������� ������������������ 인식과����������� ������������������ 장애판정에����������� ������������������ 대한����������� ������������������ 기준
“그들에게����������� ������������������ 장애는����������� ������������������ 없었다“
편견
✓
웹접근성에����������� ������������������ 대한����������� ������������������ 공감
Wednesday, September 19, 12
html.nhncorp.com
Wednesday, September 19, 12
웹접근성이����������� ������������������ 상식이����������� ������������������ 되길����������� ������������������ 기대해����������� ������������������ 봅니다.
감사합니다.
Wednesday, September 19, 12