Blog

Web standards are a good thing.

Depending on your relationship with the internet, you may have no idea what I am talking about. Web standards have been evolving for many years. They started off with a handful of ‘best practices’ to follow when designing and coding your webpages. Today’s definition of web standards means giving your markup semantic meaning so the information would be understandable even with no design elements applied to it. This means properly coding headlines with headline tags, paragraphs with paragraph tags and so on. It also means giving your markup a structure and using naming conventions that make sense.

HTML5 takes cues from web standards programming and goes one step further.

Headers and Sidebars and Sections, Oh My!

Typically when you are coding a webpage you will use multiple div tags to section off the content of the site. This would usually mean having a div for the header, a div for the main nav, a div for the footer and so on. HTML 5 takes these conventions and introduces tags for <header>, <nav>, <footer>, etc. Some of the new tags include:

<header>
The header tag is where your logo, branding message and quick links would live, normally at the top of the page. The header tag can also be used inside a <section> or <article>.

<nav>
The nav tag, as the tag suggests, would be your primary site navigation.

<section>
The section tag can be used similarly to how the div tag is used today. It will section off certain portions of your page.

<article>
The article tag represents areas of your site such as blog posts, articles or news items that would exist inside a <section> .

<aside>
The aside tag can be used for sidebar areas where you might have a list of links or secondary information. They can also be used for pull quotes.

<footer>
The footer tag can be used for the footer of the site where your text navigation and copyright information might be housed. The footer tag can also be used inside a <section> or <article> .

Since most websites are built with these sections in mind, it is perfectly logical that HTML5 makes the leap to rename tags that specify these particular sections.

The A/V Club

HTML5 also introduces the <video> and <audio> tags. These tags attempt to standardize the way video and audio get posted to the web. The video tag is already popping up on popular websites. YouTube (http://www.youtube.com/html5) recently launched a beta on their site that serves up HTML5 embedded videos instead of the current Flash-based videos. Vimeo (http://vimeo.com/blog:268) has launched a similar initiative by allowing you to choose between the Flash or HTML5 embedded video. If HTML5 has it’s way, it will be the de-facto standard for video and audio on the web. This is something that Adobe has to be looking at with great interest.

The Closing Tag

HTML5 has benefits for both the typical web user and the website developer. It will also help ween us off 3rd party plug-ins, which will end up making browsers more stable and will make content accessible on a wide variety of devices.

Although HTML5 support in current browsers is limited, it will play a tremendous role in website development in the very near future.

To see some of the HTML5 features in action, check this page with a modern web browser: http://html5demos.com/.

—

About Iris Professional Services
Iris Professional Services is a computer consulting company operating offices in both Seattle and Portland. Businesses throughout the Pacific Northwest rely on our expert IT consultants for all their network IT support services.