성공 기준(SC)
사용자 정보를 수집하는 각 입력 필드의 목적이 다음과 같은 경우 프로그래밍 방식으로 판별되어야 한다.
- 입력 필드가 사용자 인터페이스 구성요소 섹션의 입력 목적으로 사용되는 경우
- 컨텐츠가 양식 입력 데이터에 대해 기대하는 의미 식별을 지원하는 기술을 사용하여 구현된 경우
1.3.5 입력 목적 식별
- 목표
- 양식 작성이 더 쉬워진다.
- 할 일
- 기술로 가능한 경우 코드를 사용하여 일반적인 입력 목적을 나타낸다.
- 중요성
- 인지 장애가 있는 일부 사람들은 레이블만으로 입력 목적을 이해하지 못할 수도 있다.
(Level AA)
이 성공 기준의 의도는 사용자에 대한 정보를 수집하는 양식 입력의 목적이 프로그래밍 방식으로 판별될 수 있도록 보장하는 것이다. 이를 통해 사용자 에이전트가 다양한 양식을 사용하여 이 목적을 추출하고 사용자에게 제시할 수 있다. 특정 분야에서 예상되는 종류의 데이터를 프로그래밍 방식으로 선언하면 특정 인지 장애가 있는 사람들이 양식을 더 쉽게 작성할 수 있다.
눈에 보이는 적절한 레이블과 지시문은 사용자가 양식 입력 필드의 목적을 이해하는 데 도움이 될 수 있지만, 특정 유형의 정보를 수집하는 필드를 모호하지 않고 일관되며 다양한 양식에 맞게 사용자 에이전트 또는 보조 기술의 도움을 통해 사용자 정의된 방식으로 렌더링함으로써 사용자는 이점을 누릴 수 있다.
일부 입력 필드의 경우, type 속성만으로 입력 필드의 용도를 대략적으로 지정할 수 있다(예: <input type="tel">, <input type="email"> 또는 <input type="password">).
그러나 이는 입력 유형을 설명하는 매우 대략적인 범주일 뿐이며 특히 사용자별 입력 필드와 관련된 경우 그 목적이 반드시 필요한 것은 아니다.
예를 들어, type="email"은 필드가 이메일 주소용이라는 것을 나타내지만 그 목적이 사용자의 이메일 주소를 입력하기 위한 것인지 아니면 다른 사람의 이메일을 입력하기 위한 것인지는 명확하지 않다.
이 성공 기준은 WCAG 2.1 권장 사항의 섹션 7에 명시된, 프로그래밍 방식으로 식별 가능해야 하는 사용자 인터페이스 구성 요소의 입력 목적 유형을 정의한다. 이러한 사용자 입력 목적이 존재하고 기술적으로 지원되는 경우, 해당 필드의 목적은 프로그래밍 방식으로 식별 가능해야한다.
HTML 자동 완성 속성은 잘 정의된 고정 값만 허용한다. 예를 들어 저작자가 특정 이름 유형을 지정할 수 있도록 허용함으로써 유형 속성보다 더 세밀한 정의 또는 목적 식별이 가능하다. 성명(autocomplete="name"), 이름(autocomplete="given-name"), 성(autocomplete="family-name"), 사용자 이름(autocomplete="username") 및 닉네임(autocomplete="nickname").
이러한 사전에 정의된 체계를 채택하고 재활용 함으로서, 사용자 에이전트와 보조기술은 다양한 양식으로 사용자에게 입력 목적을 제시할 수 있다. 예를 들어 보조 기술은 입력 필드 옆에 친숙한 아이콘을 표시해 읽기에 어려움이 있는 사용자를 도울 수 있다.
생일 케이크 아이콘을 autocomplete="bday"인 입력 필드 앞에 표시하거나, 전화기 아이콘을 autocomplete="tel"인 입력 필드 앞에 표시할 수 있다.
이 체계의 용도를 변경하는 것 외의 자동 완성 속성 기술을 사용하여 이 성공 기준을 충족하는 경우, 브라우저와 다른 사용자 에이전트는 브라우저에 저장된 과거 사용자 입력을 기반으로 이러한 필드를 자동 완성하여 올바른 콘텐츠를 제안하고 ‘채울’ 수 있다.
예를 들어 “생일”(autocomplete="bday")과 같은 일반적인 입력 목적에 대한 보다 세부적으로 정의함으로써 브라우저는 이러한 각 필드(사용자의 생일 날짜)에 대해 개인화된 값을 저장할 수 있다.
사용자는 정보를 입력하는 대신 필드 값을 확인하거나 필요한 경우 변경할 수 있다. 이는 기억 문제, 난독증 및 기타 장애가 있는 사용자에게 중요한 이점이다.
자동 완성 값은 언어와 무관하므로 입력 필드의 시각적 레이블 텍스트에 익숙하지 않은 사용자도 고정된 체계를 통해 해당 목적을 일관성 있게 식별할 수 있다.
입력 필드가(사용자 이름 / 사용자 이메일 통합 필드와 같이) 두 가지 서로 다른 유형의 입력 목적을 허용하고, 사용된 기술이 여러 개의 목적 값을 정의하는 것을 허용하지 않는 경우, 둘 중 하나의 값을 제공하거나 입력 목적 지정을 아예 생략하는 것도 유효하다.
사용자 에이전트 및 보조 기술의 다른 메타데이터 형식에 대한 지원이 성숙해지면, 입력 필드의 목적을 식별하기 위해 HTML 자동 완성(autocomplete) 속성(attribute)에 더해 혹은 이를 대신하여 WAI-Adapt: Symbols Module과 같은 메타데이터 스킴을 사용할 수 있다. 또한 이러한 스킴은 저작자가 제공한 입력 레이블을 식별하고, 이를 레이블 지정에 대신 사용되는 정의된 어휘나 심볼에 매칭하는 자동화된 적응 기능을 지원할 수 있다.
참고
참고
“input”이라는 용어는 여기에서 사용자 입력을 받는 양식 컨트롤을 지칭하는 일반적인 방식으로 사용된다. 예를 들어, HTML에서 이는 <input> 요소에 국한되지 않으며, <textarea>나 <select>와 같은 다른 컨트롤들도 포함한다.
- 언어 및 기억 관련 장애 또는 실행 기능 및 의사 결정에 영향을 미치는 장애가 있는 사람들은 이 성공 기준을 충족하기 위해 자동 완성 속성이 사용될 때 브라우저가 개인 정보(이름이나 주소 등)를 자동으로 입력해 주는 기능의 혜택을 받는다. 이는 사용자가 정보를 기억할 필요가 없음을 의미한다.
- 뇌성 마비, 뇌졸중, 두부 외상, 운동 신경 질환 또는 학습 장애가 있는 사람들은 때때로 의사소통을 위해 이미지를 선호한다. 이들은 입력 필드의 목적을 시각적으로 인식하기 위해 필드에 아이콘을 추가하는 보조 기술을 활용할 수 있다.
- 운동 장애가 있는 사람들도 양식을 작성할 때 수동 입력의 필요성이 줄어드는 이점을 누릴 수 있다.
- 자동 입력을 사용하는 문의 양식
문의 양식이 사용자의 브라우저에 저장된 자동 입력 값을 사용하여 이름, 도로명, 우편번호, 도시, 전화번호 및 이메일 주소 필드를 자동으로 채운다. 보조 기술은 사용자에게 친숙한 심볼이나 아이콘 세트를 활용하는 등 특정 입력 필드를 식별하는 맞춤형 방법을 제공하여 필드의 목적을 시각적으로 전달할 수 있다.
- 청구지 주소와 배송지 주소가 분리된 주문 양식
제품 주문 양식에서 자동 입력 상세 토큰인 ‘billing’과 ‘shipping’을 사용하여 청구지 주소를 위한 주소 필드와 배송지 주소를 위한 별도의 주소 필드 세트를 채운다.
- 아이콘을 사용하는 문의 양식
아이콘을 추가하는 브라우저 플러그인이 해당 인물의 이름, 집 주소, 전화번호 및 이메일 주소를 나타내는 아이콘을 삽입하여 입력 목적을 시각적으로 식별한다.
자료는 정보 제공 목적으로만 제공되며 보증을 암시하지 않는다.
이 섹션의 각 번호가 매겨진 항목은 접근성 지침 실무 그룹이 이 성공 기준을 충족하기에 충분하다고 판단하는 기법 또는 기법의 조합을 나타낸다. 기법은 기준의 최소 요구 사항을 넘어설 수 있다. 이러한 기법에서 포괄하지 않은 기준 충족의 다른 방법이 있을 수 있다. 다른 기법 사용에 대한 정보는 WCAG 성공 기준에 대한 기법 이해, 특히 “기타 기법” 섹션을 참조하라.
다음은 접근성 지침 실무 그룹에서 이 성공 기준의 실패로 간주하는 일반적인 실수이다.
다음은 이 성공 기준의 특정 측면에 대한 점검 규칙이다. WCAG 준수 여부를 확인하기 위해 이러한 특정 점검 규칙을 사용할 필요는 없지만 이것은 정의되고 승인된 검사 방법이다. 점검 규칙 사용에 대한 자세한 내용은 WCAG 성공 기준에 대한 점검 규칙 이해를 참고하라.