HTML5 양식에서 액세스 가능한 복잡한 표 만들기 create-accessible-complex-tables-in-html-forms

HTML5 Forms의 기본 테이블 구현에서는 HTML DIV 요소를 사용하여 테이블을 렌더링합니다. 렌더링에는 접근성 요구 사항을 충족하기 위해 ARIA 역할을 사용하는 작업이 포함됩니다.

데이터 테이블에 사용되는 ARIA 역할을 완전히 지원하지 않는 화면 판독기의 접근성 문제를 방지하기 위해 HTML5 Forms에서는 테이블에 대한 대체 렌디션을 제공합니다. 이러한 테이블은 Designer에서 도입된 새로운 테이블 형식을 기반으로 하며,

HTML5 Forms에서 새 형식을 사용하려면 표를 복잡하게 표시합니다. 테이블을 복잡하게 표시하려면 다음과 같이 테이블 하위 양식의 XML 원본에 extras 태그를 추가하십시오.

</extras>
 <text name="complexTable">1</text>
 </extras>

complexTable(으)로 표시된 테이블은 기본 HTML 렌디션을 따르며 특정 화면 판독기에 더 나은 접근성 지원을 제공합니다. 행 범위를 만들려면 동일한 열에서 표의 연속 셀을 선택하고 선택 항목을 마우스 오른쪽 단추로 클릭한 다음 셀 병합 ​을 클릭합니다.

행을 행 머리글로 표시하려면 행의 모든 셀을 선택하고 선택 항목을 마우스 오른쪽 단추로 클릭한 다음 머리글 표시 ​를 클릭합니다.

셀을 열 머리글로 표시하려면 열에서 셀을 선택하고 선택 항목을 마우스 오른쪽 단추로 클릭한 다음 머리글 표시 ​를 클릭합니다.

새 AccessibleTable 형식의 제한 사항: