- HTML5 Multimedia Development Cookbook
- Dale Cruse Lee Jordan
- 355字
- 2021-04-02 19:27:37
Applying the outline algorithm
Luckily for us, HTML5 now has a method of assembling an outline of our pages in browsers, so search engines as well as accessibility technologies can make better sense of them. We're going to make use of the HTML5 Outliner at: http://gsnedders.html5.org/outliner
Getting ready
To use the HTML5 Outliner, we can use HTML stored on our local computer or code visible via a URL. Make sure to save the code we've been creating locally or upload it to a publicly accessible web server for this step.
How to do it...
Let's make sure to save this document either on a local hard drive or remote server. We'll visit http://gsnedders.html5.org/outliner to create our outline.
Using our previous code example, we can generate the following code outline:
- Roxane is my name.
- Untitled Section
- About
- Work
- Contact
- What I'm Reading
- Elsewhere
- All rights reserved. Copyright Roxane.
How it works...
"It is defined in terms of a walk over the nodes of a DOM tree, in tree order, with each node being visited when it is entered and when it is exited during the walk." - WHATWG
There's more...
It's assumed that content following any heading is related to that heading. Therefore we can use many of the new HTML5 tags like <section>
to explicitly demonstrate the beginning and ending of related content.
Are you sure?
If the HTML5 Outliner tool displays messages like "Untitled Section" you should rethink how you're using each of your tags and ensure your approach matches the intent of the specification.
An exception
"Untitled Section" messages should be treated as warnings instead of errors. While <section>
and other new HTML5 tags require a heading tag, it's perfectly valid not to have one for <nav>
areas.
See also
The http://html5doctor.com site is a terrific interactive reference written by seven thought leaders including Rich Clark, Bruce Lawson, Jack Osborne, Mike Robinson, Remy Sharp, Tom Leadbetter, and Oli Studholme.
- 社會科學數據處理軟件應用
- 四時風月繪:國風水墨CG插畫繪畫技法
- Animate 2022動畫制作:團體操隊形
- Core Data iOS Essentials
- BPEL Cookbook: Best Practices for SOA/based integration and composite applications development
- Photoshop案例實戰從入門到精通
- PPT 2016幻燈片設計與制作從入門到精通
- DSP開發寶典
- 專業級音樂制作理論與實踐Pro Tools:從入門到應用
- Puppet權威指南
- 從零開始:Illustrator CC中文版基礎培訓教程
- 虛擬現實:沉浸于VR夢境
- 原片蛻變:Photoshop CC商業修圖必修課
- 中文版Photoshop CC基礎教程
- 企業微信公眾平臺開發實戰:再小的個體也有自己的品牌