Mostrando entradas con la etiqueta html 5. Mostrar todas las entradas
Mostrando entradas con la etiqueta html 5. Mostrar todas las entradas




La etiqueta nav en html 5 es utilizada para contener elementos de navegación como puede ser el menú de navegación principal de un sitio web, esta etiqueta es el sustituto de la etiqueta ul combinada con un poco de css para generar el menú de nuestra web.
Sintaxis.-
||
|| < html>
|| < head>< title>< /title>< /head>
|| < body>
|| < header>
|| < h1>TITULO< /h1>
|| < /header>
|| < nav>
|| ELEMENTOS DEL MENU
|| < /nav>
|| < /body>
|| < /html>
||

Como verán la sintaxis es muy sencilla y facil de enten der, la función de esta etiqueta es solo delimitar los elementos del menú de navegación, los cuales pueden estar conformados por una lista desordenada como lo hacemos con html4 o Xhtml, ejemplo.-
||
|| < nav>
|| < ul>
|| < li>Elemento 1< /li>
|| < li>Elemento 2< /li>
|| < li>Elemento 3< /li>
|| < /ul>
|| < /nav>
||





La etiqueta header es la nueva etiqueta de titulo en html, dentro de esta etiqueta se muestra una serie de elementos introductorios de la pagina como el titulo de la misma o una imagen referente a la pagina como puede ser su logo.
Ademas de describir el contenido de una pagina, la etiqueta header también deberá utilizarse para describir secciones individuales dentro de la misma pagina, por ejemplo la pagina puede estar dividida en secciones, el titulo de la pagina referente al contenido y la sección de comentarios, quedaría así el código, ejemplo.-
||
|| < !DOCTYPE html>
|| < html>
|| < head>< title>TITULO DE LA PAGINA< /title>< /head>
|| < body>
|| < header>
|| < h1>TITULO PRINCIPAL< /h1>
|| < /header>
|| < section>
|| < header>
|| < h2>Subtitulo< /h2>
|| < header>
|| < p>contenido . . .< /p>
|| < section>
|| < section>
|| < header>
|| < h3>Comentarios< /h3>
|| < /header>
|| < p>Contenido de comentarios< /p>
|| < /section>
|| < /body>
|| < /html>
||

Como ven en el ejemplo es demasiado fácil estructurar nuestro documento con html 5, dando como resultado una web con mejor aspecto y mejor optimizada para los buscadores.


11/28/2009 | Posted in , , , , ,



Empezamos con decir que el doctype es el encargado de indicarle al navegador web que el documento que esta abriendo es un documento html, ademas de indicar que es un documento html también le indica la versión del html del mismo con el fin de renderizar la pagina de manera correcta para mostrarla de la mejor manera posible.
Este es un ejemplo del doctype de la versión anterior.-
||
|| < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
||

Ahora con la llegada de html 5, el doctype es bastante sencillo y compatible con las versiones anteriores de html y Xhtml, esta es su sintaxis.-
||
|| < !DOCTYPE html>
||

Demasiado fácil verdad?, es uno de los beneficios de la llegada de html 5, ahora solo falta esperar a que todos los navegadores web soporten los estándares de html 5.


11/27/2009 | Posted in , , ,


Una interesante colección de cheat sheet o guías rápidas para los nuevos estándares de html 5 y css3, sin duda son guías que nos servirán de gran apoyo al momento de crear paginas web.

Ingresar a la colección.