이글은 웹 페이지에서 javascript 를 사용함에 있어 “Graceful Degradation” 과 “Progressive Enhancement” 에 대해서 설명하고 있습니다. 두가지 구현 방법에 대해 설명하고 각각의 구현 예를 제시합니다. 웹 접근성을 위해서는 어떤 구현 방법이 좋은지 (뻔하지만…) 설명합니다.
Skip Navigation (이하, 건너뛰기 링크) 는 시각 장애인들이 스크린 리더를 사용해 네비게이션 시에 매 페이지 마다 반복되는 페이지 상단의 메뉴 혹은 잡다 반복 링크들을 건너 뛰어 페이지 내용에 바로 접근할 수 있도록 페이지 최 상단에서 제공하는 페이지 내 링크들을 말합니다. Skip Navigation 에 대한 자세한 내용에 대해서는 성민장군님의 “Skip Navigation(건너뛰기 링크, 스킵 네비게이션)은 Quick Link가 [...]
웹 사이트의 메인화면이나 하단 영역에 흔히 쓰이는 관련 사이트 바로가기 UI요소가 있습니다. 보통, 콤보상자에 관련사이트 목록을 나열하고 사이트를 선택하면 새창으로 선택한 사이트가 열리도록 구성 합니다. 하지만 이런 방법은 웹 접근성에 문제가 있습니다. 이 글에서는 이런 UI요소를 웹 접근성을 준수하도록 단계별로 개선하는 방법을 설명합니다.
바로 이전 포스트(원숭이 엉덩이는…)에서 유트브 동영상을 삽입했는데. HTML Validator 를 통과하지 못했습니다. (본 블로그는 xhtml, css 2.1 을 준수하고 있습니다. -_-a) 유트브에서 제공한 코드는 다음과 같습니다. <object width="425" height="344"> <param name="movie" value="http://www.youtube.com/v/39a1jzuqGGQ&amp;hl=ko_KR&amp;fs=1&amp;rel=0"></param> <param name="allowFullScreen" value="true"></param> <param name="allowscriptaccess" value="always"></param> <embed src="http://www.youtube.com/v/39a1jzuqGGQ&amp;hl=ko_KR&amp;fs=1&amp;rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed> </object> 웹 표준 위의 코드는 HTML4에서 폐기된 EMBED 태그를 사용하기 [...]
미투데이에서 naradesign님의 div 를 ‘디브’ 말고 ‘디비전’이라고 읽어야 한다 라는 내용의 글이 이슈더니. NARADESIGN:BLOG 에 같은분이 HTML 어떻게 읽는것이 좋을까? 라는 포스트를 발행하셨네요. 이에 대해 “내 맘대로 보는 세상” 을 운영하시는 정태영님 께서는 RE: HTML 어떻게 읽는것이 좋을까? 라는 포스트로 다른 생각을 전하고 있습니다. 저역시, HTML 어떻게 읽는것이 좋을까? 라는 포스트에 트래백을 걸 요량으로 이글을 [...]
전자신문에 2010년 01월 06일자로 “[갈 길 먼 웹 접근성] (하)두 마리 토끼를 잡아라” 라는 기사가 실렸습니다. 제목만 봐서는 “웹 표준, 웹 접근성 모두를 만족하는 사이트 개선 작업이 필요하다.” 라는 내용으로 예상할 수 있습니다. 하지만 내용에서는 그 내용을 잠깐 언급할 뿐 “갈 길 먼 웹 접근성” 관련 이슈 몇 가지를 다루고 있습니다. 명확하고 효과적인 처벌 필요 [...]
디지털 타임스 에 2010년 01월 04일자로 “이러닝 품질인증 기준에 콘텐츠접근성 포함 검토” 라는 기사가 실렸습니다. 이러닝 콘텐츠들은 그 품질을 인증 받기위해 이러닝 품질관리센터 로부터 “품질인증”을 받고 있는데 이 기준에 접근성 항목을 포함시키는 방안을 검토중이라는 내용입니다. 장애인이나 고령자가 이용하기 어려운 국내 이러닝 콘텐츠의 접근성을 개선하기 위한 작업이 다양하게 추진된다. 한국교육학술정보원은 장애인이 불편 없이 이러닝 콘텐츠와 서비스를 [...]
개요 현재 W3C 의 CSS Validator 에는 버그가 있습니다. 사용에 주의를 요합니다. 버그 내용 아래와 같은 CSS 구문을 입력해 검사를 해보면 #someElement { background: url(images/img.png) no-repeat center; } 잘못된 값 : background 해석 오류 [empty string] 이라는 오류를 보실 수 있습니다. 마지막 background-position 부분에서 값을 하나 생략하는 경우 이와 같이 해석 오류를 보고 하고 있습니다. [...]