Most new HTML5 elements are covered in elsewhere in this blog (most particularly the forms and multimedia reading lists) but there are a few dozen tags that don’t fit into those categories. Most of these are section elements, newly introduced in HTML5, and are fundamental to the construction of a modern web page.
Goal: Build a page using HTML5 markup
Prerequisites: HTML5 Backgrounder
Total time: 3 hours
Core Material
HTML5 Section Elements
Best Practices For Header & Nav
<main>
<address>
The data tag & attribute
contentEditable
download
details & summary
Detecting details support
preload
Resource Hints
Mininfication
Supplementary Material
Read “HTML Hierarchy” and “HTML Semantics” from marksheet.io (12 minutes).
When You’re Done
When you’re finished with this reading list, you’ll be ready to make longer pages with more content in semantic markup. Before doing that, you should probably learn more about typography and writing on the web.
Photograph of a building in downtown Oslo by Ram Yoga, under a Attribution Non-commercial No-Derivations 2.0 generic license
Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.