Comunidad de diseño web y desarrollo en internet online

Maquetación HTML5 y Validación W3C

Citar            
MensajeEscrito el 25 Feb 2012 05:34 am
Hola amigos de Cristalab. Motivado con las conferencias y demás videos de Mejorando.la es que comencé a modificar la estructura de mi sitio basado en las nuevas etiquetas que nos ofrece ahora HTML5, lo que me agrada pues en primera instancia, y si es que me perdonan la autoreferencia, me permite entender mucho mejor el código.

Bueno, el caso es que tengo algunas dudas que quisiera compartir pues he estado muy entretenido codeando y no quiero continuar mientras no me aclare. El problema mayor es que después de leer horas y horas me encuentro con posiciones y opciones tan distintas como a veces contradictorias. Pero vamos a lo que importa.

1. Al validar el código las tildes en la etiqueta "title" de "head" me arrojan error y antes de pasarme a html5 no me había pasado.

2. Quería saber que etiqueta usar para el menú que tengo en el footer. Para el menú principal uso NAV, sin embargo, he leído en muchos lados que no debo repetirla y la etiqueta MENU el validador me la rechaza. ¿La dejo como un simple div?

3. Aún estoy complicado un poco con SECTION y ARTICLE. He entendido que SECTION es para agrupar contenido relacionado y ARTICLE para contenido que podría ser independiente por sí solo, pudiendo tener su propio header y footer. Bien. Lo que no sé es si es válido anidar varios SECTION cuando el subcontenido también está relacionado pero no es independiente.

Y bueno, codeando un poco se me ocurre lo siguiente:

Código HTML :

<!doctype html>
<html lang="es-cl">
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<header id=""><h1>Título del Sitio</h1></header>
<nav>
<ul>
<li><a href="#">p</a></li>
<li><a href="#">p</a></li>
<li><a href="#">p</a></li>
</ul>
</nav>
<!-- contenido del sitio -->
<section>
<section>
<header><h2>nombre de la seccion</h2></header>
<aside><h3>nombre del usuario registrado con php</h3></aside>
</section>
<section>
aqui más contenido y cosas.
<article>
<form></form>
</article>
</section>
</section>
<!-- contenido del sitio -->
<footer>
<section>
<aside>
<ul>
<li><a href="#">face</a></li>
<li><a href="#">google</a></li>
<li><a href="#">twitter</a></li>
</ul>
</aside>
<div>
<ul>
<li><a href="#">acerca</a></li>
<li><a href="#">privacidad</a></li>
<li><a href="#">ayuda</a></li>
</ul>
</div>
</section>
</footer>
</body>
</html>
Y bueno, lo he escrito un poco rápido pero esa es la idea general de lo que quiero hacer y de cómo entiendo el uso de las etiquetas. Cualquier acotación será bienvenida porque esto me tiene entusiasmado y espero haberlo entendido bien.

Buena Caza y Largas Lunas a todos.

Por eareddhel

83 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 25 Feb 2012 02:02 pm
Leyendo el código veo que lo has entendido bien. Solo dos comentarios.

<footer> ya es un "<section>" así que no necesitas poner <section> dentro de <footer>.

Y me gustaría saber cuál es la racionalización detrás de "<nav> no se debe repetir". Si el menú en cuestión sirve para navegar el sitio, entonces semánticamente es un <nav>, no importa dónde esté ni cuantos sean.

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 25 Feb 2012 06:59 pm
¡Magnífico! Gracias DriverOp por contestar como siempre. Me alegra haberlo entendido bien. Tienes razón con lo del footer y sí, no sería necesario.

Respecto de <nav>, he leído en muchas webs que sólo debe ser usada para el menú de navegación principal y que debe aparecer sólo una vez, quizás por razones orientadas a SEO. Al final fui a la fuente (debería haber sido lo primero) y en el punto 4.4.3 The nav element de la especificación del html5 del w3c dice lo siguente:

No todos los grupos de enlaces en una página necesita estar en un elemento de navegación - únicas secciones que constan de bloques de navegación principales son apropiados para el elemento de navegación. En particular, es común que los pies de página para tener una breve lista de enlaces a distintas páginas de un sitio, tales como las condiciones del servicio, la página de inicio, y una página de derechos de autor. El elemento de pie por sí sola es suficiente para estos casos, sin un elemento de navegación.

Por lo que deduzco que sólo los links de la navegación principal deberían ir en un <nav> y los link del footer quedarían en un simple div pues la semántica indicaría que esos links "secundarios" van en el footer.

Ahora, si yo tuviese un menú principal, y menús ocultos según el nivel o privilegios del usuario registrado ¿Debería encerrar todos esos menús dentro de <nav>? ¿O más bien debería dejar los menús de usuarios en divs por debajo de <nav>? Sería más simple que <menu> fuera soportado e implementado para estos casos. Espero hacerme entender.

Saludos a la comunidad y a todos los que siguen la conferencia en línea.

Buena Caza y Largas Lunas.

Por eareddhel

83 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 25 Feb 2012 11:06 pm
Pues si la W3C lo dice habrá que respetarle. De hecho por lo que acabas de citar mi sitio web está "en falta" -_-... Cuando lo implementé no decía nada de eso.

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 26 Feb 2012 12:47 am
Es lo mismo que pensé. "Si ellos lo dicen..." Gracias DriverOp por la amabilidad de siempre.

:cool:

Buena Caza y Largas Lunas.

Por eareddhel

83 de clabLevel



Genero:Masculino  

msie

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.