Etiquetas HTML5 que no pueden pasar desapercibidas

Para comenzar, no sé si ya tienes instalado en tu navegador Chrome la extensión "HeadingsMap", si no es así, te recomiendo que lo instales porque así podrás ver el índice o mapa de la estructura de tu sitio Web.

https://chrome.google.com/webstore/detail/headingsmap/flbjommegcjonpdmenkdiocclhjacmbi?hl=en

Por ejemplo, en la siguiente imagen se muestra el índice de la página de la empresa "Casteret Grupo Explora" en la web de Turispain.com

Para que tu página Web tenga éste índice hay etiquetas de HTML5 que no pueden faltar en tu código:

<header>

La etiqueta <header> se utiliza para agregar los elementos de la cabecera de nuestra página (los h1-h6), así como los enlaces de navegación por nuestros sitio. Aunque puede ser cabecera de cualquier otro contenedor.

http://www.w3.org/TR/html-markup/header.html

<nav>

Permite incluir entre las etiquetas <nav></nav> nuestros enlaces de navegación, listas, etc. Ejemplo:

<nav>
  <a href="#">Enlace 1</a> |
  <a href="#">Enlace 2</a> |
</nav>

http://www.w3.org/TR/html-markup/nav.html

<main>

Nuestro código debe estar contenido entre las etiquetas <main></main> pero sólo se debe usar una vez por página.

Esta etiqueta hace referencia al contenido principal del body de nuestra página web y tienes que tener en cuenta que no puede ser hija de las etiquetas: header, nav, article, aside y footer.

http://www.w3schools.com/tags/tag_main.asp

<article>

Se puede utilizar cuando su contenido sea independiente del resto de contenido, es decir, que tenga significado propio, pudiendo ser reutilizable luego en otras páginas. Por ejemplo, un artículo de un periódico, el post en un foro, una entrada de un blog,etc.

Podemos incluir varios <article> en una página ya sea dentro de una <section> o fuera de ella.

http://www.w3.org/TR/html5/sections.html#the-article-element

<section>

Puede ser una temática dentro de un contenido, que guarda relación con este. Generalmente se incluye entre las etiquetas <section></section> el encabezado de una página (los h1-h6).

Una página web, por ejemplo, puede estar estructurada por las secciones: Introducción, Noticias e Información de Contacto.

http://www.w3.org/TR/html5/sections.html#the-section-element

<aside>

Esta etiqueta la utilizaremos para incluir el contenido secundario de nuestra página, es decir, las redes sociales, la publicidad, enlaces externos, etc. Siempre y cuando no utilicemos otra etiqueta adecuada a la situación, por ejemplo, si las redes sociales las incluyes en el pie de tu página entonces es mejor que utilices la etiqueta <footer>

http://www.w3.org/TR/html-markup/aside.html

<footer>

Como su nombre lo indica, se utiliza para el pie de página, donde incluiremos: el típico ¿Quiénes somos?, Contacta con nosotros, el Aviso legal y de privacidad de la empresa, el mapa de nuestra web...Ejemplo:

<footer>
    <ul>
        <li><a href="#">¿Quiénes somos?</a></li>
        <li><a href="#">Contacta con nosotros</a></li>
        <li><a href="#">Aviso Legal</a></li>
    </ul>   
</footer>   

http://www.w3.org/TR/html5/sections.html#the-footer-element