전국 동시 지방선거가 있기 며칠 전…
수도권의 주요 후보 6명의 홈페이지에 대한 접근성 테스트를 진행했습니다.
테스트를 진행하고 결과를 보니 의외의 부분도 많았고 참 답답하기도 했습니다.
예민한 부분이라 특정 후보를 거론하지 않으면서 후보자 홈페이지에 대한 얘기를 해보려고 합니다.
구체적인 페이지주소와 캡쳐이미지를 생략하고, 포괄적으로 적는 것이기 때문에 표현이 부정확할 수 있습니다.

일단!!
대부분의 홈페이지에서 시각장애인에 대한 배려는 거의 없었습니다.
이미지에 가장 기본적인 대체 텍스트 조차 달지 않았더군요.


사례1. 플래시 메뉴(네비게이션)의 접근성 부재

플래시 개체의 경우 접근성을 보장하는 방법들이 이미 나와있습니다. Adobe사는 접근성 관련 페이지(www.adobe.com/accessibility)를 통해 관련 문서를 제공하고 있고, 웹접근성연구소(www.wah.or.kr)의 자료실에 는 이미 해당 부분에 연구 보고서가 등록되어 있습니다. 또한 많은 업체에서 이에 대한 내용을 알고 있고, 제작해본 경험들을 가지고 있습니다.

후보자 홈페이지 6곳 중 5곳이 플래시 메뉴를 사용하고 있었고, 이 중 단 1곳만 접근성을 보장하는 메뉴를 제공하고 있었습니다.

상식적으로 생각해봐도 다른 항목들에 비해 메뉴는 상당히 중요한 비중을 차지합니다. 메뉴를 이용할 수 없다면 해당 홈페이지에서 접근할 수 있는 항목은 상당히 줄어들게 됩니다. 메인 페이지에 최근 글 목록이나 핫링크로 제공되지 않은 항목들은 아예 들어가 볼 수가 없게 되죠. 메뉴를 제외한 모든 항목에 대체 텍스트를 제공한다고 하더라도 메뉴를 이용할 수가 없다면 거의 무용지물이 되고 맙니다. 메뉴의 접근성은 이래서 매우 중요합니다.

예> 접근성을 보장하는 플래시 메뉴
www.xvtech.com / www.thinkforbl.com


사례2. 정보를 포함하는 이미지에 대한 대체 텍스트 제공 부재

선거 후보자 홈페이지에서 가장 중요한 부분은 후보자 프로필과 공약입니다. 많은 후보자 홈페이지에서 프로필과 공약을 감각적으로 꾸미기 위해 이미지를 사용하고, 하나의 이미지에 모든 내용을 넣어서 이미지 파일 하나로 올리곤 합니다. 이 방법 자체는 전혀 문제가 되지 않습니다. 텍스트 정보까지 이미지로 넣은 경우 대체 텍스트를 분명하게 제공해줘야 하는데 그렇지가 않다는 것이 문제입니다.

후보자 홈페이지 6곳 중 4곳은 프로필과 선거공약을 담은 이미지에 대한 대체 텍스트를 전혀 제공하지 않았습니다. 접근성 테스트 툴로 확인해보면 대체텍스트 제공률이 90%를 넘지만 실제 제공되는 대체 텍스트는 <01.gif>, <profile.gif>, <01-1.gif>, <공약최종.gif>, <사용자정의이미지> 같은 식이었습니다. 모두 에디터에서 자동으로 입력해주는 대체텍스트지요. 이런 경우 시각장애인이 스크린리더로 접근한다면 해당 후보의 프로필과 공약에 대한 내용은 전혀 확인을 할 수 없습니다.

후보자 홈페이지 중 1곳은 부분적으로 대체 텍스트를 제공해서 완전하지는 않지만 조금이라도 공약이나 프로필 정보를 얻을 수 있었습니다. 또 다른 후보의 홈페이지 1곳은 이미지와 함께 일반 텍스트로도 공약과 프로필 정보를 제공하고 있어서 시각장애인이 정보를 접하기 매우 수월했습니다.

단순한 이미지의 경우 대체 텍스트 제공에 “alt”값을 사용하지만, 공약과 프로필처럼 많은 내용을 담은 경우 “longdesc”속성을 사용해서 별도로 정보를 제공해주는 것이 좋습니다. longdesc는 대체 텍스트를 제공하는 별도의 페이지를 구성하기 때문에 많은 내용을 시각장애인이 쉽고 정확하게 확인할 수 있습니다.


사례3. 동영상에 소리 없이 나오는 텍스트 정보.

후보자 홍보동영상을 보면 밝고 빠른 분위기의 음악을 배경으로 여러 문구들이 화려한 effect를 뿜어내면서 나타났다 사라지고, 효과음과 함께 움직이고 지나갑니다.
시각장애인의 경우 동영상 플레이어에 대한 접근성 제공이 부족하기 때문에 동영상 재생하기조차 힘들지만 동영상을 재생하더라도 성우의 목소리나 동영상에 대한 정보를 제공하는 텍스트 정보가 없기 때문에 해당 동영상의 내용을 인지할 수가 없습니다.

동영상에서 성우가 멋진 목소리로 문구들을 읽어나갈 경우는 그나마 다행이지만 후보자 홈페이지 6곳 중 4곳은 동영상에 대한 텍스트(음성) 정보를 전혀 제공하지 않았습니다. 후보자 홈페이지 중 2곳은 동영상을 제공하는 페이지 안에 (완전하진 않지만) 동영상에 나타나는 글자와 대화 내용을 텍스트로 제공하고 있어서 시각장애인은 물론 청각장애인에 대한 접근성을 보장하고 있었습니다.

시각장애인에게 동영상의 어떤 부분에 텍스트 정보가 필요한지 궁금하시면, 동영상을 틀어놓고 눈을 감고 소리만 들어보시면 쉽게 아실 수 있습니다. ^^


사례4. 스킵 네비게이션과 체계적인 헤딩 정보의 제공

처음 테스트를 진행할 때만 해도 후보자 홈페이지에서 스킵 네비게이션은 기대도 하지 않았습니다. 대다수의 후보자 홈페이지는 선거를 앞두고 새로 만들어지기 때문에 전혀 기대하지 않았죠. 역시나 후보자 홈페이지 6곳 중 5곳은 스킵 네비게이션은 물론 논리적인 헤딩 구조 조차 제공하지 않았습니다.

홈페이지에서 시각장애인에게 중요한 것 중 하나가 페이지 내의 빠른 이동입니다. 웹페이지를 눈으로 보는 경우 메뉴항목와 정보를 제공하는 내용 부분을 한 번 바라보는 것(시선을 보내는 것)만으로 확인할 수 있지만, 스크린리더를 사용하는 경우 방향키나 탭키 등을 하나씩 누르고 소리를 들어서 내용을 확인하고 이동해야 합니다. 시간이 매우 많이 걸리는 작업입니다. 간단히 말해서 눈으로 스치듯이 보면서 지나가는 항목 하나하나를 키보드를 일일이 눌러가면서 확인해야 하는 것입니다. 이런 반복작인(매우 소모적인) 작업을 피하고 원하는 항목으로 빠르게 이동하기 위해 필요한 것이 스킵 네비게이션과 논리적인 헤딩구조 입니다.

스킵네비게이션은 현재 페이지 링크를 통해 메뉴나 메인컨텐츠 부분으로 빠르게 이동하는 기능을 제공합니다. 또한 논리적인 헤딩 구조는 페이지내의 구조(depth)를 알 수 있도록 하며, 스크린리더의 기능으로 헤딩의 구조를 따라서 손쉽게 원하는 항목으로 이동하는 것이 가능합니다.

주목할만한 점은 후보자 홈페이지 1곳은 <본문으로 바로가기> 스킵네비게이션과 논리적인 헤딩 구성으로 시각장애인이 홈페이지안을 이동하는데 큰 도움을 주고 있었습니다.

참고> 스킵네비게이션에 대한 설명
http://naradesign.net/wp/2010/03/13/1221/
http://www.jangkunblog.com/wp/skip-navigation-is-not-a-quick-link/


테스트 진행 후 결론

후보자 홈페이지 접근을 시작할 때는 매우 부정적인 결과를 예상하고 답답한 마음으로 테스트를 진행했습니다. 물론 예상대로 대부분의 페이지에서 접근성을 보장하지 않고 있었지만…. 일부 후보자의 홈페이지는 (전혀 기대하지 않았던) 생각보다 높은 수준의 접근성을 보장하고 있었습니다.

이번 테스트는 현실을 알려보자는데 목적이 있었습니다. 테스트 결과는 부정적이었지만, 부분적으로나마 웹에서 시각장애인의 사용성을 고려하는 움직임이 일고 있다는 것을 확인했다는 것에 큰 의미를 두고 싶습니다.


테스트 기간 : 2010.5.17~24 (약 7일간)

2010/06/02 23:57 2010/06/02 23:57
해빠 이 작성.

[보도자료]

지방선거 사이버 홍보전, 장애인은 철저히 소외
수도권 광역단체장 후보 홈페이지 웹 접근성 수준 기대 이하

6·2 지방선거가 며칠 안 남은 가운데 온라인 홍보전 역시 뜨겁다. 이를 위해 심여를 기우려 만든 후보자들의 선거 홍보 홈페이지는 후보자들의 선거 공약만큼이나 화려하다. 하지만 이들 홈페이지에서 장애인은 또 한번 소외받고 있었다.

지난 2005년 인터넷에서의 동등한 정보접근을 보장하기 위해 정부는 웹 접근성 준수 지침을 국가표준으로 제정하고, 공공분야를 중심으로 많은 개선 노력을 기울여 왔다. 그 결과 이제는 공공기관 홈페이지뿐만 아니라 국내 주요 포털 사이트 역시 웹 접근성 수준이 크게 향상되어 장애인도 비장애인만큼이나 인터넷을 생활 속에서 널리 활용할 수 있게 되었다.

그럼 이번 지방선거의 출마한 후보자들의 선거 홍보 사이트는 어떨까? 대표적으로 최대 격전지로 꼽히고 있는 수도권 광역단체장 후보자들의 홈페이지를 들여다 보았다. 결론부터 말하자면, 몇몇 후보자들의 경우를 제외하고 장애인을 배려한 모습은 찾아보기 어려웠다. 조금만 관심을 갖고 노력했다면 정보 습득 시 인터넷에 크게 의존하는 장애 유권자들의 표심을 확실히 얻을 수 있었으렸만...

지역별로 살펴보면, 인천광역시장에 출마한 송영길 후보와 안상수 후보 모두 홈페이지의 접근성은 매우 낮았다. 마우스를 사용하지 못하는 중증 지체장애인이나 음성 출력에 의존하는 시각장애인은 거의 대부분의 메뉴를 선택조차 하기 힘든 상태였다.

서울 지역의 경우 한명숙 후보의 홈페이지는 상대 오세훈 후보의 사이트에 비해 장애인이 후보자 양력이나 공약 및 활동 상황을 손쉽게 확인할 수 있었다. 오세훈 후보 페이지는 시각장애인이나 지체장애인에 대한 배려는 부족했던 데 비해서 주요 동영상 자료에서 자막을 제공하고 있어 청각장애 유권자들도 후보자의 여러 활동 모습을 동영상을 통해 확인할 수 있었다.

경기도의 경우 유시민 후보 사이트는 수도권 후보자들의 사이트들 중 가장 접근성이 잘 보장되어 있었다. 어떤 장애를 갖고 있는 유권자라도 유 후보가 누구인지, 어떤 공약을 갖고 출마했는지 등을 메뉴를 하나하나 눌러가며 확인할 수 있었다. 이에 비해 김문수 후보의 홈페이지는 이미지 링크에 대해 대체 텍스트를 제공하고 있지 않아 시각장애 유권자가 방문했을 때 김 후보에 대한 어떤 정보도 얻기 어려운 상태였다. 손동작에 어려움을 겪는 지체장애인 역시 이용에 불편을 겪을 수밖에 없었다. (각 후보 홈페이지 평가 결과는 아래 도표 참조.)


이번 웹 사이트 평가를 직접 담당한 ‘정보접근성사용자모임’ 박문수 활동가는 “출마자들의 면면을 알아보고 투표에 임하는 것은 유권자의 기본 의무이다. 유세장을 찾거나 각종 홍보 유인물을 이용하기 어려운 중증 장애인들은 후보자 선택을 위해 인터넷에 공개된 정보에 크게 의존할 수밖에 없는데, 정작 후보자들의 홈페이지는 이런 처지의 장애 유권자를 전혀 고려하고 있지 않아 안타깝다”며, “인터넷이 점점 더 우리의 생활에서 중요해지고 있는 요즘, 선출직 후보자들부터 솔선하여 웹 접근성 표준을 준수할 때 장애와 차별 없는 인터넷 세상을 좀 더 빨리 실현할 수 있지 않겠는가”라고 평가 소감을 밝혔다.

현행 ‘장애인차별금지 및 권리구제 등에 관한 법률’ 제27조 3항에서는 공직선거후보자 및 정당은 장애인에게 후보자 및 정당에 관한 정보를 장애인 아닌 사람과 동등한 정도의 수준으로 전달할 것을 규정하고 있다. ‘정보접근성 사용자 모임’ 회원 20여명은 이번 평가 결과를 바탕으로 선거 후보자들의 홈페이지에서의 장애인 차별 시정을 인권위에 요청하는 한편, 선거관리위원회에도 문제를 제기할 예정이다.

 

수도권 광역단체장 후보자 홈페이지 평가 결과

후보자

자막 제공

키보드 접근(%)

대체 텍스트
 제공(%)

폼 컨트롤
레이블 제공(%)

김문수
www.kimmoonsoo.or.kr

낮음

낮음

21

0

송영길
www.bull.or.kr

낮음

좋음

해당 없음

해당 없음

안상수
www.ahnsangsoo.kr

낮음

낮음

해당 없음

해당 없음

오세훈
www.ohsehoon.kr

보통

보통

8

64

유시민
www.usimin.net

낮음

가장 좋음

84

52

한명숙
www.seoul2010.net

가장 좋음

좋음

99

0



2010.5.31

정보접근성사용자모임
박문수, 김혜일

2010/06/02 01:29 2010/06/02 01:29
해빠 이 작성.

센스리더 프로페셔널 에디션 v1.2.0.5 베타 다운로드


1. 지원 운영체제 : Windows XP / Vista / 7 (32bit)

2. 사용자계정컨트롤 : setup 실행 이후 사용자 콘트롤(UAC)에 의해 경고 메시지가 나타나면 예(Alt-Y)를 눌러 다음 단계로 진행

3. 1.2.0.5 베타는 자동 업그레이드는 지원하지 않고 설치 버전으로만 제공됩니다.

4. 환경 설정 : 센스리더 설치 이후 파일 메뉴의 '비디오 디바이스 모드'를 선택하고, 윈도우즈 시각효과는 '최적 성능으로'로 변경해서 사용하시기를 권장합니다.

5. 수정 사항 :
   1) 센스리더 설치시 그래픽 드라이버 설치 문제 개선.
   2) 독서기의 한글, 오피스 문서 열기 오류 수정
   3) 인터넷, 편집기에서의 연속읽기 오류 수정.
   4) 인터넷에서의 Alt 속성 처리 오류 수정
   5) 주소록의 암호 처리 버그
   6) Windows 7 32bit 지원

-------------------------------------------------------------------------------------------------------------------------

설치파일 다운로드 (네트워크 상황에 따라 적절한 곳 선택)

다운로드1 : xvsrd_pro-v1205beta.zip  (ideebee.com - ZIP/404.2MB)
1) 좌측하단의 저속다운로드를 클릭합니다.
2) 10초를 기다린 후 원본파일 다운로드를 클릭해서 파일을 다운로드 받습니다.

다운로드2 : xvsrd_pro-v1205beta.zip  (megaupload.com - ZIP/404.2MB)
1) 우측상단의 그림문자를 입력하고 파일 다운로드(download file)를 클릭합니다.
2) 45초를 기다린 후 일반 다운로드(Regular download)를 클릭해서 파일을 다운로드 받습니다.
* 다운로드 속도가 가장 빠름.

다운로드3 : xvsrd_pro-v1205beta.part1.rar / xvsrd_pro-v1205beta.part2.rar  (mediafire – RAR/199MB/187MB)
우측중간의 Click here to start download를 클릭해서 파일을 다운로드 합니다.
* 2개의 파일을 모두 다운로드 받아야 합니다.
* 광고창에 주의합니다.

* 센스리더의 라이센스가 없는 경우 데모 상태로 30분간 사용이 가능합니다.

2010/05/25 17:42 2010/05/25 17:42
해빠 이 작성.

센스리더 프로페셔널 에디션 v1.2.0.3 다운로드


지원 운영체제 : Windows XP / Vista (32bit)

설치 시 자동설치를 선택을 권장하며
센스리더 기본설정 포스팅을 참고해서 설정하세요

-------------------------------------------------------------------------------------------------------------------------

설치파일 다운로드 (네트워크 상황에 따라 적절한 곳 선택)

다운로드1 : xvsrd_pro-v1203a.zip  (ideebee.com - ZIP/394.1MB)
1) 좌측하단의 저속다운로드 클릭합니다.
2) 10초를 기다린 후 원본파일 다운로드를 클릭해서 파일을 다운로드 받습니다.

다운로드2 : xvsrd_pro-v1203a.zip  (megaupload.com - ZIP/394.1MB)
1) 우측상단의 그림문자를 입력하고 파일 다운로드(download file)를 클릭합니다.
2) 45초를 기다린 후 일반 다운로드(Regular download)를 클릭해서 파일을 다운로드 받습니다.
* 다운로드 속도가 가장 빠름.

다운로드3 : xvsrd_pro-v1203a.part1.rar / xvsrd_pro-v1203a.part2.rar  (mediafire – RAR/199MB/187MB)
우측중간의 Click here to start download를 클릭해서 파일을 다운로드 합니다.
* 2개의 파일을 모두 다운로드 받아야 합니다.
* 광고창에 주의합니다.

* 센스리더의 라이센스가 없는 경우 데모 상태로 30분간 사용이 가능합니다.

2010/05/25 17:41 2010/05/25 17:41
해빠 이 작성.

시각장애인은 센스리더를 통해서 인터넷 뿐 아니라 다양한 프로그램을 활용할 수 있는데요.
그중 가장 대표적인 프로그램에 대한 간단한 팁을 공유합니다.

 
[TIP] 센스리더를 통한 한/글 2007 활용




[TIP] 센스리더를 통한 Excel / Powerpoint 활용




[TIP] 센스리더를 통한 PDF 활용




[TIP] 센스리더를 통한 전자 도서관 활용




-------------------------------------------------------------------------------------------------------------------------
위 내용은 Sense Reader Professional Edition v1.2.0.3 을 기준으로 확인되었습니다. 각 응용 프로그램에 대한 버전은 각 파일에서 언급하고 있으므로 해당내용을 참고하세요.
첨부한 파일을 정보 습득 이외의 다른 목적으로 사용하는 것은 불허하며, 스크랩할 경우 출처를 밝혀주시기 바랍니다.
위 내용은 2010년 4월 26일 최종 확인 및 작성되었습니다.
-------------------------------------------------------------------------------------------------------------------------

2010/04/26 21:44 2010/04/26 21:44
해빠 이 작성.

접근성을 보장하는 플래시에 대한 관심이 많고 제작도 되고 있지만
실제로 제작에 대한 팁은 많이 공유되지 않고 있는 것 같습니다.
참고가 될만한 포스팅이 있어서 소개합니다.

 
플래시 네비게이션의 웹접근성 향상방안 1
http://blog.naver.com/qenie/60062695258

플래시 네비게이션의 웹접근성 향상방안 2
http://blog.naver.com/qenie/60062695117
2010/04/26 16:36 2010/04/26 16:36
해빠 이 작성.

몇 해 전부터 광고 게시글 때문에 커뮤니티와 사이트들이 가입절차를 까다롭게 만들고 있습니다. 가입등급에 글쓰기 권한을 부여하지 않거나, 별도의 추가 질문에 대한 답변을 요구하고 그 답변의 성실도에 따라 가입을 승인해주는 등 여러 가지 방법이 사용되어 왔습니다.

이런 방법들은 관리자의 처리량이 늘어나기 때문에 사이트 운영 편의를 위해 가입을 확인/승인하는 보안메일을 보내거나 가입 과정에서 보안문자를 입력하도록 하는 경우도 많아지고 있습니다.

보안메일은 크게 문제가 되지 않지만 보안문자 입력의 경우는 시각장애인에게 접근성이 매우 떨어지는 방법입니다. 그림으로 표현되는 글씨를 눈으로 확인해야하는 작업이라 시각장애인이 혼자서 이것을 직접 하는 것을 불가능합니다. 그렇다고 카페나 사이트를 가입할 때마다 보이는 분에게 도움을 요청하기도 어려운 노릇이죠. 다른 정보들은 다 입력해놓고 보안문자에 걸려서 가입을 못하는 경우들이 종종 생기고 있습니다.


그림으로 된 보안문자 입력 부분에 있어서 대표적인 포털사이트인 다음과 네이버를 비교해보겠습니다.


먼저 네이버(www.naver.com) 카페의 가입 부분입니다.

네이버카페보안문자입력 
카페 가입시 위와 같은 그림문자 입력 부분이 나타납니다. 문자를 입력하는 편집창과 새로고침 링크만 있을 뿐 시각장애인은 아무리 살펴봐도 저 그림문자를 읽어서 입력할 수 있는 방법이 없습니다.


이번엔 다음(www.daum.net) 카페의 가입을 살펴보겠습니다.

다음보안문자입력

다음 카페는 네이버와는 달리 스피커 그림의 버튼이 있습니다. 저 버튼에 적혀있는 대체 텍스트는 “들리는 대로 문자 5개를 입력해주세요”입니다. 저 곳에서 엔터를 누르면 해당 그림문자를 음성으로 출력하는 기능을 합니다. 이 기능을 사용하면 시각장애인이더라도 출력되는 음성을 듣고 혼자서 그름문자를 입력하는 보안절차를 통과할 수 있습니다.


국내 사이트 외에도 구글의 지메일(www.gmail.com)을 가입할 때도 시각장애인에 대한 배려가 있는데요.

지메일가입보안문자입력

지메일에 가입할 때 위와 같은 그림문자 입력하는 절차가 나오는데 편집 창 오른쪽에 휠체어 그림이 있습니다. 저 그림에 달려있는 대체 텍스트는 “Listen and type the numbers you hear”입니다. 저 부분을 클릭하고 들어봤을 때… 당최 무슨 소리인지 알아들을 수는 없었지만;;; 장애인을 위한 배려가 있다는 것만으로도 의미가 있는 것 같습니다.


웹접근성의 기본을 다시 한번 생각해보고 싶습니다. “장애가 있더라도 비장애인과 동일한 웹을 누리게 하자”는 취지가 모든 사이트에 반영되었으면 합니다.
웹접근성을 보장한다는 취지에서 다음 카페의 보안문자 입력은 아주 좋은 본보기라고 할 수 있습니다. 보안문자 입력은 비시각장애인은 그냥 지나칠 수 있는 부분이지만, 이것을 놓치지 않았다는 점에 의미가 있습니다. 특정 장애영역에서 접근할 수 없는 부분에 대해 대체수단을 제공한다는 정신이 아주 중요합니다. 이러한 정신으로 웹을 만들 때만 비로소 진정한 접근성이 보장되는 웹을 구현할 수 있을 것 같습니다.

보안문자에 대한 백남중 부장님의 포스팅을 참고해보세요.
http://njpaiks.egloos.com/2848997


-------------------------------------------------------------------------------------------------------------------------
위 내용은 보안문자 입력을 설정해놓은 카페에만 해당하는 부분입니다. 보안문자 입력을 설정해놓지 않은 카페에서는 시각장애인이 가입을 하는데 문제가 되지 않습니다.
또한 특정 사이트가 나쁘다라는 비방을 하기 위한 것도 아닙니다. 좋은 예를 들어서 앞으로의 발전 방향을 제시하는 것이 목적입니다.
위 내용은 2010년 4월 20일 기준으로 작성되었습니다.
-------------------------------------------------------------------------------------------------------------------------

2010/04/20 13:59 2010/04/20 13:59
해빠 이 작성.

이미지에 대한 alt 태그 사용과 alt=”” 버그

센스리더는 웹페이지내의 이미지에 대해 기본적으로는 파일명을 음성출력합니다. 하지만 파일명만으로는 해당 이미지에 대한 정보를 정확히 알 수 없기 때문에 alt 태그의 정보를 활용하게 됩니다. 이미지에 대해 alt 태그로 정보를 넣어줄 경우 스크린리더는 해당 내용을 파일명 대신 음성출력하게 됩니다.



이미지의 alt 태그 유무에 따른 음성출력 예
<img src=”sub_g01.gif”>
<img src=”sub_go1.gif: alt=”전송”>
sub_g01.gif 이미지
전송 이미지


alt 태그의 정보를 활용해 음성출력하면 모든 이미지에 대해 alt 정보를 제공해야 하는지에 대한 논란이 발생할 수 있습니다. 일반적으로 의미를 갖지 않는 경계선/배경/불릿 등에 대해서는 alt=””과 같이 공백문자 처리를 함으로서 스크린리더가 이미지 파일명 조차 읽지 않고, 아무것도 없는 듯이 지나가도록 처리하고 있습니다.



이미지의 alt태그 활용 예
<img src=”sub_g01.gif”>
<img src=”hor_line01.gif” alt=””>
<img src=”sub_go1.gif: alt=”전송”>
sub_g01.gif 이미지
(아무것도 없는 듯 지나감) 
전송 이미지


위와 같이 이미지에 대해 alt=”” 태그를 사용하면 불필요한 이미지에 대한 음성출력을 막을 수 있습니다. 하지만 센스리더 프로 1.2.0.3 의 경우 이에 대한 처리에 버그가 있어서 이미지로 음성을 출력하게 됩니다. 이 버그는 1.2.0.4 BETA 이후 수정되었습니다.


센스리더 프로 v1.2.0.3 버그 (v1.2.0.4 이후 수정)
<img src=”sub_g01.gif”>
<img src=”hor_line01.gif” alt=””>
<img src=”sub_go1.gif: alt=”전송”>
sub_g01.gif 이미지
이미지
전송 이미지


이미지를 링크로 사용하는 경우가 많은데 이에 대한 음성출력은 다음과 같습니다.


이미지 링크에서 alt와 title
<a href=”#”><img src=”sub_g01.gif” alt=”전송”></a>
<a href=”#” title=”새창으로”><img src=”sub_g01.gif” alt=”전송”></a>
<a href=”#” title=”새창으로”target=”_blank”><img src=”sub_g01.gif” alt=”전송”></a>
<a href=”#” title=”새창으로”><img src=”sub_g01.gif”></a>
전송 그래픽 링크
전송 그래픽 링크
전송 새창 그래픽 링크

새창으로 그래픽 링크


이미지에서는 alt 값이 title 보다 우선합니다. a 태그 안에 있는 title 값도 img 안에 alt값이 있기 때문에 alt 값을 음성출력하게 됩니다. 링크에서 target=”_blank”는 스크린리더에서 인지해서 새창으로 음성출력하기 때문에 굳이 사용하지 않으셔도 문제가 없습니다.


-------------------------------------------------------------------------------------------------------------------------
위 내용은 센스리더 프로페셔널 에디션 v1.2.0.4를 기준으로 Internet Explorer 8에서 확인된 내용이며
2010년 4월 12일 기준으로 작성되었습니다.
------------------------------------------------------------------------------------------------------------------------

2010/04/12 14:15 2010/04/12 14:15
해빠 이 작성.

센스리더 프로페셔널 에디션 v1.2.0.4 BETA (Windows 7 지원) 변경사항 안내

드디어 Windows 7 x86 운영체제를 지원하는 센스리더 프로페셔널 베타 버전이 공개되었습니다.
x64의 경우는 현재 개발이 진행중이어서 조만간 새로운 버전으로 나올 것 같습니다.

이번 업그레이드는 패치가 아닌 설치파일 형태로만 제공된다고 합니다. 설치파일은 시각장애인 커뮤니티인 ‘넓은마을’에만 업로드 되어있기 때문에, 비장애인중 필요하신 분은 엑스비전 고객지원(02-888-1623)으로 전화를 하시면 이메일을 통해 설치파일을 제공해 드립니다.

저한테 달라고 하셔도 보내드립니다 ^^;


변경사항

1. Windows 7 32bit 지원.(XP, Vista 포함)

2. Sense 주소록의 암호 처리 버그 수정

3. 인터넷에서의 Alt 속성 처리 오류 수정

4. 가상커서 마크 목록 버그 수정


주의!! 센스리더 설치 시 드라이버 설치 경고가 나오는데 반드시 설치하셔야 합니다.

2010/04/12 10:47 2010/04/12 10:47
해빠 이 작성.

폭폭이 님이 리뷰하신 내용이 좋아서 스크랩합니다.

목록 태그에 대한 내용과 플래시 지원에 대한 내용들이 포함되어 있습니다.

http://blog.naver.com/butygal/50080391250

내용 중 새창 링크의 경우는 오해가 있는 것 같습니다.
가상커서 기본값에서는 target="_blank"를 '새창링크'라고 음성출력이 됩니다.
해당 내용은 <Ctrl-Shift-F9>를 눌러서 가상커서 설정에 들어가사면 음성출력이 되지 않도록 설정하실 수 있습니다.
2010/02/08 11:24 2010/02/08 11:24
해빠 이 작성.

« Prev : 1 : 2 : 3 : 4 : 5 : 6 : Next »