스킨 제작 프로젝트 - Step2. 퍼블리싱
NHN의 UIT Lab. 산하 ‘웹 표준화 팀(Web Standardization Team)‘에 서는 2007년 7월부터 팀내 ‘웹 접근성 TF’를 구성하고 올해 연말까지 NHN의 자체적인 웹 접근성 지침을 개발하기로 하였습니다. 현재 웹 접근성 TF에는 16명의 웹 표준화 팀원들이 참여하여 자체적인 연구활동과 지침개발 작업을 진행하고 있습니다. 오늘은 웹 접근성 지침을 개발하기 위한 사전 작업으로서 ‘웹 접근성 관계요소’를 정리하고 이를 맵핑해 보았습니다. 맵핑 작업에는 ‘Mindomo‘ 라는 온라인 마인드맵 툴을 이용하였고 웹 접근성 지침을 개발할 때 고려해야 할 요소들을 가능한 빠짐없이 분류하고자 하였습니다. 부족한 빈틈을 매워줄 적절한 조언도 필요하고 다른 분들께 도움이라도 될까 싶어 공유하게 되었습니다. 많은 조언 부탁드립니다. 위쪽 이미지와 아래쪽 표의 내용은 동일합니다.
웹 접근성 관계요소 분류 맵
클릭하셔서 크게 보셔야 할것 같습니다. 너비가 2600px이 넘어가네요 ^^
웹 접근성 관계요소 분류 표
| 1차 분류 | 2차 분류 | 3차 분류 | 4차 분류 | 5차 분류 | 6차 분류 | 7차 분류 | 설명 |
|---|---|---|---|---|---|---|---|
| 사람에 따른 분류 | 웹 저작자 | Content Developement | 웹 기획자(Planner) | 콘텐트, UI/UX 개발 및 기획 | |||
| 웹 이용자(End User) | 사용자 생산 콘텐트(UGC) 저작 | ||||||
| Client-side Developement | Web Designer | 웹 그래픽 설계 | |||||
| HTML/CSS 개발자 | 문서 구조화 및 화면 렌더링 구현 | ||||||
| Javascript/AJAX 개발자 | Javascript를 이용한 동적 UI 구현 | ||||||
| Flash/Action Script 개발자 | Flash를 이용한 동적 UI 구현 | ||||||
| Server-side Developement | Server-side 개발자 | 웹 프로그램 저작 | |||||
| 웹 이용자 | 어린이 | 경험치 | 웹을 처음 경험하거나 경험치가 낮아 사용능력이 떨어짐 | ||||
| 언어능력 | 고급어휘 또는 외국어 능력이 떨어짐 | ||||||
| 노인 | 경험치 | 웹을 처음 접하거나 자주 사용하지 않아 웹을 이해하거나 사용하는 능력이 떨어진다 | |||||
| 신체능력 | 신체기관의 노화로 인하여 시각, 청각, 지체기능이 정상인보다 떨어진다 | ||||||
| 시각장애 | 저시력 | 웹 저작자가 서체의 크기를 줄이는것을 제한하거나 서체의 크기를 조절할 수 있도록 지원 | |||||
| 색맹 | 색에의하여 내용을 구분하도록 하는 콘텐트의 제한, 특히 적녹생맹이 가장 많음 | ||||||
| 전맹 | 시력이 전혀 없고 청력에만 의존하는 사람, 마우스를 사용할 수 없음 | ||||||
| 청각장애 | 멀티미디어 콘텐트의 음성을 인지할 수 없으므로 캡션(자막)이나 대체 텍스트에 의존 | ||||||
| 지체장애 | 팔이 불편하거나 없는 경우 마우스, 키보드의 사용에 제한이 생긴다 | ||||||
| 정신지체 | 지능이 70 이하인 경우로서 어린이의 웹 이용행태와 유사, 언어능력과 사용능력이 모두 떨어짐 | ||||||
| 난독증 | 지능은 정상이나 글을 판독하는 것에 어려움을 느끼는 뇌질환 | ||||||
| 정상인 | 특별한 장애가 없으나 환경요인에 의하여 웹에 접근하는 것에 일시적인 어려움을 격을 수 있다 | ||||||
| 환경에 따른 분류 | 하드웨어(Hardware) 환경 | 장치(Device)별 분류 | PC | 입력장치 | 키보드 | 키보드만 사용하는 경우 | |
| 마우스 | 마우스를 사용할 수 없거나 정교한 사용이 어려운 경우 | ||||||
| 출력장치 | 모니터 | 저해상도 | 1024*768 미만의 해상도 | ||||
| 색재현성 | LCD등 색 재현력이 떨어지는 경우 | ||||||
| 스피커 | 장치이상 또는 장치의 부재 | ||||||
| 프린터 | 흑백 인쇄 | ||||||
| 프로젝션 | 조명이 어두운 환경, 어두운 배경과 고 명도대비 요구 | ||||||
| Mobile | 화면의 크기 | ||||||
| 접속 속도 | |||||||
| 데이터 이용 요금 | |||||||
| 입력장치의 한계 | |||||||
| 접속(Network) 환경 분류 | 저속환경 | 고용량 파일 전송에 의한 지연 | |||||
| 접속불안정 | 권한(로그인) 세션 종료 | ||||||
| 소프트웨어(Software) 환경 | 운영체제(Flatform)별 분류 | Windows | |||||
| Mac | |||||||
| Linux | |||||||
| PC 브라우징 도구의 Vendor별 분류 | Internet Explorer | ||||||
| Firefox | |||||||
| Opera | |||||||
| Safari | |||||||
| Mobile 장치의 화면 렌더링 방식에 따른 분류 | Small Screen Rendering | 디자인 서식이 제거된 화면 | |||||
| Full Browsing Rendering | 디자인 서식이 포함된 화면 | ||||||
| 보조 도구 분류 | 웹 이외의 문서 읽기전용 프로그램 | Adobe Acrobat Reader(PDF) | |||||
| MS Word Viewer(DOC) | |||||||
| 한글 Viewer(HWP) | |||||||
| MS Excel Viewer(XLS) | |||||||
| 음성(aural)출력장치 | Client-side TTS | 사용자 PC에 설치된 화면낭독기(Screen Reader) 환경 | |||||
| Server-side TTS | 웹 저작자가 제공하는 TTS(Text To Speach)환경 |
XE 프로젝트의 웹표준, 접근성, 사용성, User Interface, User eXperience, Universal Design, XHTML, CSS를 담당하고 있습니다.
![[레벨:4]](./modules/point/icons/default/4.gif "포인트:2040point (90%), 레벨:4/30"){kind=icon}
후니v
![[레벨:3]](./modules/point/icons/default/3.gif "포인트:1030point (71%), 레벨:3/30"){kind=icon}
SkyKiDS
사람에 따른 분류에 "외국인" 은 전혀 고려되지 않고 있네요..^^ 일반적으로 페이지 서비스가 자국민들을 위핸 것이라고는 하지만.. 그래도 언어를 배우는 외국인도 있을 텐데.... 배우고 있는 언어라고 해도... 익숙하지 않은 메뉴에 불편하기는 마찬가지죠.. 외국인도 고려해주시면 좋겠습니다.
![[레벨:5]](./modules/point/icons/default/5.gif "포인트:2960point (91%), 레벨:5/30"){kind=icon}
표준찬명
종스막상 표를 보고 분명 무언가가 고려되지 않았지 않았나 생각해 보려고 하는데 생각이 잘 나지 않네요~ ^^;
많은 분들이 보시고~ 빠진부분을 하나씩 채워 가는것도 좋은 방법 같습니다. 또 하나 배워 갑니다~ (이렇게 많은 부분을 고려해야 하다니... 한페이지 만드는데... 정말 많은 기술력을 요할것 같습니다~ ㅠ.ㅠ)
![[레벨:1]](./modules/point/icons/default/1.gif "포인트:175point (48%), 레벨:1/30"){kind=icon}
Jakal정말 도움이 많이 되었습니다~
이런 소중한 자료 공개해 주셔서 정말 감사드립니다~
실례가 되지 않는다면 제가 자주가는 커뮤니티에 자료의 출처를 밝히고 올려도 되련지요..
이러한 자료는 소중한 지식인데 제가 마구 퍼 나르면 안될 것 같아서요.. 원작자님께 허가를 받고 싶습니다..^^;
위의 Mindmap을 'Concept Leader' 라는 국산툴로 변형해서 올려보고 싶은데..^^;;
접근성이 높은 홈페이지를 제작하고자 할 때 큰 도움이 되겠네요~ 감사합니다^^