semanticas section nuevas etiquetas etiqueta estructura ejemplos html5 semantic-markup nav

section - Uso correcto de la etiqueta de navegación HTML5



nuevas etiquetas html5 (3)

<ul class="mainMenu"> <li><a href="#">Home</a></li> <li><a href="#">Forum</a></li> <li><a href="#" class="mainSelected">Construct</a></li> <li><a href="#">Arcade</a></li> <li><a href="#">Manual</a></li> </ul> <ul class="subMenu"> <li><a href="#">Homepage</a></li> <li><a href="#">Construct</a></li> <li><a href="#" class="underSelected">Products</a></li> <li><a href="#">Community Forum</a></li> <li><a href="#">Contact Us</a></li> </ul>

¿Es más correcto semánticamente tener un <nav> alrededor de estos <ul> individualmente, o debería uno de ellos envolver ambos?

¿También sería apropiado usar la etiqueta de navegación para envolver alrededor de los elementos del menú de pie de página?


Estoy de acuerdo con Martin. Envuélvalos en el elemento de navegación one.

Con respecto al pie de página, sí use otro elemento de navegación, siempre que los elementos naveguen dentro del sitio.


La búsqueda de la razón de la navegación ha estado sucediendo desde hace años. Simplemente busque en Google ahora mismo y encontrará fechas en la pregunta que se remontan a su introducción. El único uso real para la navegación que he encontrado hasta ahora es asociarlo con el estilo en css. Antes de que diga que hay mejores maneras de hacerlo, tenga en cuenta que los programadores no son las únicas personas que realizan el marcado de páginas. Para un artista comercial que diseña páginas web para ganarse la vida, es mejor tener una etiqueta simple que pensar en clases y subclases. Si ha seguido la discusión entre varios grupos por un tiempo, tendría la sensación de que podría estar en lo cierto. Muchos desarrolladores de páginas tienen que ver con el estilo: son artistas, no programadores.

Un poco más de confirmación: si observa las nuevas etiquetas estructurales en HTML5, puede obtener fácilmente la idea de que el comité quería elementos principales bien definidos de una página. Cada elemento principal puede verse y comportarse de manera diferente. Si desea diseñar una página web típica, entonces puede ser muy conveniente si alguien ya ha dado nombres a las etiquetas de sección de la página para que pueda pasar a la práctica de diseñarlos. Agregue una etiqueta de navegación en la parte de la página donde proporciona una sección de navegación. ¿Qué es eso, te preguntas? No es una de las otras secciones ya predefinidas como pie de página o barra lateral. Aquí hay un tutorial que muestra dónde cree el autor que está la sección de navegación, justo donde lo esperaría.

Esta bien. Si quiero construir una página que sea como un millón de páginas, y mi única preocupación es hacer que mis elecciones de colores y elementos artísticos sean diferentes a los demás, todo es bastante rutinario. Como programador, no siempre quiero eso. Quiero flexibilidad para lograr lo que la funcionalidad prevista necesita de una manera lógica y fácil de usar. Sería bueno si eso es más fácil que difícil. Entonces, solo para dar un poco de contraste para mostrar que hay dos lados en esta historia: lamento la pérdida de marcos y marcos en HTML5. iFrames son sustitutos pobres.

Los ganadores que están interesados ​​en el estilo sin preocuparse demasiado por la estructura y funcionalidad designables siempre han querido impulsar el desarrollo en css, que no es un lenguaje de programación. RE: pérdida de marcos, parece que volveré a los días en que la mayoría de las páginas web estaban estructuradas por tablas; excepto que quieren que defina tablas en css en lugar de etiquetas en la página. Parece que están haciendo todo lo posible para bloquear cualquier avance en las páginas dinámicas; permitiendo solo recargas de página completa para reestructurar cosas. (No es cierto si desea desaparecer de una imagen a otra dentro de la misma estructura de página).

Tal vez haya dicho un poco más de lo necesario para responder la pregunta, pero pensé que sería útil ampliar un poco el contexto general.


Para citar las especificaciones:

El elemento de navegación representa una sección de una página que enlaza con otras páginas o con partes dentro de la página: una sección con enlaces de navegación.

No todos los grupos de enlaces en una página tienen que estar en un elemento de navegación; solo las secciones que constan de bloques de navegación principales son apropiadas para el elemento de navegación. En particular, es común que los pies de página tengan una breve lista de enlaces a varias páginas de un sitio, como los términos del servicio, la página de inicio y una página de derechos de autor. El elemento de pie de página solo es suficiente para estos casos, sin un elemento de navegación.

Así que siéntete libre de envolver ambos en una sola etiqueta de navegación. No ajuste el pie de página, pero use la etiqueta de pie de página aquí :)

Lea las especificaciones aquí: http://dev.w3.org/html5/spec/Overview.html#the-nav-element