HTML page structure tutorial

Step 13 of 15: Supplementary content

Nik as a logo

<header>: Great place to put the site title

It might be a good idea to have the site name and logo in the header.
And remember to link the logo so it always goes back home.
Yeah that's right, my face is the logo.

<article>: This is where the message goes!

The article container is meant to be any self-contained boundary delimiting the content that embodies why the page exists. If it's a news story it goes here, if you're writing a blog post, similarly this is the place for it to be. It might help to think of it as the printed version of a page, when you print an article you're not interested in getting all the accompanying ads and comments or related links.

There is sometimes confusion whether the <article> should be used or the <main> should instead. The MAIN element is a good parent for things like the article and any associated content such as related stories. This means the MAIN element can encompass both the <article> and an <aside> and perhaps even subnavigation in a <nav> element. Keep the real meaningful purpose of the page within the <article> instead.

It would be a good idea to make sure this section is full of relevant keywords and that the links are well chosen, in that they are reputable on their subject matter, that they aren't selling a whole heap of ads or bad practices and ideally that they recognise you as being worth reciprocally linking back to. Link to inspirations, good reads, even data that backs the point. Avoid creating link farms.



← back Okayyy, moving that aside... →