Dar estilo a etiquetas HTML5

[Benderzuelo]

Buenas tardes amigos/as

he comenzado a programar una web en PHP y la quiero hacer con HTML5, la cuestion es que no tengo ni idea y estoy intentando aprender HTML5 y CSS3, mi duda es...

Si la etiqueta nav es para el MENU, puedo darle estilo a ella como si fuera un div?,o le doy estilo a un div id="menu" y dentro pongo la nav envolviendo al menu?

<div id="menu">
<nav>
<ul>
<li>Inicio</li>
<li>Page 1</li>
<li>Page 2 </li>
</ul>
<nav>
</div>

O bien darle estilo quedando asi?

<nav id="menu">
<ul>
<li>Inicio</li>
<li>Page 1</li>
<li>Page 2 </li>
</ul>
<nav>

Más que nada quería saberlo por si me puede afectar luego para SEO u otra cosa.

Gracias por adelantado

[PHPeros]

Un nav en sí ya es un contenedor como la mayoría de etiquetas. Puede tener todas las propiedades de CSS3 que quieras. En cuanto al SEO no creo que afecte, pero tener una página bien ordenada es bueno para todo.

[Benderzuelo]

OK, entiendo, muchas gracias.

Pero...¿Hay alguna preferencia con respecto a darles estilo directamente o darselo a un div y meter las etiquetas dentro?

Gracias otra vez

[PHPeros]

Es recomendable que lo hagas por razones de estructura o por propia necesidad. Por ejemplo: Si tienes varios párrafos (<p>) que forman un texto, y un heading (<h1>) que da el título al texto, puedes agruparlos en un contenedor llamado "articulo" y desde él dar un estilo en común a todos sus elementos. Luego ya podrás estilizar elementos más concretamente. También debes acostumbrarte a trabajar con clases para elementos del mismo tipo o relacionados.

Saludos

[pzin]

Trátalos como si fuesen div. ¿Pondrías un div dentro de otro sólo para darle estilo? Probablemente no. Pues con los nuevos elementos de HTML5 es igual.

La etiqueta div lo único que no tiene es un significado semántico, de hecho viene de division, luego los nuevas etiquetas HTML5 tienen más significado semántico que las primeras. Poder puedes hacerlo de ambas formas, precisamente por esa carencia de significado semántico, pero, ¿es útil? Para que el caso que propones seguramente no lo sea, porque es agregar más elementos sin que haga realmente falta. Pero si te hiciera falta, tampoco habría problema en hacerlo.

[Benderzuelo]

Pues muchísimas gracias a los 2. Le dare estilo a las etiquetas y pasare de poner divs innecesarios.

Saludos ;)

[Rafael]

Yo a veces dejo un div por fuera pero para poner cosas adicionales del conjunto que no sean navegación, algún ícono por ejemplo, pero que visualmente sean parte del bloque menú.

[Eckonet]

Bueno yo estoy aprendiendo HTML5 y CSS3 Actualmente y en las paginas de pruebas que hago siempre clasifico las etiquetas, hasta los H1 los pongo en grupo xD

<nav class="MenuPrincipal">
<nav class="MenuSecundario">
<article class="ArticuloPrincipal">
<article class="ArticuloSecundario">
<hgroup class="Encabezados">
<hgroup class="EncabezadosArticulos">
etc etc etc

Esta bien hacerlo de esta manera entonces?

[pzin]

Yo no usaría hgroup ya que al final lo eliminaron del borrador de HTML5.

De todas formas, ahí solo estás mostrando que usas las etiquetas, no cómo las estás usando, no se puede apreciar estructura al no poner las etiquetas de cierre.

Cuando publiques código, usa la opción highlight para que se vea mejor.