Etiquetas básicas
# Estructura: <body>, <section>, <article>, <nav>, <aside>, <header>, <footer>, <h1>..<h6>, <details>, <summary> # aside se aconseja para barras lateras, textos explicativos, bloques destacados... # Semántica: <a>, <p>, <form>, <img>, <table>, <ol>, <ul>, <dl>, <code>, <small>, <cite>, <quote>, <abbr>, <mark>, <dfn>, <data>, <time>, <var>, <address>, <figure>, <figcaption> # Estilo: # Ojo que tanto <div> como <span> no siguen una estructura jerárquica (aún cuando se aniden) <div>, <span> <!-- Comentario -->
Etiquetas obsoletas
<b> -> font-style:bold / <strong> <i> -> font-style:italic / <em> <u> -> text-decoration:underline <acronym> -> <abbr> <tt>, <xmp> <applet> -> <object> <center>, <font>, <big> <frame> # atributos: align, background, bgcolor
Caracteres referenciados
Lista completa (W3C)
Los más habituales:
# espacio en blanco # acentos -> acute Á ó # acentos invertidos -> grave è # tilde, ñ ã ñ # ampersand, copyright, grado & © ° # dolar, euro $ € # flechas -> arrow ← ↑ → ↓
Ejemplo de página básica
<!DOCTYPE html>
<head>
<meta charset="UTF-8" />
<title>TÃtulo de la página</title>
<style>...</style>
</head>
<body>
<header>
<h1>TÃtulo cabecera (Nombre del sitio web)</h1>
</header>
<nav>
<header>
<h2>TÃtulo navegación</h2>
</header>
<ul>... </ul>
</nav>
<article>
<header>
<h1>TÃtulo del artÃculo</h1>
<h2>SubtÃtulo del artÃculo</h2>
</header>
<section>
<h3>TÃtulo de la sección</h3>
</section>
<footer>
<h4>TÃtulo del pie del artÃculo</h4>
</footer>
</article>
<aside>
<h2>TÃtulo del texto explicativo</h2>
<section>
</section>
</aside>
<footer>
Pie de página
</footer>
</body>
Referencias
«Dive into HTML5», por Mark Pilgrim.
Smashing Magazine:
HTML5 semantics
Designing a HTML5 layout from scratch
MDN HTML Developer Guide:
Using HTML sections & outlines
HTML5Doctor: