[데이터 테이블 구성] 데이터 테이블은 테이블을 구성하는 데이터 셀의 내용에 대한 정보가 충분히 전달될 수 있어야 한다.

가. 용어정리

• 데이터 테이블(data table)이란 테이블을 구성하는 데이터간의 논리적 관계를 표현하기 위하여 사용하는 형태이다.

나. 요구조건

• 데이터 테이블은 테이블의 제목이나 테이블의 내용을 요약하여 제공해야 한다(항목 1.1 참조).
• 데이터 테이블은 데이터 셀별로 대응되는 모든 헤더를 확인할 수 있도록 구성하여야 한다.

다. 적용시 장점

• 데이터 테이블을 요구 조건에 맞추어 제작한 경우에는 임의의 데이터 셀에 대응되는 모든 헤더 값을 알 수 있다.

라. 적용 예

• 간단한 데이터 테이블 구성

  HTML을 이용하여 간단한 데이터 테이블을 구성하는 경우에 데이터 셀과 헤더는 각각 <TD>와 <TH>태그를 사용하여 테이블을 구성한다.

• 복잡한 데이터 테이블 구성

  HTML에서 행을 그룹화 하는데 THEAD, TFOOT, TBODY 등의 속성을 사용하고, 열을 그룹화 하는 데는 COL, COLGROUP 등의 속성을 사용한다. 보다 복잡한 테 이블의 구성을 위해서는 “axis", "scope", "headers"등의 속성을 이용한다.

• 데이터 테이블 설명

  HTML 4.01에 따라 데이터 테이블을 구성하는 경우에 테이블에 대한 설명은 <TABLE ... summary = ""> 태그를 사용하여 표시할 수 있다. 또한 <CAPTION>태그를 사용하여 테이블의 간단한 제목을 표시할 수도 있다. <TABLE title=""> 태그를 사용해도 동일한 효과를 얻을 수 있다. 즉, 데이터 테이블의 제목(title)은 도표의 첫 부분(상단 처음)에 오도록 하여 이어지는 자료가 데이터 테이블임을 알도록 하면 편리하다.

[논리적 구성] 콘텐츠의 모양이나 배치는 논리적으로 이해하기 쉽게 구성하여야 한다.

가. 용어정리

• 배치용 테이블(layout table)이란 데이터 테이블과는 달리 문서의 모양을 만들기위한 목적으로 사용하는 테이블이다.
• 스타일 시트(style sheet)란 문서의 표현 형태를 규정하는 일련의 명령문을 의미한다. 스타일 시트는 콘텐츠 제공자가 마련한 것,사용자가 마련한 것, 웹 브라우저에 내장된 형태 등의 세 가지 경우가 있다. CSS(Cascading Style Sheets)레벨2가 스타일 시트의 대표적인 규정이다.

나. 요구조건

• 문서의 모양이나 콘텐츠의 배치를 위해서는 스타일 시트(style sheet)를 사용하여야 한다.
• 배치용 테이블을 사용하여 콘텐츠의 모양이나 배치를 할 경우에는 테이블을 구성하는 모든 셀들을 왼쪽상단에서 오른쪽 하단에 이르는 순서대로 늘어놓았을 때에도 그 내용을 충분히 이해할 수 있도록 구성해야 한다.

다. 적용시 장점

• 논리적으로 구성된 웹 콘텐츠는 스타일 시트(style sheet)를 바꾸거나 기능을 제거하더라도 그 내용을 순서대로 읽을 수 있으므로 문서의 의미를 이해하는데 어려움이 없다.
• 배치용 테이블은 종종 일정한 형태를 표현하기 위하여 사용된다. 이 경우에도 스크린 리더로 읽어주는 내용의 순서가 화면에 나타난 콘텐츠의 읽는 순서와 같아지게 된다.

라. 적용 예

• 배치용 테이블 : 배치용 테이블은 캡션(CAPTION)이나 타이틀(TITLE) 태그를 사용하지 않는다.
• 스타일 시트 : 스타일 시트를 사용하여 콘텐츠의 모양이나 배치를 구성할 경우에는 스타일 시트 기능을 제거하거나 다른 스타일 시트를 사용하더라도 그 내용을 이해하기 쉽게 콘텐츠를 구성하여야 한다.

[온라인 서식 구성] 온라인 서식을 포함하는 콘텐츠는 서식 작성에 필요한 정보, 서식 구성 요소, 필요한 기능, 작성 후 제출 과정 등 서식과 관련한 모든 정보를 제공해야 한다.

가. 용어정리

• 온라인 서식(on-line form)이란 웹 브라우저 상에서 작성하여 제출하도록 제공되는 양식을 의미한다.
• 애플릿(applet)이란 웹 페이지에 삽입되는 프로그램을 의미한다.
• 플러그인(plug-in)이란 웹 브라우저를 사용하는데 함께 사용되는 프로그램을 의미한다. 예를 들어 플래시(Flash) 등이 플러그인의 하나이다.

나. 요구조건

• 온라인 서식을 구성하는 모든 서식 제어 요소, 예를 들면, 편집 상자(edit box), 라디오 버튼(radio button), 체크 박스(check box) 등은 레이블과 해당 서식 제어 요소간의 표시 순서가 일정하여야 한다.
• 탭(tab)키를 이용하여 서식 제어 요소 간을 이동할 경우에 그 순서가 왼쪽 위에서 오른쪽 아래 부분으로 순차적인 이동이 가능하여야 한다.
• 서식을 구성할 때에 보조기술을 사용하면 접근이 가능한 경우에만 스크립트, 애플릿,플러그인 또는 다른 프로그램 요소를 사용한다.만일 이것이 불가능할 경우에는 스크립트, 애플릿(applet), 플러그인(plug-in) 등 프로그램 요소의 기능을 정지시켜도 온라인 서식을 작성할 수 있어야 한다(항목 4.1 참조).

다. 적용시 장점

• 요구조건을 만족하는 경우에는 온라인 양식을 작성함에 있어서 모든 서식 제어요소의 레이블과 서식 제어 요소간의 관계가 일관성을 가지게 되므로 사용자는 혼란을 피할 수 있게 된다.

라. 적용 예

• 편집 박스 프로그래밍 예 : 예를 들어, 레이블 다음에 편집 박스(edit box)가 위치하는 경우에는 다음과 같이 프로그래밍을 하면 된다.

  <LABEL for="first_name">이름:
      <INPUT type="text" id="first_name" tabindex="1">
  </LABEL>
  이 경우에 커서가 편집 박스에 위치하면,스크린 리더는‘이름’이라고 읽어준다.

• 편집 박스의 기본값 제공 : 편집 박스는 기본값을 가능한 한 제공한다.
• 편집 박스 테이블 구성 : 편집 박스를 데이터 테이블 형태로 구성할 경우에는 편집 박스별로 테이블 헤더를 읽어주도록 구성한다.