HTML5에서의 Table Element의 summary

HTML5에서는 HTML4까지 표의 요약을 설명하는 용도로 사용되던 summary속성을 폐기했다.
폐기라기 보기보다는 사용하면 좋지않은 지침(Not a good indicator)정도로 표현했다고 본다.
암튼 summary가 “사용하면 좋지않은 지침(이후 deprecated 정도로 맘대로 표현하겠다.)”이 되어버린 이유가 몰까 궁금했다.
summary는 표의 설명이기 때문에 복잡한 구조의 표를 선형화시켜서 이해하는 사람에게 큰 도움이 되지 않던가! 왜 없에버린거야!! 라며 이유를 찾기 시작했다.

그에 대한설명은 현재 버전의 html5 Specification에는 존재하지 않고, 2011년 4월 5일날(나무를 심자! 음…) 나온 “HTML5 Edition for Web Authors“에서 찾을 수 있었다.

The summary attribute on table elements was suggested in earlier versions of the language as a technique for providing explanatory text for complex tables for users of screen readers. One of the techniques described above should be used instead.

note : In particular, authors are encouraged to consider whether their explanatory text for tables is likely to be useful to the visually impaired: if their text would not be useful, then it is best to not include a summary attribute. Similarly, if their explanatory text could help someone who is not visually impaired, e.g. someone who is seeing the table for the first time, then the text would be more useful before the table or in the caption. For example, describing the conclusions of the data in a table is useful to everyone; explaining how to read the table, if not obvious from the headers alone, is useful to everyone; describing the structure of the table, if it is easy to grasp visually, might not be useful to everyone, but it might also not be useful to users who can quickly navigate the table with an accessibility tool.

암호 해독을 해보면…

테이블 요소에 대한 summary 속성은 스크린 리더 사용자를 위한 복잡한 표에 대한 설명 텍스트를 제공하기 위한 기술로 html 언어의 이전 버전에서 제안 되었고, 위에 설명 된 기술 중 하나가 대신 사용된다.

특히 웹 저작자는 테이블 대한 설명 문구는 시각 장애인에게 도움이 될 가능성이 있는지 여부를 고려하는 것이 좋다. 만약 자신의 설명 문구가 유용하지 않을 경우에는, summary 속성을 포함하지 않는 것이 좋다. 유사하게 웹 저작자가 명시한 설명문구가 시각장애인 아닌 사람에게도 도움이 될 수 있다면(이 표를 처음보는 사람이라던가), 이 설명 텍스트는 summary속성을 사용하는것 보다는 테이블의 앞에 설명하거나 caption을 사용하는것이 더 유용할것이다. 예를 들어 테이블에 포함된 데이터의 결론을 설명하는 것은 모든 이에게 유용하며, 헤더를 읽는것 만으로 충분히 이해할 수 없는 테이블을 어떻게 읽을 것인지 설명하는 것 또한 모든 이에게 유용하다. 그러나 그 시각적으로 이해하기 쉽게 되어있는 테이블의 구조를 설명하는건 누구에게나 별 도움이 되지 않으며, 접근성 도구의 도움을 받아 빠르게 탐색할 수 있는 이들에게도 도움이 되지 않는다.

라고 되어있다.
난 저 다른나라 암호를 해독하면서 note 부분이 참으로 공감이 갔다. 현재 KWCAG2.0 과 웹 접근성 품질 마크의 순기능으로 인해(부작용은 좀 나중에… 할 수 있을까?) 우리나라의 웹 저작자는 대부분 caption을 명시하고 summary속성을 명시하고 있다. 다만 caption은 제목 summary는 요약정보라는 공식 아닌 공식에 갇혀서 caption을 단지 테이블의 제목 복사, summary는 표의 구조(th나열)을 사용하는것이 현실이다. 현재의 공식을 각요소의 참역할로 보면 caption은 역할도 문제가 없고 다루기도 쉽다. 그러나 summary는 문제가 있다. summary는 구조의 요약정보만 알려주는것에 제한되어서는안되고 표의 내용을 요약할수 있어야 한다고 생각한다. 그러나 테이블의 내용에 대해 요약을 제공하는게 쉬운일은 아니라는것이다. 특히 data가 서버에서 db를 불러와 제공되는 표의 경우는 더욱 힘들것이다. 이게 summary를 제대로 쓰기에 힘든 가장 중요한 이유가 아닐까 생각한다.

facebook에서 김혜일님이 사용자입장에서 summary를 th의 항목만 나열해 넣는 경우에 “어차피 summary 듣고 나서 th를 바로 들어야하기 때문에 사실 큰 도움이 되지는 않습니다.“라는 코멘트를 하셨던것도 HTML5의 Spec. 과 의미가 통한다고 본다.

그럼 해결책을 찾아보자 다시 spec. 으로 돌아가 Tabluar data의 Techniques for describing tables 부분을 보면 답이 있다.

For tables that consist of more than just a grid of cells with headers in the first row and headers in the first column, and for any table in general where the reader might have difficulty understanding the content, authors should include explanatory information introducing the table. This information is useful for all users, but is especially useful for users who cannot see the table, e.g. users of screen readers.

Such explanatory information should introduce the purpose of the table, outline its basic cell structure, highlight any trends or patterns, and generally teach the user how to use the table.

역시 암호 해독을 해보면…

셀의 그리드로 구성되고 그 첫 행과 첫 열에 헤더 정보가 있는 단순한 구조가 아니거나, 독자가 표의 내용을 이해하는데 어려움을 느낄 수 있는 테이블일 경우에는, 테이블을 소개하는 설명 정보를 포함시켜야 한다. 이 정보는 모든 사용자에게 유용하다, 특히 테이블을 볼 수 없는 사용자(스크린리터 사용자 같은)에게 유용하다.

설명 정보는 테이블의 목적을 소개해야 하고, 기본적인 셀 구조를 나타내야 하며, 표의 경향과 패턴을 강조하고, 사용자가 테이블을 어떻게 사용할지 가르칠 수 있는 것이어야 한다.

라고 되어있고 그 위치는 구조상 테이블의 위나 caption앨리먼트에서 구조화를 통해 표현 할 수 있다고 한다. 이것에 대한 예는 4.9.1.1 Techniques for describing tables – 4.9.1 The table element 에서 확인 가능하다.
caption의 경우 html4에서는 inline element였으므로 내부의 구조화가 어려웠던 반면, html5에서는 content model이 Flow Content로 된것도 뭐 좋은 현상이라고 볼 수 있지 않을까?

내맘대로 결론을 한줄 요약을 해보면

  • 품질마크 딸라고 어거지로 summary 끼워 넣지마 정말 도움이 되는게 뭔지 고려해봐
  • 아 파젯은 어케 고치지?
  • 암호해독은 어려워

정도가 되겠다.
생각해보니 웹 접근성 품질마크에서 예전에는 caption 대신 table위에 제목을 제공해도 허용이었던거같은데 ._.

오늘도 즐거운 웹 접근성 라이프…음…