Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
tree: 21c9303d88
Fetching contributors…

Cannot retrieve contributors at this time

199 lines (192 sloc) 12.6 kb
<!DOCTYPE html>
<meta charset=utf-8>
<title>Table of Contents - Dive Into HTML5</title>
<link rel=icon href=favicon.ico>
<link rel=alternate type=application/atom+xml href=https://github.com/diveintomark/diveintohtml5/commits/master.atom>
<link rel=stylesheet href=screen.css>
<style>
h1:before{content:''}
dl{clear:both;width:100%;overflow:hidden;background:#fff url(i/dot.png) repeat-x 0 0.8em}
dt,dd{background:#fff}
dt{float:left;padding-right:3px}
dd{margin:0;float:right;padding-left:3px}
ol{margin:0;padding:0;list-style:none}
li ol{width:95%;padding-left:5%}
</style>
<link rel=stylesheet media='only screen and (max-device-width: 480px)' href=mobile.css>
<link rel=prefetch href=detect.html>
<p>You are here: <a href=index.html>Home</a> <span class=u>&#8227;</span> Dive Into <abbr>HTML5</abbr> <span class=u>&#8227;</span>
<h1>Table of Contents</h1>
<!-- toc -->
<ol>
<li id=introduction><a href=introduction.html>Introduction: Five Things You Should Know About <abbr>HTML5</abbr></a>
<ol>
<li><dl><dt><a href=introduction.html#one>1. It&#8217;s not one big thing</a><dd>i</dl>
<li><dl><dt><a href=introduction.html#two>2. You don&#8217;t need to throw anything away</a><dd>ii</dl>
<li><dl><dt><a href=introduction.html#three>3. It&#8217;s easy to get started</a><dd>iii</dl>
<li><dl><dt><a href=introduction.html#four>4. It already works</a><dd>iv</dl>
<li><dl><dt><a href=introduction.html#five>5. It&#8217;s here to stay</a><dd>v</dl>
</ol>
<li id=past><a href=past.html>A Quite Biased History of <abbr>HTML5</abbr></a>
<ol>
<li><dl><dt><a href=past.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=past.html#mime-types>MIME types</a><dd>ii</dl>
<li><dl><dt><a href=past.html#history-of-the-img-element>A long digression into how standards are made</a><dd>iii</dl>
<li><dl><dt><a href=past.html#an-unbroken-line>An unbroken line</a><dd>iv</dl>
<li><dl><dt><a href=past.html#timeline>A timeline of HTML development from 1997 to 2004</a><dd>v</dl>
<li><dl><dt><a href=past.html#xhtml>Everything you know about XHTML is wrong</a><dd>vi</dl>
<li><dl><dt><a href=past.html#webapps-cdf>A competing vision</a><dd>vii</dl>
<li><dl><dt><a href=past.html#whatwg>WHAT Working Group?</a><dd>viii</dl>
<li><dl><dt><a href=past.html#reinventing-html>Back to the W3C</a><dd>ix</dl>
<li><dl><dt><a href=past.html#postscript>Postscript</a><dd>x</dl>
<li><dl><dt><a href=past.html#further-reading>Further Reading</a><dd>xi</dl>
</ol>
<li id=detect><a href=detect.html>Detecting <abbr>HTML5</abbr> Features: It&#8217;s Elementary, My Dear Watson</a>
<ol>
<li><dl><dt><a href=detect.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=detect.html#techniques>Detection Techniques</a><dd>ii</dl>
<li><dl><dt><a href=detect.html#modernizr>Modernizr, an HTML5 Detection Library</a><dd>iii</dl>
<li><dl><dt><a href=detect.html#canvas>Canvas</a><dd>iv</dl>
<li><dl><dt><a href=detect.html#canvas-text>Canvas Text</a><dd>v</dl>
<li><dl><dt><a href=detect.html#video>Video</a><dd>vi</dl>
<li><dl><dt><a href=detect.html#video-formats>Video Formats</a><dd>vii</dl>
<li><dl><dt><a href=detect.html#storage>Local Storage</a><dd>viii</dl>
<li><dl><dt><a href=detect.html#workers>Web Workers</a><dd>ix</dl>
<li><dl><dt><a href=detect.html#offline>Offline Web Applications</a><dd>x</dl>
<li><dl><dt><a href=detect.html#geolocation>Geolocation</a><dd>xi</dl>
<li><dl><dt><a href=detect.html#input-types>Input Types</a><dd>xii</dl>
<li><dl><dt><a href=detect.html#input-placeholder>Placeholder Text</a><dd>xiii</dl>
<li><dl><dt><a href=detect.html#input-autofocus>Form Autofocus</a><dd>xiv</dl>
<li><dl><dt><a href=detect.html#microdata>Microdata</a><dd>xv</dl>
<li><dl><dt><a href=detect.html#history>History <abbr>API</abbr></a><dd>xvi</dl>
<li><dl><dt><a href=detect.html#further-reading>Further Reading</a><dd>xvii</dl>
</ol>
<li id=semantics><a href=semantics.html>What Does It All Mean?</a>
<ol>
<li><dl><dt><a href=semantics.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=semantics.html#the-doctype>The Doctype</a><dd>ii</dl>
<li><dl><dt><a href=semantics.html#html-element>The Root Element</a><dd>iii</dl>
<li><dl><dt><a href=semantics.html#head-element>The &lt;head> Element</a><dd>iv</dl>
<li><dl><dt><a href=semantics.html#encoding>Character Encoding</a><dd>v</dl>
<li><dl><dt><a href=semantics.html#link>Friends &amp; (Link) Relations</a><dd>vi</dl>
<li><dl><dt><a href=semantics.html#new-elements>New Semantic Elements in HTML5</a><dd>vii</dl>
<li><dl><dt><a href=semantics.html#unknown-elements>A long digression into how browsers handle unknown elements</a><dd>viii</dl>
<li><dl><dt><a href=semantics.html#header-element>Headers</a><dd>ix</dl>
<li><dl><dt><a href=semantics.html#article-element>Articles</a><dd>x</dl>
<li><dl><dt><a href=semantics.html#time-element>Dates and Times</a><dd>xi</dl>
<li><dl><dt><a href=semantics.html#nav-element>Navigation</a><dd>xii</dl>
<li><dl><dt><a href=semantics.html#footer-element>Footers</a><dd>xiii</dl>
<li><dl><dt><a href=semantics.html#further-reading>Further Reading</a><dd>xiv</dl>
</ol>
<li id=canvas><a href=canvas.html>Let&#8217;s Call It a Draw(ing Surface)</a>
<ol>
<li><dl><dt><a href=canvas.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=canvas.html#shapes>Simple Shapes</a><dd>ii</dl>
<li><dl><dt><a href=canvas.html#coordinates>Canvas Coordinates</a><dd>iii</dl>
<li><dl><dt><a href=canvas.html#paths>Paths</a><dd>iv</dl>
<li><dl><dt><a href=canvas.html#text>Text</a><dd>v</dl>
<li><dl><dt><a href=canvas.html#gradients>Gradients</a><dd>vi</dl>
<li><dl><dt><a href=canvas.html#images>Images</a><dd>vii</dl>
<li><dl><dt><a href=canvas.html#ie>What About IE?</a><dd>viii</dl>
<li><dl><dt><a href=canvas.html#halma>A Complete, Live Example</a><dd>ix</dl>
<li><dl><dt><a href=canvas.html#further-reading>Further Reading</a><dd>x</dl>
</ol>
<li id=video><a href=video.html>Video in a Flash (Without That Other Thing)</a>
<ol>
<li><dl><dt><a href=video.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=video.html#video-containers>Video Containers</a><dd>ii</dl>
<li><dl><dt><a href=video.html#video-codecs>Video Codecs</a><dd>iii</dl>
<li><dl><dt><a href=video.html#audio-codecs>Audio Codecs</a><dd>iv</dl>
<li><dl><dt><a href=video.html#what-works>What Works on the Web</a><dd>v</dl>
<li><dl><dt><a href=video.html#licensing>Licensing Issues with H.264 Video</a><dd>vi</dl>
<li><dl><dt><a href=video.html#miro>Encoding Video With<br>Miro Video Converter</a><dd>vii</dl>
<li><dl><dt><a href=video.html#firefogg>Encoding Ogg Video with Firefogg</a><dd>viii</dl>
<li><dl><dt><a href=video.html#ffmpeg2theora>Batch Encoding Ogg Video with ffmpeg2theora</a><dd>ix</dl>
<li><dl><dt><a href=video.html#handbrake-gui>Encoding H.264 Video with HandBrake</a><dd>x</dl>
<li><dl><dt><a href=video.html#handbrake-cli>Batch Encoding H.264 Video with HandBrake</a><dd>xi</dl>
<li><dl><dt><a href=video.html#webm-cli>Encoding WebM Video with ffmpeg</a><dd>xii</dl>
<li><dl><dt><a href=video.html#markup>At Last, The Markup</a><dd>xiii</dl>
<li><dl><dt><a href=video.html#ie>What About IE?</a><dd>xiv</dl>
<li><dl><dt><a href=video.html#ios>Issues on iPhones and iPads</a><dd>xv</dl>
<li><dl><dt><a href=video.html#android>Issues on Android devices</a><dd>xvi</dl>
<li><dl><dt><a href=video.html#example>A Complete, Live Example</a><dd>xvii</dl>
<li><dl><dt><a href=video.html#further-reading>Further Reading</a><dd>xviii</dl>
</ol>
<li id=geolocation><a href=geolocation.html>You Are Here (And So Is Everybody Else)</a>
<ol>
<li><dl><dt><a href=geolocation.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=geolocation.html#w3c>The Geolocation API</a><dd>ii</dl>
<li><dl><dt><a href=geolocation.html#the-code>Show Me The Code</a><dd>iii</dl>
<li><dl><dt><a href=geolocation.html#errors>Handling Errors</a><dd>iv</dl>
<li><dl><dt><a href=geolocation.html#options>Choices! I Demand Choices!</a><dd>v</dl>
<li><dl><dt><a href=geolocation.html#ie>What About IE?</a><dd>vi</dl>
<li><dl><dt><a href=geolocation.html#geo-js>geo.js to the Rescue</a><dd>vii</dl>
<li><dl><dt><a href=geolocation.html#putting-it-all-together>A Complete, Live Example</a><dd>viii</dl>
<li><dl><dt><a href=geolocation.html#further-reading>Further Reading</a><dd>ix</dl>
</ol>
<li id=storage><a href=storage.html>A Place To Put Your Stuff</a>
<ol>
<li><dl><dt><a href=storage.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=storage.html#history>A Brief History of Local Storage Hacks Before HTML5</a><dd>ii</dl>
<li><dl><dt><a href=storage.html#localstorage>Introducing HTML5 Storage</a><dd>iii</dl>
<li><dl><dt><a href=storage.html#methods>Using HTML5 Storage</a><dd>iv</dl>
<li><dl><dt><a href=storage.html#halma>HTML5 Storage in Action</a><dd>v</dl>
<li><dl><dt><a href=storage.html#future>Beyond Named Key-Value Pairs: Competing Visions</a><dd>vi</dl>
<li><dl><dt><a href=storage.html#further-reading>Further Reading</a><dd>vii</dl>
</ol>
<li id=offline><a href=offline.html>Let&#8217;s Take This Offline</a>
<ol>
<li><dl><dt><a href=offline.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=offline.html#manifest>The Cache Manifest</a><dd>ii</dl>
<li><dl><dt><a href=offline.html#events>The Flow of Events</a><dd>iii</dl>
<li><dl><dt><a href=offline.html#debugging>The fine art of debugging, a.k.a. &#8220;Kill me! Kill me now!&#8221;</a><dd>iv</dl>
<li><dl><dt><a href=offline.html#halma>Let&#8217;s Build One!</a><dd>v</dl>
<li><dl><dt><a href=offline.html#further-reading>Further Reading</a><dd>vi</dl>
</ol>
<li id=forms><a href=forms.html>A Form of Madness</a>
<ol>
<li><dl><dt><a href=forms.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=forms.html#placeholder>Placeholder Text</a><dd>ii</dl>
<li><dl><dt><a href=forms.html#autofocus>Autofocus Fields</a><dd>iii</dl>
<li><dl><dt><a href=forms.html#type-email>Email Addresses</a><dd>iv</dl>
<li><dl><dt><a href=forms.html#type-url>Web Addresses</a><dd>v</dl>
<li><dl><dt><a href=forms.html#type-number>Numbers as Spinboxes</a><dd>vi</dl>
<li><dl><dt><a href=forms.html#type-range>Numbers as Sliders</a><dd>vii</dl>
<li><dl><dt><a href=forms.html#type-date>Date Pickers</a><dd>viii</dl>
<li><dl><dt><a href=forms.html#type-search>Search Boxes</a><dd>ix</dl>
<li><dl><dt><a href=forms.html#type-color>Color Pickers</a><dd>x</dl>
<li><dl><dt><a href=forms.html#validation>Form Validation</a><dd>xi</dl>
<li><dl><dt><a href=forms.html#required>Required Fields</a><dd>xii</dl>
<li><dl><dt><a href=forms.html#further-reading>Further Reading</a><dd>xiii</dl>
</ol>
<li id=extensibility><a href=extensibility.html>&#8220;Distributed,&#8221; &#8220;Extensibility,&#8221; And Other Fancy Words</a>
<ol>
<li><dl><dt><a href=extensibility.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=extensibility.html#what-is-microdata>What is Microdata?</a><dd>ii</dl>
<li><dl><dt><a href=extensibility.html#data-model>The Microdata Data Model</a><dd>iii</dl>
<li><dl><dt><a href=extensibility.html#person>Marking Up People</a><dd>iv</dl>
<li><dl><dt><a href=extensibility.html#organization>Marking Up Organizations</a><dd>v</dl>
<li><dl><dt><a href=extensibility.html#event>Marking Up Events</a><dd>vi</dl>
<li><dl><dt><a href=extensibility.html#review>Marking Up Reviews</a><dd>vii</dl>
<li><dl><dt><a href=extensibility.html#further-reading>Further Reading</a><dd>viii</dl>
</ol>
<li id=history><a href=history.html>Manipulating History for Fun <i>&amp;</i> Profit</a>
<ol>
<li><dl><dt><a href=history.html#divingin>Diving In</a><dd>i</dl>
<li><dl><dt><a href=history.html#why>The Why</a><dd>ii</dl>
<li><dl><dt><a href=history.html#how>The How</a><dd>iii</dl>
<li><dl><dt><a href=history.html#further-reading>Further Reading</a><dd>iv</dl>
</ol>
<li class=app><a href=everything.html>The All-In-One Almost-Alphabetical No-Bullshit Guide to Detecting Everything</a>
<ol>
<li><dl><dt><a href=everything.html#further-reading>Further Reading</a><dd>i</dl>
</ol>
<li class=app><a href=peeks-pokes-and-pointers.html><abbr>HTML5</abbr> Peeks, Pokes and Pointers</a>
<ol>
</ol>
</ol>
<!-- /toc -->
<p class=a>&#x2767;
<p class=c>&#8220;If you&#8217;re good at something, never do it for free.&#8221; <span class=u>&mdash;</span><cite>The Joker</cite><br>(but that doesn&#8217;t mean you should keep it to yourself)
<p class=c>Copyright MMIX&ndash;MMXI <a href=about.html>Mark Pilgrim</a>
<form action=http://www.google.com/cse><div><input type=hidden name=cx value=014021643941856155761:6jgee_nxreo><input type=hidden name=ie value=UTF-8><input type=search name=q size=25 placeholder="powered by Google&trade;">&nbsp;<input type=submit name=sa value=Search></div></form>
Jump to Line
Something went wrong with that request. Please try again.