웹 콘텐츠 접근성 이해의 용이성 - by. UXKM

고려 사항

1. 웹 페이지의 언어 명시

   웹 페이지에서 제공하는 콘텐츠에 적용되는 기본 언어를 반드시 정의해야 합니다.

기대 효과

화면 낭독 프로그램과 점역 프로그램과 같은 보조 기술은 웹 페이지의 기본 언어를 인식하여 자동적으로 음성 모듈을 선택하거나 해당 언어에 적합한 점역 방법을 선택할 수 있는 편리함이 있다.

고려 사항

1. 초점에 의한 맥락 변화

   웹 콘텐츠를 구성하는 컨트롤이 초점을 받았을 경우, 사용자가 의도하지 않은 기능이 실행되지 않아야 합니다. 단, 기능의 실행이 아니라 초점을 받은 요소의 색깔이 반전되거나 테두리가 생기는 것과 같은 시각적인 변화, 또는 사용자 제어가 이동하지 않은 상태에서 나타나는 추가 정보 등은 초점에 의한 맥락 변화를 일으키는 기능의 실행으로 간주하지 않습니다.

   다음은 종종 발생하는 대표적인 오류들입니다.

   • 온라인 서식이 자동적으로 제출됨.
   • 새 창이 열림.
   • 드롭다운 메뉴가 열림만으로 특정 메뉴 항목이 실행됨.
   • 풀다운 메뉴를 사용하는 콘텐츠에서 초점을 받는 것만으로 특정 메뉴의 기능이 실행됨.
   • 사용자 제어(초점)가 다른 컨트롤로 이동하거나 사라지거나 또는 그 위치를 예측할 수 없음.

2. 입력에 따른 변화

   사용자가 선택할 수 있는 컨트롤(예 : 콤보 상자, 라디오 버튼, 체크 상자 등)에서 어떤 항목을 선택하는 경우, 해당 항목이 의미하는 기능이 실행되거나 서식 제출이 일어나지 않아야 합니다.
   실제로 기능이 실행되거나 서식이 제출되는 것은 사용자가 선택할 수 있는 컨트롤과 함께 제공되는 실행 버튼을 활성화(클릭)했을 때 비로소 진행되어야 합니다.
   단, 기능의 실행이 아니라 초점을 받은 사용자 입력 또는 컨트롤의 색깔이 반전되거나 테두리가 생기는 것과 같은 시각적인 변화, 또는 사용자 제어(초점)가 이동하지 않은 상태에서 나타나는 추가 정보 등은 입력 변화에 따른 기능의 실행으로 간주하지 않습니다.

3. 새 창/팝업 창

   사용자가 예측할 수 없는 상황에서 새 창을 열어 정보를 전달해서는 안 됩니다. 사용자는 새로운 창이 열리는 것을 예측할 수 있어야 하며, 이를 명확히 안내받아야 합니다.

4. 레이어 팝업

   레이어 팝업은 콘텐츠의 논리적 초점 이동 및 콘텐츠의 선형 구조를 위반할 가능성이 많으므로 사용하지 않는 것이 바람직합니다.

5. 새 창/팝업 창/레이어 팝업의 닫음

   새 창/팝업 창/레이어 팝업에 초점이 있을 경우 새 창/팝업 창/레이어 팝업을 닫거나 종료 버튼을 클릭하였을 경우, 해당 창 또는 팝업 등이 종료되어야 합니다.
   사용자가 화면에 나타난 새 창/팝업 창/레이어 팝업을 닫거나 종료하도록 요구하였음에도 불구하고 해당 창 또는 팝업 등이 종료되지 않으면 사용자는 매우 당황하게 됩니다. 특히 레이어 팝업의 경우에 이러한 혼란이 가중될 수 있습니다.

기대 효과

• 시각 장애, 지적 장애 또는 지체 장애가 있는 사람들도 초점 및 문맥의 변화를 이해할 수 있게 됩니다.
• 사용자에게 미리 새 창 열림을 경고하면 뒤로 가기 버튼이 더 이상 예상처럼 동작하지 않는다는 사실을 알 수 있으므로 이용하는데 따른 혼란이 줄어듭니다.

고려 사항

1. 콘텐츠의 선형 구조 유지

   웹 페이지를 구성하는 모든 콘텐츠는 사용자가 그 내용을 이해할 수 있도록 선형 구조로 작성되어야 합니다.

2. 내용, 표현 및 기능 분리

   브라우저 화면에 표시되는 콘텐츠의 순서는 웹 페이지에 수록된 콘텐츠의 선형 구조와 항상 일치하지 않을 수 있습니다.
   예를 들어, 스타일 시트를 사용하면 웹 페이지의 콘텐츠 순서를 변경하지 않고도 화면에 표시되는 콘텐츠의 배치를 임의로 조정할 수 있습니다. 따라서 웹 페이지를 구성하는 콘텐츠의 나열 순서는 그 맥락을 이해할 수 있도록 논리적으로 구성되어야 하며, 시각적으로 배치를 변경할 때에도 콘텐츠의 선형 구조는 유지되어야 합니다.

기대 효과

• 콘텐츠의 선형 구조가 논리적인 콘텐츠는 지적 장애, 언어 장애 및 학습 장애가 있는 사용자들이 콘텐츠를 이해하는 데 도움을 줍니다.
• 콘텐츠의 선형 구조가 논리적인 웹 콘텐츠는 스타일 시트(style sheet)를 바꾸거나 기능을 제거하더라도 그 내용을 순서대로 읽어 문서의 의미를 이해하기가 쉽습니다.

고려 사항

1. 표 정보 제공

   데이터를 표로 구성할 경우, 표의 내용, 구조 등을 이해할 수 있도록 정보를 제공하여 표의 이용 방법을 예측할 수 있도록 합니다.

2. 표의 구성

   표의 내비게이션을 위하여 표의 셀은 제목 셀과 데이터 셀이 구분되도록 구성해야 합니다.

기대 효과

제목 셀과 데이터 셀이 구분되도록 구현한 데이터 테이블은 시각 장애인에게 데이터 셀에 대한 제목 셀의 내용 또는 제목 셀과의 관계를 알려주므로 내용 파악이 쉽다.

고려 사항

1. 사용자 입력에 대응하는 레이블 제공

   사용자 입력의 근처에 사용법을 알려주는 레이블(label)을 보조 기술이 알 수 있도록 해당 컨트롤과 대응하여 제공해야 합니다.
   레이블(label)과 사용자 입력 간의 관계를 보조 기술이 인식할 수 있도록 대응시키지 않고 단순히 텍스트로만 제공할 경우, 보조 기술은 해당 사용자 입력에 대한 레이블(label)을 인식할 수 없습니다.

기대 효과

레이블(label)과 사용자 입력 간의 관계를 보조 기술이 인식할 수 있도록 대응시키면 화면 낭독 프로그램을 사용하는 시각 장애인에게 해당 컨트롤이 어떤 용도로 사용되는지를 알려줄 수 있으므로 잘못된 데이터의 입력을 방지할 수 있습니다.

고려 사항

1. 사용자 입력 오류 안내

   온라인 서식에서 오류가 발생하는 경우, 사용자에게 오류가 발생한 위치와 오류를 유발하게 된 이유 등에 관한 정보를 알려 주어야 합니다.
   예를 들어, 이름, 주소, 전화번호, 이메일 주소를 입력하도록 구성한 입력 서식에서 일부 항목을 기입하지 않고 제출한 경우, 어떤 항목이 누락되었는지를 사용자에게 알려주어야 합니다. 그러나 시스템이나 플랫폼에서 발생한 오류에는 이 검사 항목이 적용되지 않습니다.

기대 효과

• 입력 오류를 수정할 수 있는 방법에 대한 정보를 텍스트로 자세하게 제공하는 것은 학습 장애가 있는 사용자들이 입력 서식을 성공적으로 작성할 수 있도록 도와줍니다.
  오류가 있는 곳에만 오류 표시를 하면 시각 장애인이나 저시력 장애인은 오류가 난 곳에 도달하기 전까지는 어떤 오류가 발생했는지 알기 어렵지만, 오류의 내용을 먼저 텍스트로 설명해주거나, 프로그램을 통해 오류가 난 위치로 초점을 이동시킨 후에 오류의 내용을 설명해 주면 입력 오류를 더 쉽게 정정할 수 있습니다.
• 실수로 인해 빚어지는 심각한 결과 또는 과실을 피하기 위해 오류 정정에 필요한 정보나 수단을 제공하는 것은 장애인뿐 아니라 모든 사용자들에게 도움을 줍니다.