- From: Christophe Strobbe <strobbe@hdm-stuttgart.de>
- Date: Thu, 20 Sep 2012 17:56:47 +0200
- To: w3c-wai-gl@w3.org
Am Do, 19.07.2012, 06:21 schrieb Gregg Vanderheiden: > Interesting > G .... but considered broken (from an accessibility point of view) or at least confusing by: * "The truth about structuring an HTML5 page" <http://www.netmagazine.com/features/truth-about-structuring-html5-page> (from Luke Stevens' book on HTML5; 2012) * Roger Johansson: "HTML5 sectioning elements, headings, and document outlines" (March 2011): <http://www.456bereastreet.com/archive/201103/html5_sectioning_elements_headings_and_document_outlines/> * Roger Johansson: "HTML5 document outline revisited" (April 2011): <http://www.456bereastreet.com/archive/201104/html5_document_outline_revisited/> * Derek Johnson: "HTML5 And The Document Outlining Algorithm" (August 2011): <http://coding.smashingmagazine.com/2011/08/16/html5-and-the-document-outlining-algorithm/> Luke Stevens points out that many book authors and tutorial authors get the outline algorithm wrong. (Outline algorithm: <http://www.w3.org/TR/html5/headings-and-sections.html#outline>.) This includes treating the header and footer elements (either implicitly or explicitly) as being at the same level as article, aside, nav and section (which are 'sectioning content elements'), even though header and footer are not sectioning content. (You can check this in any HTML5 draft between February 2009 and March 2012; since August 2009, the HTML5 drafts explicitly warn against this confusion). Even book authors who write about accessibility do this. See for example: * Introducing HTML5 (by Lawson & Sharp, 1st edition, 2010), p. 8-9. * Pro HTML5 Accessibility (2012), p. 161-162: includes header and footer in a list of HTML5 sectioning elements. Best regards, Christophe > Authors are also encouraged to explicitly wrap sections in elements of sectioning content, instead of relying on the implicit sections generated > by having multiple headings in one element of sectioning content. For example, the following is correct: > <body> > <h4>Apples</h4> > <p>Apples are fruit.</p> > <section> > <h2>Taste</h2> > <p>They taste lovely.</p> > <h6>Sweet</h6> > <p>Red apples are sweeter than green ones.</p> > <h1>Color</h1> > <p>Apples come in various colors.</p> > </section> > </body> > However, the same document would be more clearly expressed as: > <body> > <h1>Apples</h1> > <p>Apples are fruit.</p> > <section> > <h2>Taste</h2> > <p>They taste lovely.</p> > <section> > <h3>Sweet</h3> > <p>Red apples are sweeter than green ones.</p> > </section> > </section> > <section> > <h2>Color</h2> > <p>Apples come in various colors.</p> > </section> > </body> > Both of the documents above are semantically identical and would produce the same outline in compliant user agents. > This third example is also semantically identical, and might be easier to > maintain (e.g. if sections are often moved around in editing): > <body> > <h1>Apples</h1> > <p>Apples are fruit.</p> > <section> > <h1>Taste</h1> > <p>They taste lovely.</p> > <section> > <h1>Sweet</h1> > <p>Red apples are sweeter than green ones.</p> > </section> > </section> > <section> > <h1>Color</h1> > <p>Apples come in various colors.</p> > </section> > </body> > This final example would need explicit style rules to be rendered well in > legacy browsers. Legacy browsers without CSS support would render all the > headings as top-level headings. Source: <http://www.w3.org/TR/html5/headings-and-sections.html#headings-and-sections> Best regards, Christophe -- Christophe Strobbe Akademischer Mitarbeiter Adaptive User Interfaces Research Group Hochschule der Medien Nobelstraße 10 70569 Stuttgart Tel. +49 711 8923 2749
Received on Thursday, 20 September 2012 16:15:21 UTC