Embedding External Content with HTML 5`s Article Tag

While HTML 5 is admittedly for now a set of drafts subject to change by the W3 Consortium, sooner or later it’ll become a standard specification. This means that you, as a web designer, should start getting a more intimate knowledge of its features and learn how to put them to work for you in the near future.

So, if you’d like to acquire a better understanding of the (coming) specification, keep reading. In this article series I've been introducing you to the most relevant elements that come with HTML 5. This way you’ll be able to create clean and semantic web pages in a snap, without the need to always use generic containers like divs or lists.

Of course, if you've read the articles that preceded this one, you probably have a clear idea of how to create semantic headers, navigational sections, sidebars and footers by using the brand new tags provided by HTML 5. In those tutorials I covered each of these elements in detail. What’s more, I left off the last tutorial explaining how to work with the <aside> tag, which is useful for defining and reflecting a sidebar on a web page.

It’s fair to stress, though, that HTML 5 comes bundled with a few additional elements that allow you to define specific sections in a document while preserving its semantic meaning. That’s exactly the case with the <article> tag. It is designed to be used for embedding into a web page contents fetched from several external sources, such as third-party blogs or RSS feeds.

Therefore, in this penultimate installment of the series I’m going to take a closer look at the <article> element, so you can grasp its driving logic and begin using it in your HTML 5 documents. Let’s jump in!