ASP.NET의 내게 필요한 옵션 지원
업데이트: 2007년 11월
ASP.NET을 사용하면 장애가 있는 사용자가 액세스할 수 있는 웹 응용 프로그램을 만들 수 있습니다. 내게 필요한 옵션이 지원되는 웹 응용 프로그램을 사용하면 화면 판독기와 같은 보조 기술을 사용하여 웹 페이지 작업을 수행할 수 있습니다. 내게 필요한 옵션이 지원되는 웹 응용 프로그램에는 다음과 같은 이점이 있습니다.
응용 프로그램을 사용할 수 있는 대상자의 범위가 다양합니다.
장애가 있는 사용자뿐만 아니라 모든 사용자에게 유용한 디자인 원칙을 포함합니다.
모든 웹 응용 프로그램을 사용할 수 있어야 하는 여러 기관의 요구 사항을 충족할 수 있습니다.
내게 필요한 옵션 지침 및 이러한 지침을 충족시킬 수 있도록 ASP.NET에서 제공하는 방법을 이해하면 장애가 있는 사용자가 좀 더 쉽게 상호 작용할 수 있는 응용 프로그램을 만들 수 있습니다.
내게 필요한 옵션 지침
많은 조직에서는 내게 필요한 옵션이 지원되는 응용 프로그램을 만드는 방법과 관련된 지침을 발표합니다. 이 중에서도 다음과 같은 지침이 잘 알려져 있습니다.
WCAG(Web Content Accessibility Guidelines) 1.0
이러한 표준은 W3C(World Wide Web 컨소시엄)에서 개발했으며 다른 많은 내게 필요한 옵션 표준의 기본으로 사용됩니다. 여기에는 전세계의 정부에서 사용하는 내게 필요한 옵션 표준이 포함됩니다.
웹 콘텐츠와 관련된 내게 필요한 옵션 표준을 보려면 W3C(World Wide Web Consortium) 웹 사이트를 참조하십시오.
WCAG 지침에는 각 지침과 관련된 검사점에 대해 1~3의 단계를 사용하여 다양한 우선 순위 수준이 정의되어 있습니다. 일부 기관의 경우에는 우선 순위 1 및 2 검사점을 준수하는 웹 사이트만 허용합니다.
Section 508
미국 정부는 Rehabilitation Act의 Section 508에 WCAG와 비슷한 내게 필요한 옵션 표준을 정의합니다.
Section 508 지침을 보려면 http://www.section508.gov 사이트를 참조하십시오.
Microsoft의 내게 필요한 옵션 지침
Microsoft의 내게 필요한 옵션 지침을 보려면 Microsoft Accessibility 및 MSDN Library 사이트에서 "Accessibility Design Guidelines for the Web"을 검색하십시오.
내게 필요한 옵션 테스트
타사에서 제공하는 다양한 도구를 사용하여 웹 페이지가 내게 필요한 옵션 표준에 잘 맞는지 테스트할 수 있습니다.
Microsoft Visual Studio 2005와 같은 개발 환경을 사용하는 경우에는 내게 필요한 옵션 테스트 도구가 제공됩니다. 자세한 내용은 제품 설명서를 참조하십시오. 그러나 디자인 타임에 사용하는 내게 필요한 옵션 유효성 검사 도구는 ASP.NET 서버 컨트롤 또는 사용자가 작성한 코드에 의해 렌더링되는 태그처럼 동적으로 생성되는 출력을 테스트하지 않습니다. 디자인 타임에 내게 필요한 옵션 유효성 검사 도구를 사용하는 것 외에 페이지 출력도 테스트해야 합니다.
내게 필요한 옵션 자동 테스트를 수행하면 페이지나 웹 사이트의 내게 필요한 옵션을 완벽하게 진단할 수 없습니다. 내게 필요한 옵션 지침 중 대부분은 페이지의 기능이 지침에 맞는지 여부를 확인하기 위해 사용자가 직접 판단해야 합니다. 예를 들어 자동화된 테스트를 수행하면 페이지의 모든 이미지에 alt 텍스트를 제공했는지 여부를 확인할 수 있습니다. 그러나 alt 텍스트가 해당 이미지를 설명하는지 여부는 확인할 수 없습니다. 마찬가지로 자동 테스트를 수행하면 페이지에 사용되는 색이 고대비 텍스트가 필요한 사용자에게 대비를 충분히 제공하는지 여부를 객관적으로 확인할 수 없습니다. 따라서 내게 필요한 옵션이 지원되는 응용 프로그램을 만들려면 내게 필요한 옵션 지침에 맞는 페이지를 만들 수 있도록 지침의 세부 특성과 목적을 잘 알고 있어야 합니다. 도구를 통해 내게 필요한 옵션 확인을 수행할 수 없는 경우의 다른 예제를 보려면 모퉁이가 둥근 표 테두리처럼 그래픽만 포함된 이미지에 alt 텍스트가 있어야 합니다. 그렇지 않은 경우에는 화면 판독기에서 이미지 파일을 읽습니다. alt 텍스트가 비어 있는 경우 화면 판독기에서는 이미지를 건너뜁니다.
ASP.NET의 내게 필요한 옵션 기능
대부분의 경우 ASP.NET 컨트롤은 내게 필요한 옵션 표준에 맞는 페이지를 생성하는 태그를 렌더링하거나 내게 필요한 옵션이 지원되는 페이지를 만들기 위해 설정할 수 있는 속성을 노출합니다. 그러나 경우에 따라 ASP.NET 컨트롤은 내게 필요한 옵션 표준 중 일부 규칙에 맞지 않는 출력을 렌더링하기도 합니다. 자세한 내용은 ASP.NET 컨트롤 및 내게 필요한 옵션을 참조하십시오.
내게 필요한 옵션을 지원하는 일반적인 컨트롤 기능
일반적으로 ASP.NET 컨트롤은 다음과 같은 방식으로 내게 필요한 옵션 요구 사항을 충족시킵니다.
텍스트가 아닌 요소에 해당하는 텍스트를 지정하는 방법을 제공합니다.
색 종속성을 사용하지 않습니다.
표에 캡션과 열 머리글을 렌더링합니다.
div 요소를 포함하는 fieldset 및 legend 요소를 렌더링합니다.
스타일시트를 사용하지 않습니다.
스타일 속성을 사용하여 위치 지정을 지원합니다.
레이블을 컨트롤과 연결합니다.
예를 들어 마우스만 클릭할 경우에는 응답하지 않는 스크립트처럼 장치 독립적인 클라이언트 스크립트를 생성합니다.
키보드 액세스
내게 필요한 옵션 기능 중 중요한 기능은 다른 입력 형식을 통해서도 페이지의 기능을 사용할 수 있어야 한다는 것입니다. 실제로 마우스를 사용하여 완료할 수 있는 작업을 키보드에서도 완료할 수 있어야 합니다.
ASP.NET을 사용하면 다음과 같은 방식으로 페이지에 대한 키보드 지원을 포함할 수 있습니다.
TabIndex 속성을 사용하여 컨트롤에 탭 순서를 설정할 수 있습니다.
DefaultButton 속성을 설정하여 폼 또는 Panel 컨트롤에 기본 단추를 지정할 수 있습니다.
SetFocus 같은 메서드를 사용하거나 폼에 DefaultFocus 속성을 설정하여 입력 컨트롤에 포커스를 설정할 수 있습니다.
AccessKey 속성을 설정하여 단추 컨트롤에 선택키를 정의할 수 있습니다.
텍스트 상자에 Label 컨트롤을 사용하여 텍스트 상자에 대한 선택키를 정의할 수 있습니다. 자세한 내용은 방법: 캡션으로 Label 웹 서버 컨트롤 사용을 참조하십시오.
이미지와 대체 텍스트
내게 필요한 옵션 지침에 따르면 데이터 컨트롤에서 렌더링하는 단추 또는 이미지로 사용되는 경우와 같이 페이지에서 기능적인 용도로 사용되는 이미지에 대체 텍스트를 제공하는 것이 좋습니다. 이렇게 하면 화면 판독기에서 페이지에 있는 각 이미지의 용도를 보고할 수 있습니다. 이미지가 장식 용도 외에 다른 기능적 의미가 없는 경우에는 화면 판독기에서 해당 이미지를 건너뛸 수 있도록 대체 텍스트를 빈 문자열로 설정해야 합니다.
기본적으로 Image, ImageButton 및 ImageMap 컨트롤은 의미 있는 텍스트를 자동으로 생성할 수 없으므로 대체 텍스트를 렌더링하지 않습니다. 대신 개발자가 직접 텍스트를 제공해야 합니다. 내게 필요한 옵션 확인 도구는 대체 텍스트가 없는 이미지 컨트롤을 지침을 위반하는 컨트롤로 플래그 표시합니다.
이미지 컨트롤의 경우 컨트롤에 대해 다음 중 하나를 수행해야 합니다.
AlternateText 속성을 의미 있는 텍스트로 설정합니다.
GenerateEmptyAlternateText 속성을 true로 설정하여 ASP.NET Image 컨트롤이 빈 문자열을 대체 텍스트로 렌더링하도록 합니다. 대체 텍스트가 비어 있으면 내게 필요한 옵션 확인 도구는 개발자가 고의로 해당 이미지를 중요하지 않은 이미지로 표시했다고 해석합니다.
기본 이미지 또는 링크가 포함된 컨트롤
TreeView 컨트롤, Menu 컨트롤 및 웹 파트 같은 일부 컨트롤은 이미지나 링크를 태그의 일부로 렌더링합니다. 이런 경우 컨트롤은 각 이미지 또는 링크에 대해 기능을 설명하는 대체 텍스트를 만듭니다.
예를 들어 TreeView 컨트롤은 각 노드에 대한 확장 및 축소 단추의 이미지를 렌더링합니다. TreeView 컨트롤은 노드의 텍스트를 기반으로 이러한 이미지의 대체 텍스트를 생성합니다. 기본적으로 시작이라는 텍스트가 포함된 노드를 확장하는 이미지의 대체 텍스트는 확장 시작으로 렌더링됩니다. TreeView 컨트롤의 ExpandImageToolTip 및 CollapseImageToolTip 속성을 설정하여 대체 텍스트를 지정할 수 있습니다.
마찬가지로 메뉴 명령은 메뉴 항목을 확장 및 축소하기 위해 생성하는 링크의 대체 텍스트를 렌더링합니다. 웹 파트 컨트롤 제목 표시줄의 단추는 각 단추의 기능을 설명하는 대체 텍스트를 렌더링합니다.
반복 링크 건너뛰기
화면 판독기와 같은 보조 기술 장치에서는 페이지가 나타나는 순서대로 해당 페이지의 모든 링크를 열거해야 합니다. 웹 사이트에서 모든 페이지의 맨 위에 나타나는 마스터 페이지 메뉴의 경우 화면 판독기는 페이지의 주 내용을 가져오기 전에 각 페이지의 모든 항목을 읽어야 합니다. 이러한 경우를 위해 사용자가 반복 링크 목록을 건너뛸 수 있는 방법을 제공하는 것이 좋습니다. 다음 컨트롤은 반복 링크를 건너뛰는 방법을 구현합니다.
이러한 각 컨트롤은 SkipLinkText 속성을 지원합니다. 이 속성이 문자열(원하는 모든 텍스트 포함 가능)로 설정되면 컨트롤은 대체 텍스트와 함께 보이지 않는 .gif 이미지를 포함하는 앵커를 링크 앞에 렌더링합니다. 기본 대체 텍스트는 탐색 건너뛰기 링크이지만 텍스트를 직접 구성할 수 있습니다. 이 앵커는 컨트롤 다음에 나오는 다른 앵커에 연결됩니다. 이렇게 하면 사용자는 화면 판독기 및 이와 유사한 기술을 통해 페이지의 시각적 디스플레이를 방해하지 않고 컨트롤에서 생성하는 링크를 건너뛸 수 있습니다. SkipLinkText 속성이 빈 문자열로 설정되면 컨트롤에서 앵커 태그를 렌더링하지 않습니다.
표를 렌더링하는 컨트롤
내게 필요한 옵션 지침에 따르면 HTML 표에 다음 항목을 포함하는 것이 좋습니다.
보조 기술 장치에서 표의 용도를 식별하는 데 유용한 캡션
열 머리글을 식별하는 방법
Table 컨트롤을 사용하여 표를 만드는 경우 Caption 속성을 명시적으로 설정할 수 있습니다. TableHeaderRow 클래스를 사용하고 TableSection 속성을 TableRowSection 클래스의 TableHeader 열거형으로 설정하여 표 머리글을 만들 수 있습니다. 이렇게 하면 표에서 thead 요소가 렌더링됩니다. TableCell 컨트롤을 사용하여 셀을 만드는 경우 셀의 각 AssociatedHeaderCellID 속성을 표 머리글 셀의 ID로 설정할 수 있습니다. 이렇게 하면 셀에서 해당하는 열 머리글과 셀을 연결하는 header 특성이 렌더링됩니다.
다음 ASP.NET 서버 컨트롤은 HTML 표를 렌더링할 수 있습니다.
이러한 컨트롤을 사용하면 Caption 및 CaptionAlign 속성을 사용하여 결과 표에 대해 권장되는 캡션을 만들 수 있습니다.
이러한 컨트롤의 경우 UseAccessibleHeader 속성을 설정하면 컨트롤에서 scope 특성이 포함된 th 요소를 렌더링하여 열 머리글을 식별합니다.
DataList와 Repeater라는 두 개의 추가 컨트롤은 thead 또는 th 요소를 자동으로 렌더링하지 않습니다. 그러나 이러한 컨트롤에 대한 머리글 템플릿을 정의할 수 있습니다. DataList 컨트롤의 경우 머리글 템플릿은 th 요소를 렌더링합니다. Repeater 컨트롤은 태그를 자동으로 렌더링하지 않으므로 태그를 지정할 수 있는 머리글, 본문 및 바닥글 템플릿을 개발자가 정의해야 합니다. Repeater 컨트롤에서 HTML 표를 렌더링하도록 지정하는 경우에는 내게 필요한 옵션 표준에 맞는 적절한 태그를 포함해야 합니다.
div 요소를 렌더링하는 컨트롤
내게 필요한 옵션 지침에 따르면 길이가 긴 폼을 쉽게 탐색할 수 있도록 여러 영역으로 구분하는 것이 좋습니다. HTML 4.0에서는 웹 페이지 개발자가 폼을 여러 영역으로 구분하는 데 사용할 수 있는 fieldset 및 legend 요소를 도입했습니다.
ASP.NET에서는 Panel 컨트롤을 사용하여 폼에서 하위 영역을 만들 수 있습니다. 컨트롤의 GroupingText 속성을 문자열로 설정하는 경우 Panel 컨트롤은 내용에 대한 fieldset 요소가 포함된 div 요소와 GroupingText 속성에 사용한 문자열이 포함된 legend 요소를 렌더링합니다.
일부 웹 파트 컨트롤도 div 요소를 렌더링합니다. 이러한 컨트롤은 fieldset 및 legend 요소를 자동으로 렌더링합니다.
유효성 검사 컨트롤
대부분의 웹 페이지에서는 반드시 입력해야 하는 필수 항목이 있는 경우 또는 사용자가 데이터를 입력할 때 오류가 발생한 경우 텍스트 상자 옆에 별표(*)가 표시됩니다. 별표는 큰 의미가 없으므로 유효성 검사기 컨트롤의 Text 및 ErrorMessage 속성에 의미 있는 오류 메시지를 항상 지정해야 합니다.
또한 유효성 검사기 컨트롤에서 클라이언트 스크립트를 해제해야 합니다(EnableClientScript=false).
Login 컨트롤
Login, ChangePassword, PasswordRecovery 및 CreateUserWizard 같은 Login 컨트롤은 Label, TextBox 및 유효성 검사기 컨트롤 등의 다른 컨트롤을 포함합니다. 웹 페이지 개발자는 Login 컨트롤에서 렌더링하는 대상을 직접 제어하지 못할 수 있으므로 내게 필요한 옵션 표준에 맞는 컨트롤이 되도록 디자인해야 합니다. 예를 들어 이러한 컨트롤은 내게 필요한 옵션을 지원하기 위해 다음과 같은 동작을 나타냅니다.
텍스트 상자에 레이블이 연결되어 있습니다.
입력 컨트롤에 탭 인덱스 설정이 있습니다.
그러나 이러한 Login 컨트롤에 대한 템플릿을 만들 경우에는 컨트롤이 내게 필요한 옵션 지침에 맞도록 템플릿에서 해당 컨트롤을 구성해야 합니다.
클라이언트 스크립트와 ASP.NET 서버 컨트롤
WCAG 표준에 따르면 페이지에서 클라이언트 스크립트를 기능적인 용도로는 사용하지 않고 마우스 롤오버와 같은 중요하지 않은 효과를 위해서만 사용하는 것이 좋습니다. Section 508 지침에는 클라이언트 스크립트에서 반환되는 값을 보조 기술에 사용할 수 있는 경우 클라이언트 스크립트를 사용할 수 있다고 정의되어 있습니다.
몇 가지 ASP.NET 웹 서버 컨트롤은 클라이언트 스크립트를 기반으로 합니다. 예를 들면 다음과 같습니다.
LinkButton 및 ImageButton 컨트롤은 클라이언트 스크립트를 사용하여 포스트백을 수행해야 합니다.
Calendar 컨트롤은 클라이언트 스크립트를 사용하여 날짜 링크 클릭을 지원해야 합니다.
웹 파트 컨트롤은 클라이언트 스크립트를 기반으로 링크를 닫고, 최소화하고, 편집합니다.
클라이언트 스크립트를 사용하는 전체 컨트롤 목록을 보려면 클라이언트 스크립트를 사용하는 ASP.NET 웹 서버 컨트롤을 참조하십시오.
따라서 클라이언트 스크립트가 필요한 컨트롤을 페이지에 사용하면 페이지가 WCAG 표준에 맞지 않게 됩니다. 웹 응용 프로그램이 WCAG 표준과 100% 완벽하게 호환해야 하는 경우에는 클라이언트 스크립트를 사용하는 컨트롤을 페이지에 사용할 수 없습니다. 그러나 이러한 컨트롤은 페이지에서 클라이언트 스크립트 사용에 대한 Section 508 표준을 따릅니다.