Ir al contenido principal

Etiquetas básicas de Diseño de HTML5



















  • <!DOCTYPE html> Te permiten usar todas las habilidades de HTML5 sin que nada de lo que ya tienes programado deje de funcionar.
  • <header>Diseñada para reemplazar la necesidad de crear div sin significado semántico.
  • <hgroup> Permite colocar un h1, h2 y h3 dentro del header sin afectar el SEO, permitiendo usar otro h1 en el sitio.
  • <nav> Diseñado para que ahí coloques la botonera de navegación principal.
  • <section> Define un área de contenido única dentro del sitio. En un blog, seria la zona donde están todos los pots.
  • <article> Define zonas únicas de contenido independiente. En el home de un blog, cada post seria un article.
  • <aside> Cualquier contenido que no este relacionado con el objeto primario de la pagina va en un aside.
  • <footer> Es el pie de pagina y todo lo que compone.

Las etiquetas semánticas, a pesar de ser claves para posicionamiento en buscadores y buen desarrollo web, no son la razón por la que todo el mundo habla de HTML5. Vídeo, audio y animación vectorial están en la lista de prioridades y en la boca de todas las personas que evangelizan su uso. Específicamente, las nuevas etiquetas son:


  • <video> Inserta vídeo sin necesidad de plugins.
  • <audio> Lo mismo que vídeo, pero sin vídeo. Puede usar múltiples formatos, en especial mp3, pero también depende del navegador.
  • <imput*> Tiene la capacidad de insertar cajas tipo email que se autovalidan, calendarios tipo "date", sliders, números, entre otras. Ademas de las capacidades ya existentes que son insertar cajas de texto y botones.
  • <canvas> Un área de dibujo vectorial y de bipmaps con Javascript.
  • <svg> Una etiqueta igual que <img>, para insertar dibujos y animaciones vectoriales al estilo de Flash.

Comentarios