Home > 웹 콘텐츠 신기술 제작기법 > 접근성 있는 Flash 제작기법 > Flash 콘텐츠 구현 예 > 사용자 UI를 고려한 콘텐츠
웹 페이지에 가장 많이 사용되는 Flash 콘텐츠의 하나가 스크롤 배너이다. 스크롤 배너에도 일정한 시간 간격으로 스스로 스크롤하는 배너, 좌우 이동 버튼을 누를 때마다 좌우로 스크롤 하는 배너, 그리고 배너의 수만큼 버튼을 제공하여 직접 해당 배너로 이동할 수 있도록 한 배너 등이 대표적이다.
버튼을 이용한 스크롤 배너는 배너의 수만큼 버튼을 제공하고, 버튼에 초점이 주어질 때나 마우스 포인터를 해당 버튼에 올릴 때마다 버튼에 대응하는 배너가 화면에 나타난다. 만일 해당 배너로 이동하고자 할 경우에는 해당 버튼을 클릭하거나 초점이 주어진 상태에서 Enter 키를 누르면 된다.
이 스크롤 배너를 접근성 있게 만들기 위해서는 배너를 이미지로 구성한다. 만일 스크롤 배너용 배너를 무비클립이나 버튼으로 만들면 각각의 배너로 초점이 이동하므로 주의하여야 한다. 스크롤 배너를 4개의 이미지로 구성한다고 하면, 이들 4개의 이미지 파일은 대응되는 4개의 버튼에 연결되어야 한다. 따라서 이 스크롤 배너에서는 버튼의 접근성이 매우 중요하다.
버튼은 화면에 나타나는 순서와 동일한 순서로 초점이 주어지도록 탭 인덱스를 설정하여야 한다. 앞에서도 이야기 하였지만 액세스 가능성 패널에서 설정한 탭 인덱스는 Tab 키에 의한 이동 순서를 의미한다.
화면 낭독 프로그램은 초점이 주어진 버튼에 대한 대체 텍스트를 읽어주므로 모든 버튼은 액세스 가능성 패널의 이름난 또는 설명난에 적절한 대체 텍스트를 제공하여야 한다. 이러한 경우에 Flash에서는 배너로 사용되는 이미지에는 대체 텍스트를 제공할 수 없으며, 또한 제공할 필요도 없다.
자동 스크롤 배너와 같이 4개의 이미지를 아래 예제와 같이 4개의 버튼과 배너 창으로 이루어진 스크롤 배너 구성 방법을 살펴보자.
[그림] 4개 버튼과 배너창으로 구성된 스크롤 배너 예제
우선 4개의 이미지에는 대체 텍스트를 제공하지 않는다. 대신 4개의 버튼에 대한 액세스 가능성 패널을 이용하여 대체 텍스트를 제공하여야 한다. 각 버튼별로 액세스 가능성 패널의 설정 방법은 아래의 표와 같다.
| 이미지 번호 |
하이퍼 텍스트 링크 |
액세스 가능성 패널 설정 | ||||
|---|---|---|---|---|---|---|
| 무비를 액세스 가능하게 만들기 |
자식 객체 액세스 가능 |
이름 | 설명 | Tab 인덱스 |
||
| 1 | http:// ... | 체크 | 언체크 | 질의응답 | 질의분야를 선택하신후... 공간입니다. |
1 |
| 2 | http:// ... | 체크 | 언체크 | 나의질의조회 | 질의하신 질문과 ... 공간입니다. |
2 |
| 3 | http:// ... | 체크 | 언체크 | 고객센터 FAQ | 질의를 신청하기전... 확인하실 수 있습니다 |
3 |
| 4 | http:// ... | 체크 | 언체크 | 고객상담안내 | 고객의 효과적인 상담을 ... 안내페이지입니다. |
4 |
웹의 힘은 그것의 보편성에 있다. 장애에 구애없이 모든 사람이 접근할 수 있는 것이 필수적인 요소이다.
(The power of the Web is in its universality, Access by everyone regardless of disability is an essential aspect.)
팀 버너스 리 경 - 웹의 창시자 (Tim Berners - Lee , W3C Director and inventor of the World Wide Web)
