HTML5 after about three and half years, plus tips on semantic tags

HTML5 has been around for a while now, the original standard was published in October, 2014. By early 2018, most browsers fully support its core features. You don't need shims or polyfills anymore for the basics, even in older enterprise environments.

Edge, Chrome, Firefox, and Safari all handle the semantic elements correctly, and even IE11 understands most of them. That means you can safely use the newer tags for better structure and accessibility without breaking layout.

Here's a quick reminder of some HTML5 semantic tags that are easy to overlook but quite handy:

• <main>: defines the main content of the page; helps screen readers jump past navigation.
• <section>: groups related content with its own heading; good for dividing long articles or pages.
• <article>: self-contained content that could stand on its own (blog post, news item, etc.).
• <aside>: side content like tips, notes, or related links; visually separate but still part of the document.
• <figure> and <figcaption>: pairs images or code samples with their captions.
• <mark>: highlights a run of text, often used to show search matches or changes.
• <time>: marks a date or time value, which can be machine-readable with a datetime attribute.
• <details> and <summary>: creates a simple expand/collapse block without any JavaScript.
• <meter> and <progress>: show measurements and progress indicators natively.

And yes, all of those work nicely across modern browsers. Even mobile browsers (Android, iOS Safari) support most of them today.

If you're maintaining older layouts, it's worth gradually replacing generic <div> elements with meaningful ones. It makes your pages easier to read, style, and index, and also improves accessibility without any extra code.

Happy hypertexting!