[Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Eva García
Buenos días a tos@s,

Estoy empezando a usar HTML5 y me surge una duda. Tengo una Web donde tengo
la cabecera con su menú, debajo tengo un slide dentro de un section y
debajo quiero maquetar tres cajas que digamos son tres contenidos
destacados. Lo típico de poner tres cajas en horizontal con su foto,
título, breve texto y botón link para ampliar la información. La duda que
me surge es si cada caja la tengo que poner dentro de una etiqueta
section o si por el contrario tengo que crear una etiqueta section para
aglutinar las tres cajas y después cada una de estas etiquetarla como
article ¿Sería correcto esto?

section
article
h3Títtulo/h3
...
/article

article
h3Títtulo/h3
...
/article

article
h3Títtulo/h3
...
/article
/section

Seguidamente de esto tengo un listado de noticias y un listado de opiniones
de clientes ¿tendría que utilizar la misma estructura?

Gracias!!
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Marina Gallardo
Yo no sé cómo lo ven los demás, pero quizás el section tendría que estar
dentro del article no?

2013/2/27 Eva García evag...@gmail.com

 Buenos días a tos@s,

 Estoy empezando a usar HTML5 y me surge una duda. Tengo una Web donde tengo
 la cabecera con su menú, debajo tengo un slide dentro de un section y
 debajo quiero maquetar tres cajas que digamos son tres contenidos
 destacados. Lo típico de poner tres cajas en horizontal con su foto,
 título, breve texto y botón link para ampliar la información. La duda que
 me surge es si cada caja la tengo que poner dentro de una etiqueta
 section o si por el contrario tengo que crear una etiqueta section para
 aglutinar las tres cajas y después cada una de estas etiquetarla como
 article ¿Sería correcto esto?

 section
 article
 h3Títtulo/h3
 ...
 /article

 article
 h3Títtulo/h3
 ...
 /article

 article
 h3Títtulo/h3
 ...
 /article
 /section

 Seguidamente de esto tengo un listado de noticias y un listado de opiniones
 de clientes ¿tendría que utilizar la misma estructura?

 Gracias!!
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema marcos méndez filesi
el tema es complicado y hay opiniones para todos los gustos. Las
especificaciones no son claras.

Entonces, mi consejo:

1) No uses section para maquetar. Si lo que necesitas es un contenedor,
emplea un div.

2) Usa el section para separar partes conceptuales de una web que no tengan
su propia etiqueta semántica (header, nav o aside).

3) Ante la duda, NO uses section.

Por ejemplo, si esas tres cajas hacen referencia a algo relacionado con el
listado que viene después, NO las enmarques con un section.

Pero, si esas tres cajas no tienen nada que ver con lo que viene después o
viene antes, sí puedes enmarcarlas con un section.

Un poco de info complementaria

http://www.impressivewebs.com/html5-section/
http://html5doctor.com/the-section-element/


El 27 de febrero de 2013 10:18, Eva García evag...@gmail.com escribió:

 Buenos días a tos@s,

 Estoy empezando a usar HTML5 y me surge una duda. Tengo una Web donde tengo
 la cabecera con su menú, debajo tengo un slide dentro de un section y
 debajo quiero maquetar tres cajas que digamos son tres contenidos
 destacados. Lo típico de poner tres cajas en horizontal con su foto,
 título, breve texto y botón link para ampliar la información. La duda que
 me surge es si cada caja la tengo que poner dentro de una etiqueta
 section o si por el contrario tengo que crear una etiqueta section para
 aglutinar las tres cajas y después cada una de estas etiquetarla como
 article ¿Sería correcto esto?

 section
 article
 h3Títtulo/h3
 ...
 /article

 article
 h3Títtulo/h3
 ...
 /article

 article
 h3Títtulo/h3
 ...
 /article
 /section

 Seguidamente de esto tengo un listado de noticias y un listado de opiniones
 de clientes ¿tendría que utilizar la misma estructura?

 Gracias!!
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo




-- 
Marcos Méndez Filesi
http://www.mmfilesi.com/
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Carlos Núñez
Te paso un extracto que sigo como referencia:

Uso de div/ en HTML5 orientado a SEO
La etiqueta div no ha muerto, sigue ahí y sigue significando lo que siempre
ha significado: conjunto de elementos. En ningún momento se ha transformado
a una etiqueta tonta que puedas usar libremente para ayudarte con el CSS
ni ha sido sustituida totalmente por la etiqueta section/.

Por lo tanto nuestro deber es usarla como ayuda a la estructura de página:
como base para crear el layout de de nuestras páginas, siempre y cuando no
exista otra etiqueta de conjunto que represente mejor este papel... En
otras palabras, div es la herramienta para unir elementos cuando no podemos
asociar significado semántico a este conjunto.

Uso de section/ en HTML5 orientado a SEO
El uso de seción es muy parecido al de div pero aportando la carga de
significado mínima posible al contenido. Englobando distintos elmentos
dentro de una etiqueta section/ lo que estamos haciendo es declarar que
todo su contenido está relacionado y forma parte de un mismo significado o
elemento.

La diferencia es sutil pero muy importante: cuando creamos bloques cuyo
contenido forma un todo usaremos section/, cuando estos bloques responden
más a diseño o a necesidades de estructura usaremos div/gt.

Esta diferenciación también provoca que en todas estas maquetas que usan
200 divs para conseguir que con pocos conociemientos de CSS el diseño tome
forma no pasan a estar bien hechas, pero si que podemos decir que en html5
estan menos mal (dado que al menos hemos marcado con sections los
conjuntos que si que tienen significado sin liar tanto a los buscadores).

Uso de article/ en HTML5 orientado a SEO
Por último la etiqueta article/ es el siguiente paso a la hora de
declarar que un cojunto de elmentos en nuestra página tiene significado. En
este caso el paso dado es el dar a entender que ese conjunto tiene
significado claro incluso si lo sacamos totalmente de la página. Es decir,
al incluir algo dentro dentro de la etiqueta article/ lo que estamos
diciéndole a los buscadores es que dentro de este article podrá encontrar
contenidos únicos con su propio significado.

Esto nos lleva casi siempre a que en páginas normales nuestro contenido
será el único article/ de la página y en páginas con listados de
elementos tendremos un article/ por cada elmento del listado (que si
queremos identificar bien, tendrá un link con rel=bookmark hacia el
contenido real).

Para que la etiqueta article termine de entenderse comentar que idealmente
esta al ser un contenido con significado propio podría contener en su
interior etiquetas header/, section/, aside/ y footer/ ya que... al
ser contenido propio, ¿porque no pueden tener sus mismas carácteristicas?

Uso de aside/ en HTML5 orientado a SEO
Por ultimo nos queda la etiqueta aside que viene a ser una etiqueta
section/ venida a menos. Y es que aside sirve para indicar que ese bloque
es solo un añadido a los bloques que tiene al lado. Son datos extra sin lo
que podríamos pasar perfectamente pero que hemos decidido añadir en el
documento.

Así pues, un aside/ como hijo de la etiqueta body/ nos dice que se
trata de un contenido añadido por temas que no tienen nada que ver con el
contenido de página (normalmetne esas columnas laterales llenas de tags y
banners). Cuando lo incluimos dentro de un article/ nos indica que esa
información complementa el artículo pero no forma parte de él (listas de
datos, testimoniales, banners relacionados, etc...).

 Carlos.

El 27 de febrero de 2013 10:31, Marina Gallardo
marinagalla...@gmail.comescribió:

 Yo no sé cómo lo ven los demás, pero quizás el section tendría que estar
 dentro del article no?

 2013/2/27 Eva García evag...@gmail.com

  Buenos días a tos@s,
 
  Estoy empezando a usar HTML5 y me surge una duda. Tengo una Web donde
 tengo
  la cabecera con su menú, debajo tengo un slide dentro de un section y
  debajo quiero maquetar tres cajas que digamos son tres contenidos
  destacados. Lo típico de poner tres cajas en horizontal con su foto,
  título, breve texto y botón link para ampliar la información. La duda que
  me surge es si cada caja la tengo que poner dentro de una etiqueta
  section o si por el contrario tengo que crear una etiqueta section
 para
  aglutinar las tres cajas y después cada una de estas etiquetarla como
  article ¿Sería correcto esto?
 
  section
  article
  h3Títtulo/h3
  ...
  /article
 
  article
  h3Títtulo/h3
  ...
  /article
 
  article
  h3Títtulo/h3
  ...
  /article
  /section
 
  Seguidamente de esto tengo un listado de noticias y un listado de
 opiniones
  de clientes ¿tendría que utilizar la misma estructura?
 
  Gracias!!
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
  http://lists.ovillo.org/mailman/listinfo/ovillo
 
 

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Eva García
Esas tres cajas no tienen nada que ver con el contenido que viene después.
Son tres cajas donde en cada un título, descripción y link a una página
interna. Es un bloque independiente de los demás, así que por lo que me
comentais esas tres cajas irían dentro de un section. Y ahora la siguiente
duda ¿debería de marcar cada caja con la etiqueta article?

Gracias por el texto Carlos, ya lo había visto googleando ;-)



El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com escribió:

 Te paso un extracto que sigo como referencia:

 Uso de div/ en HTML5 orientado a SEO
 La etiqueta div no ha muerto, sigue ahí y sigue significando lo que siempre
 ha significado: conjunto de elementos. En ningún momento se ha transformado
 a una etiqueta tonta que puedas usar libremente para ayudarte con el CSS
 ni ha sido sustituida totalmente por la etiqueta section/.

 Por lo tanto nuestro deber es usarla como ayuda a la estructura de página:
 como base para crear el layout de de nuestras páginas, siempre y cuando no
 exista otra etiqueta de conjunto que represente mejor este papel... En
 otras palabras, div es la herramienta para unir elementos cuando no podemos
 asociar significado semántico a este conjunto.

 Uso de section/ en HTML5 orientado a SEO
 El uso de seción es muy parecido al de div pero aportando la carga de
 significado mínima posible al contenido. Englobando distintos elmentos
 dentro de una etiqueta section/ lo que estamos haciendo es declarar que
 todo su contenido está relacionado y forma parte de un mismo significado o
 elemento.

 La diferencia es sutil pero muy importante: cuando creamos bloques cuyo
 contenido forma un todo usaremos section/, cuando estos bloques responden
 más a diseño o a necesidades de estructura usaremos div/gt.

 Esta diferenciación también provoca que en todas estas maquetas que usan
 200 divs para conseguir que con pocos conociemientos de CSS el diseño tome
 forma no pasan a estar bien hechas, pero si que podemos decir que en html5
 estan menos mal (dado que al menos hemos marcado con sections los
 conjuntos que si que tienen significado sin liar tanto a los buscadores).

 Uso de article/ en HTML5 orientado a SEO
 Por último la etiqueta article/ es el siguiente paso a la hora de
 declarar que un cojunto de elmentos en nuestra página tiene significado. En
 este caso el paso dado es el dar a entender que ese conjunto tiene
 significado claro incluso si lo sacamos totalmente de la página. Es decir,
 al incluir algo dentro dentro de la etiqueta article/ lo que estamos
 diciéndole a los buscadores es que dentro de este article podrá encontrar
 contenidos únicos con su propio significado.

 Esto nos lleva casi siempre a que en páginas normales nuestro contenido
 será el único article/ de la página y en páginas con listados de
 elementos tendremos un article/ por cada elmento del listado (que si
 queremos identificar bien, tendrá un link con rel=bookmark hacia el
 contenido real).

 Para que la etiqueta article termine de entenderse comentar que idealmente
 esta al ser un contenido con significado propio podría contener en su
 interior etiquetas header/, section/, aside/ y footer/ ya que... al
 ser contenido propio, ¿porque no pueden tener sus mismas carácteristicas?

 Uso de aside/ en HTML5 orientado a SEO
 Por ultimo nos queda la etiqueta aside que viene a ser una etiqueta
 section/ venida a menos. Y es que aside sirve para indicar que ese bloque
 es solo un añadido a los bloques que tiene al lado. Son datos extra sin lo
 que podríamos pasar perfectamente pero que hemos decidido añadir en el
 documento.

 Así pues, un aside/ como hijo de la etiqueta body/ nos dice que se
 trata de un contenido añadido por temas que no tienen nada que ver con el
 contenido de página (normalmetne esas columnas laterales llenas de tags y
 banners). Cuando lo incluimos dentro de un article/ nos indica que esa
 información complementa el artículo pero no forma parte de él (listas de
 datos, testimoniales, banners relacionados, etc...).

  Carlos.

 El 27 de febrero de 2013 10:31, Marina Gallardo
 marinagalla...@gmail.comescribió:

  Yo no sé cómo lo ven los demás, pero quizás el section tendría que estar
  dentro del article no?
 
  2013/2/27 Eva García evag...@gmail.com
 
   Buenos días a tos@s,
  
   Estoy empezando a usar HTML5 y me surge una duda. Tengo una Web donde
  tengo
   la cabecera con su menú, debajo tengo un slide dentro de un section y
   debajo quiero maquetar tres cajas que digamos son tres contenidos
   destacados. Lo típico de poner tres cajas en horizontal con su foto,
   título, breve texto y botón link para ampliar la información. La duda
 que
   me surge es si cada caja la tengo que poner dentro de una etiqueta
   section o si por el contrario tengo que crear una etiqueta section
  para
   aglutinar las tres cajas y después cada una de estas etiquetarla como
   article ¿Sería correcto esto?
  
   section
   article
   h3Títtulo/h3
   ...
   /article
  
 

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Carlos Núñez
De nada, lo vi en su momento y me pareció interesante y lógico.

El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com escribió:

 Esas tres cajas no tienen nada que ver con el contenido que viene después.
 Son tres cajas donde en cada un título, descripción y link a una página
 interna. Es un bloque independiente de los demás, así que por lo que me
 comentais esas tres cajas irían dentro de un section. Y ahora la siguiente
 duda ¿debería de marcar cada caja con la etiqueta article?

 Gracias por el texto Carlos, ya lo había visto googleando ;-)



 El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com escribió:

  Te paso un extracto que sigo como referencia:
 
  Uso de div/ en HTML5 orientado a SEO
  La etiqueta div no ha muerto, sigue ahí y sigue significando lo que
 siempre
  ha significado: conjunto de elementos. En ningún momento se ha
 transformado
  a una etiqueta tonta que puedas usar libremente para ayudarte con el
 CSS
  ni ha sido sustituida totalmente por la etiqueta section/.
 
  Por lo tanto nuestro deber es usarla como ayuda a la estructura de
 página:
  como base para crear el layout de de nuestras páginas, siempre y cuando
 no
  exista otra etiqueta de conjunto que represente mejor este papel... En
  otras palabras, div es la herramienta para unir elementos cuando no
 podemos
  asociar significado semántico a este conjunto.
 
  Uso de section/ en HTML5 orientado a SEO
  El uso de seción es muy parecido al de div pero aportando la carga de
  significado mínima posible al contenido. Englobando distintos elmentos
  dentro de una etiqueta section/ lo que estamos haciendo es declarar que
  todo su contenido está relacionado y forma parte de un mismo significado
 o
  elemento.
 
  La diferencia es sutil pero muy importante: cuando creamos bloques cuyo
  contenido forma un todo usaremos section/, cuando estos bloques
 responden
  más a diseño o a necesidades de estructura usaremos div/gt.
 
  Esta diferenciación también provoca que en todas estas maquetas que usan
  200 divs para conseguir que con pocos conociemientos de CSS el diseño
 tome
  forma no pasan a estar bien hechas, pero si que podemos decir que en
 html5
  estan menos mal (dado que al menos hemos marcado con sections los
  conjuntos que si que tienen significado sin liar tanto a los buscadores).
 
  Uso de article/ en HTML5 orientado a SEO
  Por último la etiqueta article/ es el siguiente paso a la hora de
  declarar que un cojunto de elmentos en nuestra página tiene significado.
 En
  este caso el paso dado es el dar a entender que ese conjunto tiene
  significado claro incluso si lo sacamos totalmente de la página. Es
 decir,
  al incluir algo dentro dentro de la etiqueta article/ lo que estamos
  diciéndole a los buscadores es que dentro de este article podrá encontrar
  contenidos únicos con su propio significado.
 
  Esto nos lleva casi siempre a que en páginas normales nuestro contenido
  será el único article/ de la página y en páginas con listados de
  elementos tendremos un article/ por cada elmento del listado (que si
  queremos identificar bien, tendrá un link con rel=bookmark hacia el
  contenido real).
 
  Para que la etiqueta article termine de entenderse comentar que
 idealmente
  esta al ser un contenido con significado propio podría contener en su
  interior etiquetas header/, section/, aside/ y footer/ ya que...
 al
  ser contenido propio, ¿porque no pueden tener sus mismas carácteristicas?
 
  Uso de aside/ en HTML5 orientado a SEO
  Por ultimo nos queda la etiqueta aside que viene a ser una etiqueta
  section/ venida a menos. Y es que aside sirve para indicar que ese
 bloque
  es solo un añadido a los bloques que tiene al lado. Son datos extra sin
 lo
  que podríamos pasar perfectamente pero que hemos decidido añadir en el
  documento.
 
  Así pues, un aside/ como hijo de la etiqueta body/ nos dice que se
  trata de un contenido añadido por temas que no tienen nada que ver con el
  contenido de página (normalmetne esas columnas laterales llenas de tags y
  banners). Cuando lo incluimos dentro de un article/ nos indica que esa
  información complementa el artículo pero no forma parte de él (listas de
  datos, testimoniales, banners relacionados, etc...).
 
   Carlos.
 
  El 27 de febrero de 2013 10:31, Marina Gallardo
  marinagalla...@gmail.comescribió:
 
   Yo no sé cómo lo ven los demás, pero quizás el section tendría que
 estar
   dentro del article no?
  
   2013/2/27 Eva García evag...@gmail.com
  
Buenos días a tos@s,
   
Estoy empezando a usar HTML5 y me surge una duda. Tengo una Web donde
   tengo
la cabecera con su menú, debajo tengo un slide dentro de un
 section y
debajo quiero maquetar tres cajas que digamos son tres contenidos
destacados. Lo típico de poner tres cajas en horizontal con su foto,
título, breve texto y botón link para ampliar la información. La duda
  que
me surge es si cada caja la tengo que poner dentro de una etiqueta
section o si por el 

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Olivier Blázquez
Si no tienen nada que ver con el contenido que viene después, igual
deberías meterlas dentro de un aside, en vez de un section.

Yo entiendo el section como la sección de un periódico (Nacional, por
ejemplo), y dentro iría cada noticia dentro de un article. O como la
sección de una tienda y dentro de cada sección, un producto (article)
**
*
*



El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com escribió:

 Esas tres cajas .
 Son tres cajas donde en cada un título, descripción y link a una página
 interna. Es un bloque independiente de los demás, así que por lo que me
 comentais esas tres cajas irían dentro de un section. Y ahora la siguiente
 duda ¿debería de marcar cada caja con la etiqueta article?

 Gracias por el texto Carlos, ya lo había visto googleando ;-)



 El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com escribió:

  Te paso un extracto que sigo como referencia:
 
  Uso de div/ en HTML5 orientado a SEO
  La etiqueta div no ha muerto, sigue ahí y sigue significando lo que
 siempre
  ha significado: conjunto de elementos. En ningún momento se ha
 transformado
  a una etiqueta tonta que puedas usar libremente para ayudarte con el
 CSS
  ni ha sido sustituida totalmente por la etiqueta section/.
 
  Por lo tanto nuestro deber es usarla como ayuda a la estructura de
 página:
  como base para crear el layout de de nuestras páginas, siempre y cuando
 no
  exista otra etiqueta de conjunto que represente mejor este papel... En
  otras palabras, div es la herramienta para unir elementos cuando no
 podemos
  asociar significado semántico a este conjunto.
 
  Uso de section/ en HTML5 orientado a SEO
  El uso de seción es muy parecido al de div pero aportando la carga de
  significado mínima posible al contenido. Englobando distintos elmentos
  dentro de una etiqueta section/ lo que estamos haciendo es declarar que
  todo su contenido está relacionado y forma parte de un mismo significado
 o
  elemento.
 
  La diferencia es sutil pero muy importante: cuando creamos bloques cuyo
  contenido forma un todo usaremos section/, cuando estos bloques
 responden
  más a diseño o a necesidades de estructura usaremos div/gt.
 
  Esta diferenciación también provoca que en todas estas maquetas que usan
  200 divs para conseguir que con pocos conociemientos de CSS el diseño
 tome
  forma no pasan a estar bien hechas, pero si que podemos decir que en
 html5
  estan menos mal (dado que al menos hemos marcado con sections los
  conjuntos que si que tienen significado sin liar tanto a los buscadores).
 
  Uso de article/ en HTML5 orientado a SEO
  Por último la etiqueta article/ es el siguiente paso a la hora de
  declarar que un cojunto de elmentos en nuestra página tiene significado.
 En
  este caso el paso dado es el dar a entender que ese conjunto tiene
  significado claro incluso si lo sacamos totalmente de la página. Es
 decir,
  al incluir algo dentro dentro de la etiqueta article/ lo que estamos
  diciéndole a los buscadores es que dentro de este article podrá encontrar
  contenidos únicos con su propio significado.
 
  Esto nos lleva casi siempre a que en páginas normales nuestro contenido
  será el único article/ de la página y en páginas con listados de
  elementos tendremos un article/ por cada elmento del listado (que si
  queremos identificar bien, tendrá un link con rel=bookmark hacia el
  contenido real).
 
  Para que la etiqueta article termine de entenderse comentar que
 idealmente
  esta al ser un contenido con significado propio podría contener en su
  interior etiquetas header/, section/, aside/ y footer/ ya que...
 al
  ser contenido propio, ¿porque no pueden tener sus mismas carácteristicas?
 
  Uso de aside/ en HTML5 orientado a SEO
  Por ultimo nos queda la etiqueta aside que viene a ser una etiqueta
  section/ venida a menos. Y es que aside sirve para indicar que ese
 bloque
  es solo un añadido a los bloques que tiene al lado. Son datos extra sin
 lo
  que podríamos pasar perfectamente pero que hemos decidido añadir en el
  documento.
 
  Así pues, un aside/ como hijo de la etiqueta body/ nos dice que se
  trata de un contenido añadido por temas que no tienen nada que ver con el
  contenido de página (normalmetne esas columnas laterales llenas de tags y
  banners). Cuando lo incluimos dentro de un article/ nos indica que esa
  información complementa el artículo pero no forma parte de él (listas de
  datos, testimoniales, banners relacionados, etc...).
 
   Carlos.
 
  El 27 de febrero de 2013 10:31, Marina Gallardo
  marinagalla...@gmail.comescribió:
 
   Yo no sé cómo lo ven los demás, pero quizás el section tendría que
 estar
   dentro del article no?
  
   2013/2/27 Eva García evag...@gmail.com
  
Buenos días a tos@s,
   
Estoy empezando a usar HTML5 y me surge una duda. Tengo una Web donde
   tengo
la cabecera con su menú, debajo tengo un slide dentro de un
 section y
debajo quiero maquetar tres cajas que digamos son tres contenidos
destacados. Lo 

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Eva García
Para que veis más clara la estructura de la Web os comento que es una
tienda online, donde debajo del slide hay tres cajas que son tres enlaces a
tres categorías de productos. Cada caja lleva una imagen, el título de la
categoría, una breve descripción de la categoría y un link a esa categoría.
Debajo van las noticias y debajo opiniones de clientes. La duda que
planteaba es como maquetar esas cajas con enlaces a las categorías
principales. Por lo que he leido entiendo que todo iría dentro de un único
section y no se si cada caja etiquetarla con un article o un div

Que lío esto del HTML5!!!

Gracias de nuevo!


El 27 de febrero de 2013 10:57, Olivier Blázquez obe...@gmail.comescribió:

 Si no tienen nada que ver con el contenido que viene después, igual
 deberías meterlas dentro de un aside, en vez de un section.

 Yo entiendo el section como la sección de un periódico (Nacional, por
 ejemplo), y dentro iría cada noticia dentro de un article. O como la
 sección de una tienda y dentro de cada sección, un producto (article)
 **
 *
 *



 El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com escribió:

  Esas tres cajas .
  Son tres cajas donde en cada un título, descripción y link a una página
  interna. Es un bloque independiente de los demás, así que por lo que me
  comentais esas tres cajas irían dentro de un section. Y ahora la
 siguiente
  duda ¿debería de marcar cada caja con la etiqueta article?
 
  Gracias por el texto Carlos, ya lo había visto googleando ;-)
 
 
 
  El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com
 escribió:
 
   Te paso un extracto que sigo como referencia:
  
   Uso de div/ en HTML5 orientado a SEO
   La etiqueta div no ha muerto, sigue ahí y sigue significando lo que
  siempre
   ha significado: conjunto de elementos. En ningún momento se ha
  transformado
   a una etiqueta tonta que puedas usar libremente para ayudarte con el
  CSS
   ni ha sido sustituida totalmente por la etiqueta section/.
  
   Por lo tanto nuestro deber es usarla como ayuda a la estructura de
  página:
   como base para crear el layout de de nuestras páginas, siempre y cuando
  no
   exista otra etiqueta de conjunto que represente mejor este papel... En
   otras palabras, div es la herramienta para unir elementos cuando no
  podemos
   asociar significado semántico a este conjunto.
  
   Uso de section/ en HTML5 orientado a SEO
   El uso de seción es muy parecido al de div pero aportando la carga de
   significado mínima posible al contenido. Englobando distintos elmentos
   dentro de una etiqueta section/ lo que estamos haciendo es declarar
 que
   todo su contenido está relacionado y forma parte de un mismo
 significado
  o
   elemento.
  
   La diferencia es sutil pero muy importante: cuando creamos bloques cuyo
   contenido forma un todo usaremos section/, cuando estos bloques
  responden
   más a diseño o a necesidades de estructura usaremos div/gt.
  
   Esta diferenciación también provoca que en todas estas maquetas que
 usan
   200 divs para conseguir que con pocos conociemientos de CSS el diseño
  tome
   forma no pasan a estar bien hechas, pero si que podemos decir que en
  html5
   estan menos mal (dado que al menos hemos marcado con sections los
   conjuntos que si que tienen significado sin liar tanto a los
 buscadores).
  
   Uso de article/ en HTML5 orientado a SEO
   Por último la etiqueta article/ es el siguiente paso a la hora de
   declarar que un cojunto de elmentos en nuestra página tiene
 significado.
  En
   este caso el paso dado es el dar a entender que ese conjunto tiene
   significado claro incluso si lo sacamos totalmente de la página. Es
  decir,
   al incluir algo dentro dentro de la etiqueta article/ lo que estamos
   diciéndole a los buscadores es que dentro de este article podrá
 encontrar
   contenidos únicos con su propio significado.
  
   Esto nos lleva casi siempre a que en páginas normales nuestro contenido
   será el único article/ de la página y en páginas con listados de
   elementos tendremos un article/ por cada elmento del listado (que si
   queremos identificar bien, tendrá un link con rel=bookmark hacia el
   contenido real).
  
   Para que la etiqueta article termine de entenderse comentar que
  idealmente
   esta al ser un contenido con significado propio podría contener en su
   interior etiquetas header/, section/, aside/ y footer/ ya
 que...
  al
   ser contenido propio, ¿porque no pueden tener sus mismas
 carácteristicas?
  
   Uso de aside/ en HTML5 orientado a SEO
   Por ultimo nos queda la etiqueta aside que viene a ser una etiqueta
   section/ venida a menos. Y es que aside sirve para indicar que ese
  bloque
   es solo un añadido a los bloques que tiene al lado. Son datos extra sin
  lo
   que podríamos pasar perfectamente pero que hemos decidido añadir en el
   documento.
  
   Así pues, un aside/ como hijo de la etiqueta body/ nos dice que se
   trata de un contenido añadido por temas que no tienen nada que ver con
 el
   

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema marcos méndez filesi
a) Como comenta Olivier, depende de su función en el conjunto de la web. Si
contienen enlaces a cosas sin importancia, que de no estar no pasaría nada,
irían en un aside genérico (donde tienes el section) y lo demás con divs.

b) Si son un elemento fundamental de la navegación, lo mismo, pero con un
nav en vez de un aside.

c) Si son piezas de información, cada una independiente, es decir, con
entidad por sí misma, entonces el global sería el section y los de dentro
el article (como los tienes).

El ejemplo de Olivier del periódico está bien pensado. Por poner otros
casos:

1) En una página con un chat complementario (como algunos foros), el chat
iría en un section.

2) En una página comercial, cada artículo sería un article, el catálogo un
section y si hubiera un apartado con el boletín de la tienda, ese sería
otro section.

3) En un foro, cada thread sería un section y cada post un article.




El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com escribió:

 Esas tres cajas no tienen nada que ver con el contenido que viene después.
 Son tres cajas donde en cada un título, descripción y link a una página
 interna. Es un bloque independiente de los demás, así que por lo que me
 comentais esas tres cajas irían dentro de un section. Y ahora la siguiente
 duda ¿debería de marcar cada caja con la etiqueta article?

 Gracias por el texto Carlos, ya lo había visto googleando ;-)



 El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com escribió:

  Te paso un extracto que sigo como referencia:
 
  Uso de div/ en HTML5 orientado a SEO
  La etiqueta div no ha muerto, sigue ahí y sigue significando lo que
 siempre
  ha significado: conjunto de elementos. En ningún momento se ha
 transformado
  a una etiqueta tonta que puedas usar libremente para ayudarte con el
 CSS
  ni ha sido sustituida totalmente por la etiqueta section/.
 
  Por lo tanto nuestro deber es usarla como ayuda a la estructura de
 página:
  como base para crear el layout de de nuestras páginas, siempre y cuando
 no
  exista otra etiqueta de conjunto que represente mejor este papel... En
  otras palabras, div es la herramienta para unir elementos cuando no
 podemos
  asociar significado semántico a este conjunto.
 
  Uso de section/ en HTML5 orientado a SEO
  El uso de seción es muy parecido al de div pero aportando la carga de
  significado mínima posible al contenido. Englobando distintos elmentos
  dentro de una etiqueta section/ lo que estamos haciendo es declarar que
  todo su contenido está relacionado y forma parte de un mismo significado
 o
  elemento.
 
  La diferencia es sutil pero muy importante: cuando creamos bloques cuyo
  contenido forma un todo usaremos section/, cuando estos bloques
 responden
  más a diseño o a necesidades de estructura usaremos div/gt.
 
  Esta diferenciación también provoca que en todas estas maquetas que usan
  200 divs para conseguir que con pocos conociemientos de CSS el diseño
 tome
  forma no pasan a estar bien hechas, pero si que podemos decir que en
 html5
  estan menos mal (dado que al menos hemos marcado con sections los
  conjuntos que si que tienen significado sin liar tanto a los buscadores).
 
  Uso de article/ en HTML5 orientado a SEO
  Por último la etiqueta article/ es el siguiente paso a la hora de
  declarar que un cojunto de elmentos en nuestra página tiene significado.
 En
  este caso el paso dado es el dar a entender que ese conjunto tiene
  significado claro incluso si lo sacamos totalmente de la página. Es
 decir,
  al incluir algo dentro dentro de la etiqueta article/ lo que estamos
  diciéndole a los buscadores es que dentro de este article podrá encontrar
  contenidos únicos con su propio significado.
 
  Esto nos lleva casi siempre a que en páginas normales nuestro contenido
  será el único article/ de la página y en páginas con listados de
  elementos tendremos un article/ por cada elmento del listado (que si
  queremos identificar bien, tendrá un link con rel=bookmark hacia el
  contenido real).
 
  Para que la etiqueta article termine de entenderse comentar que
 idealmente
  esta al ser un contenido con significado propio podría contener en su
  interior etiquetas header/, section/, aside/ y footer/ ya que...
 al
  ser contenido propio, ¿porque no pueden tener sus mismas carácteristicas?
 
  Uso de aside/ en HTML5 orientado a SEO
  Por ultimo nos queda la etiqueta aside que viene a ser una etiqueta
  section/ venida a menos. Y es que aside sirve para indicar que ese
 bloque
  es solo un añadido a los bloques que tiene al lado. Son datos extra sin
 lo
  que podríamos pasar perfectamente pero que hemos decidido añadir en el
  documento.
 
  Así pues, un aside/ como hijo de la etiqueta body/ nos dice que se
  trata de un contenido añadido por temas que no tienen nada que ver con el
  contenido de página (normalmetne esas columnas laterales llenas de tags y
  banners). Cuando lo incluimos dentro de un article/ nos indica que esa
  información complementa el artículo pero 

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema marcos méndez filesi
entonces yo haría un nav + 3divs.

y no te olvides de añadir esto pá que funcionen los tags con la tostadora:

!-- Script Media Queries y semánticos para el Explorer--
!--[if lte IE 8]
script src=//html5shiv.googlecode.com/svn/trunk/html5.js/script
script src=//
css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js
/script
![endif]--

`+ en los estilos:


article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
display: block;
}


+ info, que me acabo de acordar que escribí sobre eso

http://www.mmfilesi.com/blog/las-etiquetas-semanticas-de-html5/




El 27 de febrero de 2013 11:03, Eva García evag...@gmail.com escribió:

 Para que veis más clara la estructura de la Web os comento que es una
 tienda online, donde debajo del slide hay tres cajas que son tres enlaces a
 tres categorías de productos. Cada caja lleva una imagen, el título de la
 categoría, una breve descripción de la categoría y un link a esa categoría.
 Debajo van las noticias y debajo opiniones de clientes. La duda que
 planteaba es como maquetar esas cajas con enlaces a las categorías
 principales. Por lo que he leido entiendo que todo iría dentro de un único
 section y no se si cada caja etiquetarla con un article o un div

 Que lío esto del HTML5!!!

 Gracias de nuevo!


 El 27 de febrero de 2013 10:57, Olivier Blázquez obe...@gmail.com
 escribió:

  Si no tienen nada que ver con el contenido que viene después, igual
  deberías meterlas dentro de un aside, en vez de un section.
 
  Yo entiendo el section como la sección de un periódico (Nacional, por
  ejemplo), y dentro iría cada noticia dentro de un article. O como la
  sección de una tienda y dentro de cada sección, un producto (article)
  **
  *
  *
 
 
 
  El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com escribió:
 
   Esas tres cajas .
   Son tres cajas donde en cada un título, descripción y link a una página
   interna. Es un bloque independiente de los demás, así que por lo que me
   comentais esas tres cajas irían dentro de un section. Y ahora la
  siguiente
   duda ¿debería de marcar cada caja con la etiqueta article?
  
   Gracias por el texto Carlos, ya lo había visto googleando ;-)
  
  
  
   El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com
  escribió:
  
Te paso un extracto que sigo como referencia:
   
Uso de div/ en HTML5 orientado a SEO
La etiqueta div no ha muerto, sigue ahí y sigue significando lo que
   siempre
ha significado: conjunto de elementos. En ningún momento se ha
   transformado
a una etiqueta tonta que puedas usar libremente para ayudarte con
 el
   CSS
ni ha sido sustituida totalmente por la etiqueta section/.
   
Por lo tanto nuestro deber es usarla como ayuda a la estructura de
   página:
como base para crear el layout de de nuestras páginas, siempre y
 cuando
   no
exista otra etiqueta de conjunto que represente mejor este papel...
 En
otras palabras, div es la herramienta para unir elementos cuando no
   podemos
asociar significado semántico a este conjunto.
   
Uso de section/ en HTML5 orientado a SEO
El uso de seción es muy parecido al de div pero aportando la carga de
significado mínima posible al contenido. Englobando distintos
 elmentos
dentro de una etiqueta section/ lo que estamos haciendo es declarar
  que
todo su contenido está relacionado y forma parte de un mismo
  significado
   o
elemento.
   
La diferencia es sutil pero muy importante: cuando creamos bloques
 cuyo
contenido forma un todo usaremos section/, cuando estos bloques
   responden
más a diseño o a necesidades de estructura usaremos div/gt.
   
Esta diferenciación también provoca que en todas estas maquetas que
  usan
200 divs para conseguir que con pocos conociemientos de CSS el diseño
   tome
forma no pasan a estar bien hechas, pero si que podemos decir que en
   html5
estan menos mal (dado que al menos hemos marcado con sections los
conjuntos que si que tienen significado sin liar tanto a los
  buscadores).
   
Uso de article/ en HTML5 orientado a SEO
Por último la etiqueta article/ es el siguiente paso a la hora de
declarar que un cojunto de elmentos en nuestra página tiene
  significado.
   En
este caso el paso dado es el dar a entender que ese conjunto tiene
significado claro incluso si lo sacamos totalmente de la página. Es
   decir,
al incluir algo dentro dentro de la etiqueta article/ lo que
 estamos
diciéndole a los buscadores es que dentro de este article podrá
  encontrar
contenidos únicos con su propio significado.
   
Esto nos lleva casi siempre a que en páginas normales nuestro
 contenido
será el único article/ de la página y en páginas con listados de
elementos tendremos un article/ por cada elmento del listado (que
 si
queremos identificar bien, tendrá un link con rel=bookmark hacia el
contenido real).
   
Para que la etiqueta 

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Eva García
Hola Marcos,

Gracias por la ayuda. Ya he metido por el código que me indicas. Sobre lo
del nav que me comentas me surge una duda. Ya tengo un nav con el menú
principal ¿puedo tener más de un nav en el código?

Gracias de nuevo!



El 27 de febrero de 2013 11:12, marcos méndez filesi
mmfil...@gmail.comescribió:

 entonces yo haría un nav + 3divs.

 y no te olvides de añadir esto pá que funcionen los tags con la tostadora:

 !-- Script Media Queries y semánticos para el Explorer--
 !--[if lte IE 8]
 script src=//html5shiv.googlecode.com/svn/trunk/html5.js/script
 script src=//
 css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js
 /script
 ![endif]--

 `+ en los estilos:


 article,
 aside,
 details,
 figcaption,
 figure,
 footer,
 header,
 hgroup,
 nav,
 section,
 summary {
 display: block;
 }


 + info, que me acabo de acordar que escribí sobre eso

 http://www.mmfilesi.com/blog/las-etiquetas-semanticas-de-html5/




 El 27 de febrero de 2013 11:03, Eva García evag...@gmail.com escribió:

  Para que veis más clara la estructura de la Web os comento que es una
  tienda online, donde debajo del slide hay tres cajas que son tres
 enlaces a
  tres categorías de productos. Cada caja lleva una imagen, el título de la
  categoría, una breve descripción de la categoría y un link a esa
 categoría.
  Debajo van las noticias y debajo opiniones de clientes. La duda que
  planteaba es como maquetar esas cajas con enlaces a las categorías
  principales. Por lo que he leido entiendo que todo iría dentro de un
 único
  section y no se si cada caja etiquetarla con un article o un div
 
  Que lío esto del HTML5!!!
 
  Gracias de nuevo!
 
 
  El 27 de febrero de 2013 10:57, Olivier Blázquez obe...@gmail.com
  escribió:
 
   Si no tienen nada que ver con el contenido que viene después, igual
   deberías meterlas dentro de un aside, en vez de un section.
  
   Yo entiendo el section como la sección de un periódico (Nacional, por
   ejemplo), y dentro iría cada noticia dentro de un article. O como la
   sección de una tienda y dentro de cada sección, un producto (article)
   **
   *
   *
  
  
  
   El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com
 escribió:
  
Esas tres cajas .
Son tres cajas donde en cada un título, descripción y link a una
 página
interna. Es un bloque independiente de los demás, así que por lo que
 me
comentais esas tres cajas irían dentro de un section. Y ahora la
   siguiente
duda ¿debería de marcar cada caja con la etiqueta article?
   
Gracias por el texto Carlos, ya lo había visto googleando ;-)
   
   
   
El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com
   escribió:
   
 Te paso un extracto que sigo como referencia:

 Uso de div/ en HTML5 orientado a SEO
 La etiqueta div no ha muerto, sigue ahí y sigue significando lo que
siempre
 ha significado: conjunto de elementos. En ningún momento se ha
transformado
 a una etiqueta tonta que puedas usar libremente para ayudarte con
  el
CSS
 ni ha sido sustituida totalmente por la etiqueta section/.

 Por lo tanto nuestro deber es usarla como ayuda a la estructura de
página:
 como base para crear el layout de de nuestras páginas, siempre y
  cuando
no
 exista otra etiqueta de conjunto que represente mejor este papel...
  En
 otras palabras, div es la herramienta para unir elementos cuando no
podemos
 asociar significado semántico a este conjunto.

 Uso de section/ en HTML5 orientado a SEO
 El uso de seción es muy parecido al de div pero aportando la carga
 de
 significado mínima posible al contenido. Englobando distintos
  elmentos
 dentro de una etiqueta section/ lo que estamos haciendo es
 declarar
   que
 todo su contenido está relacionado y forma parte de un mismo
   significado
o
 elemento.

 La diferencia es sutil pero muy importante: cuando creamos bloques
  cuyo
 contenido forma un todo usaremos section/, cuando estos bloques
responden
 más a diseño o a necesidades de estructura usaremos div/gt.

 Esta diferenciación también provoca que en todas estas maquetas que
   usan
 200 divs para conseguir que con pocos conociemientos de CSS el
 diseño
tome
 forma no pasan a estar bien hechas, pero si que podemos decir que
 en
html5
 estan menos mal (dado que al menos hemos marcado con sections los
 conjuntos que si que tienen significado sin liar tanto a los
   buscadores).

 Uso de article/ en HTML5 orientado a SEO
 Por último la etiqueta article/ es el siguiente paso a la hora de
 declarar que un cojunto de elmentos en nuestra página tiene
   significado.
En
 este caso el paso dado es el dar a entender que ese conjunto tiene
 significado claro incluso si lo sacamos totalmente de la página. Es
decir,
 al incluir algo dentro dentro de la etiqueta article/ lo que
  estamos
 diciéndole a los 

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Edgardo Raúl Galletto
Claro que puedes tener mas de un nav. Para eso están diseñados. Con un id 
puedes individualizar el main_nav y y con otro un second_nav. Es muy típico 
esto.
Edgardo Raúl Galletto
www.webmoderna.com.ar 
i...@webmoderna.com.ar 
0351-153272337
Enviado desde mi MiMente® con mi poder de Ciberpatia.

-Original Message-
From: Eva García evag...@gmail.com
Sender: ovillo-boun...@lists.ovillo.org
Date: Wed, 27 Feb 2013 12:53:17 
To: Ovillo, la lista de CSS en castellanoovillo@lists.ovillo.org
Reply-To: Ovillo, la lista de CSS en castellano ovillo@lists.ovillo.org
Subject: Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

Hola Marcos,

Gracias por la ayuda. Ya he metido por el código que me indicas. Sobre lo
del nav que me comentas me surge una duda. Ya tengo un nav con el menú
principal ¿puedo tener más de un nav en el código?

Gracias de nuevo!



El 27 de febrero de 2013 11:12, marcos méndez filesi
mmfil...@gmail.comescribió:

 entonces yo haría un nav + 3divs.

 y no te olvides de añadir esto pá que funcionen los tags con la tostadora:

 !-- Script Media Queries y semánticos para el Explorer--
 !--[if lte IE 8]
 script src=//html5shiv.googlecode.com/svn/trunk/html5.js/script
 script src=//
 css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js
 /script
 ![endif]--

 `+ en los estilos:


 article,
 aside,
 details,
 figcaption,
 figure,
 footer,
 header,
 hgroup,
 nav,
 section,
 summary {
 display: block;
 }


 + info, que me acabo de acordar que escribí sobre eso

 http://www.mmfilesi.com/blog/las-etiquetas-semanticas-de-html5/




 El 27 de febrero de 2013 11:03, Eva García evag...@gmail.com escribió:

  Para que veis más clara la estructura de la Web os comento que es una
  tienda online, donde debajo del slide hay tres cajas que son tres
 enlaces a
  tres categorías de productos. Cada caja lleva una imagen, el título de la
  categoría, una breve descripción de la categoría y un link a esa
 categoría.
  Debajo van las noticias y debajo opiniones de clientes. La duda que
  planteaba es como maquetar esas cajas con enlaces a las categorías
  principales. Por lo que he leido entiendo que todo iría dentro de un
 único
  section y no se si cada caja etiquetarla con un article o un div
 
  Que lío esto del HTML5!!!
 
  Gracias de nuevo!
 
 
  El 27 de febrero de 2013 10:57, Olivier Blázquez obe...@gmail.com
  escribió:
 
   Si no tienen nada que ver con el contenido que viene después, igual
   deberías meterlas dentro de un aside, en vez de un section.
  
   Yo entiendo el section como la sección de un periódico (Nacional, por
   ejemplo), y dentro iría cada noticia dentro de un article. O como la
   sección de una tienda y dentro de cada sección, un producto (article)
   **
   *
   *
  
  
  
   El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com
 escribió:
  
Esas tres cajas .
Son tres cajas donde en cada un título, descripción y link a una
 página
interna. Es un bloque independiente de los demás, así que por lo que
 me
comentais esas tres cajas irían dentro de un section. Y ahora la
   siguiente
duda ¿debería de marcar cada caja con la etiqueta article?
   
Gracias por el texto Carlos, ya lo había visto googleando ;-)
   
   
   
El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com
   escribió:
   
 Te paso un extracto que sigo como referencia:

 Uso de div/ en HTML5 orientado a SEO
 La etiqueta div no ha muerto, sigue ahí y sigue significando lo que
siempre
 ha significado: conjunto de elementos. En ningún momento se ha
transformado
 a una etiqueta tonta que puedas usar libremente para ayudarte con
  el
CSS
 ni ha sido sustituida totalmente por la etiqueta section/.

 Por lo tanto nuestro deber es usarla como ayuda a la estructura de
página:
 como base para crear el layout de de nuestras páginas, siempre y
  cuando
no
 exista otra etiqueta de conjunto que represente mejor este papel...
  En
 otras palabras, div es la herramienta para unir elementos cuando no
podemos
 asociar significado semántico a este conjunto.

 Uso de section/ en HTML5 orientado a SEO
 El uso de seción es muy parecido al de div pero aportando la carga
 de
 significado mínima posible al contenido. Englobando distintos
  elmentos
 dentro de una etiqueta section/ lo que estamos haciendo es
 declarar
   que
 todo su contenido está relacionado y forma parte de un mismo
   significado
o
 elemento.

 La diferencia es sutil pero muy importante: cuando creamos bloques
  cuyo
 contenido forma un todo usaremos section/, cuando estos bloques
responden
 más a diseño o a necesidades de estructura usaremos div/gt.

 Esta diferenciación también provoca que en todas estas maquetas que
   usan
 200 divs para conseguir que con pocos conociemientos de CSS el
 diseño
tome
 forma no pasan a estar bien hechas, pero si que podemos decir que
 en

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema marcos méndez filesi
Sí, al menos deberían ir en navs:

a) La(s) barra(s) de navegación

b) Formulario buscar

c) Las breadcrumbs...

en fin, cualquier elemento importante de navegación de la arquitectura
interactiva de un sitio. No un enlace suelto aquí o allá, sino los cuadros
de mano...


El 27 de febrero de 2013 12:53, Eva García evag...@gmail.com escribió:

 Hola Marcos,

 Gracias por la ayuda. Ya he metido por el código que me indicas. Sobre lo
 del nav que me comentas me surge una duda. Ya tengo un nav con el menú
 principal ¿puedo tener más de un nav en el código?

 Gracias de nuevo!



 El 27 de febrero de 2013 11:12, marcos méndez filesi
 mmfil...@gmail.comescribió:

  entonces yo haría un nav + 3divs.
 
  y no te olvides de añadir esto pá que funcionen los tags con la
 tostadora:
 
  !-- Script Media Queries y semánticos para el Explorer--
  !--[if lte IE 8]
  script src=//html5shiv.googlecode.com/svn/trunk/html5.js/script
  script src=//
  css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js
  /script
  ![endif]--
 
  `+ en los estilos:
 
 
  article,
  aside,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  nav,
  section,
  summary {
  display: block;
  }
 
 
  + info, que me acabo de acordar que escribí sobre eso
 
  http://www.mmfilesi.com/blog/las-etiquetas-semanticas-de-html5/
 
 
 
 
  El 27 de febrero de 2013 11:03, Eva García evag...@gmail.com escribió:
 
   Para que veis más clara la estructura de la Web os comento que es una
   tienda online, donde debajo del slide hay tres cajas que son tres
  enlaces a
   tres categorías de productos. Cada caja lleva una imagen, el título de
 la
   categoría, una breve descripción de la categoría y un link a esa
  categoría.
   Debajo van las noticias y debajo opiniones de clientes. La duda que
   planteaba es como maquetar esas cajas con enlaces a las categorías
   principales. Por lo que he leido entiendo que todo iría dentro de un
  único
   section y no se si cada caja etiquetarla con un article o un div
  
   Que lío esto del HTML5!!!
  
   Gracias de nuevo!
  
  
   El 27 de febrero de 2013 10:57, Olivier Blázquez obe...@gmail.com
   escribió:
  
Si no tienen nada que ver con el contenido que viene después, igual
deberías meterlas dentro de un aside, en vez de un section.
   
Yo entiendo el section como la sección de un periódico (Nacional,
 por
ejemplo), y dentro iría cada noticia dentro de un article. O como
 la
sección de una tienda y dentro de cada sección, un producto
 (article)
**
*
*
   
   
   
El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com
  escribió:
   
 Esas tres cajas .
 Son tres cajas donde en cada un título, descripción y link a una
  página
 interna. Es un bloque independiente de los demás, así que por lo
 que
  me
 comentais esas tres cajas irían dentro de un section. Y ahora la
siguiente
 duda ¿debería de marcar cada caja con la etiqueta article?

 Gracias por el texto Carlos, ya lo había visto googleando ;-)



 El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com
escribió:

  Te paso un extracto que sigo como referencia:
 
  Uso de div/ en HTML5 orientado a SEO
  La etiqueta div no ha muerto, sigue ahí y sigue significando lo
 que
 siempre
  ha significado: conjunto de elementos. En ningún momento se ha
 transformado
  a una etiqueta tonta que puedas usar libremente para ayudarte
 con
   el
 CSS
  ni ha sido sustituida totalmente por la etiqueta section/.
 
  Por lo tanto nuestro deber es usarla como ayuda a la estructura
 de
 página:
  como base para crear el layout de de nuestras páginas, siempre y
   cuando
 no
  exista otra etiqueta de conjunto que represente mejor este
 papel...
   En
  otras palabras, div es la herramienta para unir elementos cuando
 no
 podemos
  asociar significado semántico a este conjunto.
 
  Uso de section/ en HTML5 orientado a SEO
  El uso de seción es muy parecido al de div pero aportando la
 carga
  de
  significado mínima posible al contenido. Englobando distintos
   elmentos
  dentro de una etiqueta section/ lo que estamos haciendo es
  declarar
que
  todo su contenido está relacionado y forma parte de un mismo
significado
 o
  elemento.
 
  La diferencia es sutil pero muy importante: cuando creamos
 bloques
   cuyo
  contenido forma un todo usaremos section/, cuando estos bloques
 responden
  más a diseño o a necesidades de estructura usaremos div/gt.
 
  Esta diferenciación también provoca que en todas estas maquetas
 que
usan
  200 divs para conseguir que con pocos conociemientos de CSS el
  diseño
 tome
  forma no pasan a estar bien hechas, pero si que podemos decir que
  en
 html5
  estan menos mal (dado que al menos hemos marcado con sections
 los
  conjuntos que si que tienen 

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Edgardo Raúl Galletto
Totalmente de acuerdo con Marquitos Mendez! Saludos campeón!
Edgardo Raúl Galletto
www.webmoderna.com.ar 
i...@webmoderna.com.ar 
0351-153272337
Enviado desde mi MiMente® con mi poder de Ciberpatia.

-Original Message-
From: marcos méndez filesi mmfil...@gmail.com
Sender: ovillo-boun...@lists.ovillo.org
Date: Wed, 27 Feb 2013 13:01:03 
To: Ovillo, la lista de CSS en castellanoovillo@lists.ovillo.org
Reply-To: Ovillo, la lista de CSS en castellano ovillo@lists.ovillo.org
Subject: Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

Sí, al menos deberían ir en navs:

a) La(s) barra(s) de navegación

b) Formulario buscar

c) Las breadcrumbs...

en fin, cualquier elemento importante de navegación de la arquitectura
interactiva de un sitio. No un enlace suelto aquí o allá, sino los cuadros
de mano...


El 27 de febrero de 2013 12:53, Eva García evag...@gmail.com escribió:

 Hola Marcos,

 Gracias por la ayuda. Ya he metido por el código que me indicas. Sobre lo
 del nav que me comentas me surge una duda. Ya tengo un nav con el menú
 principal ¿puedo tener más de un nav en el código?

 Gracias de nuevo!



 El 27 de febrero de 2013 11:12, marcos méndez filesi
 mmfil...@gmail.comescribió:

  entonces yo haría un nav + 3divs.
 
  y no te olvides de añadir esto pá que funcionen los tags con la
 tostadora:
 
  !-- Script Media Queries y semánticos para el Explorer--
  !--[if lte IE 8]
  script src=//html5shiv.googlecode.com/svn/trunk/html5.js/script
  script src=//
  css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js
  /script
  ![endif]--
 
  `+ en los estilos:
 
 
  article,
  aside,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  nav,
  section,
  summary {
  display: block;
  }
 
 
  + info, que me acabo de acordar que escribí sobre eso
 
  http://www.mmfilesi.com/blog/las-etiquetas-semanticas-de-html5/
 
 
 
 
  El 27 de febrero de 2013 11:03, Eva García evag...@gmail.com escribió:
 
   Para que veis más clara la estructura de la Web os comento que es una
   tienda online, donde debajo del slide hay tres cajas que son tres
  enlaces a
   tres categorías de productos. Cada caja lleva una imagen, el título de
 la
   categoría, una breve descripción de la categoría y un link a esa
  categoría.
   Debajo van las noticias y debajo opiniones de clientes. La duda que
   planteaba es como maquetar esas cajas con enlaces a las categorías
   principales. Por lo que he leido entiendo que todo iría dentro de un
  único
   section y no se si cada caja etiquetarla con un article o un div
  
   Que lío esto del HTML5!!!
  
   Gracias de nuevo!
  
  
   El 27 de febrero de 2013 10:57, Olivier Blázquez obe...@gmail.com
   escribió:
  
Si no tienen nada que ver con el contenido que viene después, igual
deberías meterlas dentro de un aside, en vez de un section.
   
Yo entiendo el section como la sección de un periódico (Nacional,
 por
ejemplo), y dentro iría cada noticia dentro de un article. O como
 la
sección de una tienda y dentro de cada sección, un producto
 (article)
**
*
*
   
   
   
El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com
  escribió:
   
 Esas tres cajas .
 Son tres cajas donde en cada un título, descripción y link a una
  página
 interna. Es un bloque independiente de los demás, así que por lo
 que
  me
 comentais esas tres cajas irían dentro de un section. Y ahora la
siguiente
 duda ¿debería de marcar cada caja con la etiqueta article?

 Gracias por el texto Carlos, ya lo había visto googleando ;-)



 El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com
escribió:

  Te paso un extracto que sigo como referencia:
 
  Uso de div/ en HTML5 orientado a SEO
  La etiqueta div no ha muerto, sigue ahí y sigue significando lo
 que
 siempre
  ha significado: conjunto de elementos. En ningún momento se ha
 transformado
  a una etiqueta tonta que puedas usar libremente para ayudarte
 con
   el
 CSS
  ni ha sido sustituida totalmente por la etiqueta section/.
 
  Por lo tanto nuestro deber es usarla como ayuda a la estructura
 de
 página:
  como base para crear el layout de de nuestras páginas, siempre y
   cuando
 no
  exista otra etiqueta de conjunto que represente mejor este
 papel...
   En
  otras palabras, div es la herramienta para unir elementos cuando
 no
 podemos
  asociar significado semántico a este conjunto.
 
  Uso de section/ en HTML5 orientado a SEO
  El uso de seción es muy parecido al de div pero aportando la
 carga
  de
  significado mínima posible al contenido. Englobando distintos
   elmentos
  dentro de una etiqueta section/ lo que estamos haciendo es
  declarar
que
  todo su contenido está relacionado y forma parte de un mismo
significado
 o
  elemento.
 
  La diferencia es sutil pero muy importante: cuando creamos
 

Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

2013-02-27 Por tema Marina Gallardo
Y el formulario de buscar por qué consideráis que debe ir en nav?

2013/2/27 Edgardo Raúl Galletto edgardogalle...@gmail.com

 Totalmente de acuerdo con Marquitos Mendez! Saludos campeón!
 Edgardo Raúl Galletto
 www.webmoderna.com.ar
 i...@webmoderna.com.ar
 0351-153272337
 Enviado desde mi MiMente® con mi poder de Ciberpatia.

 -Original Message-
 From: marcos méndez filesi mmfil...@gmail.com
 Sender: ovillo-boun...@lists.ovillo.org
 Date: Wed, 27 Feb 2013 13:01:03
 To: Ovillo, la lista de CSS en castellanoovillo@lists.ovillo.org
 Reply-To: Ovillo, la lista de CSS en castellano ovillo@lists.ovillo.org
 
 Subject: Re: [Ovillo] Duda sobre etiquetado correcto en HTML5

 Sí, al menos deberían ir en navs:

 a) La(s) barra(s) de navegación

 b) Formulario buscar

 c) Las breadcrumbs...

 en fin, cualquier elemento importante de navegación de la arquitectura
 interactiva de un sitio. No un enlace suelto aquí o allá, sino los cuadros
 de mano...


 El 27 de febrero de 2013 12:53, Eva García evag...@gmail.com escribió:

  Hola Marcos,
 
  Gracias por la ayuda. Ya he metido por el código que me indicas. Sobre lo
  del nav que me comentas me surge una duda. Ya tengo un nav con el menú
  principal ¿puedo tener más de un nav en el código?
 
  Gracias de nuevo!
 
 
 
  El 27 de febrero de 2013 11:12, marcos méndez filesi
  mmfil...@gmail.comescribió:
 
   entonces yo haría un nav + 3divs.
  
   y no te olvides de añadir esto pá que funcionen los tags con la
  tostadora:
  
   !-- Script Media Queries y semánticos para el Explorer--
   !--[if lte IE 8]
   script src=//html5shiv.googlecode.com/svn/trunk/html5.js/script
   script src=//
   css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js
   /script
   ![endif]--
  
   `+ en los estilos:
  
  
   article,
   aside,
   details,
   figcaption,
   figure,
   footer,
   header,
   hgroup,
   nav,
   section,
   summary {
   display: block;
   }
  
  
   + info, que me acabo de acordar que escribí sobre eso
  
   http://www.mmfilesi.com/blog/las-etiquetas-semanticas-de-html5/
  
  
  
  
   El 27 de febrero de 2013 11:03, Eva García evag...@gmail.com
 escribió:
  
Para que veis más clara la estructura de la Web os comento que es una
tienda online, donde debajo del slide hay tres cajas que son tres
   enlaces a
tres categorías de productos. Cada caja lleva una imagen, el título
 de
  la
categoría, una breve descripción de la categoría y un link a esa
   categoría.
Debajo van las noticias y debajo opiniones de clientes. La duda que
planteaba es como maquetar esas cajas con enlaces a las categorías
principales. Por lo que he leido entiendo que todo iría dentro de un
   único
section y no se si cada caja etiquetarla con un article o un div
   
Que lío esto del HTML5!!!
   
Gracias de nuevo!
   
   
El 27 de febrero de 2013 10:57, Olivier Blázquez obe...@gmail.com
escribió:
   
 Si no tienen nada que ver con el contenido que viene después, igual
 deberías meterlas dentro de un aside, en vez de un section.

 Yo entiendo el section como la sección de un periódico (Nacional,
  por
 ejemplo), y dentro iría cada noticia dentro de un article. O como
  la
 sección de una tienda y dentro de cada sección, un producto
  (article)
 **
 *
 *



 El 27 de febrero de 2013 10:47, Eva García evag...@gmail.com
   escribió:

  Esas tres cajas .
  Son tres cajas donde en cada un título, descripción y link a una
   página
  interna. Es un bloque independiente de los demás, así que por lo
  que
   me
  comentais esas tres cajas irían dentro de un section. Y ahora la
 siguiente
  duda ¿debería de marcar cada caja con la etiqueta article?
 
  Gracias por el texto Carlos, ya lo había visto googleando ;-)
 
 
 
  El 27 de febrero de 2013 10:37, Carlos Núñez cha...@gmail.com
 escribió:
 
   Te paso un extracto que sigo como referencia:
  
   Uso de div/ en HTML5 orientado a SEO
   La etiqueta div no ha muerto, sigue ahí y sigue significando lo
  que
  siempre
   ha significado: conjunto de elementos. En ningún momento se ha
  transformado
   a una etiqueta tonta que puedas usar libremente para ayudarte
  con
el
  CSS
   ni ha sido sustituida totalmente por la etiqueta section/.
  
   Por lo tanto nuestro deber es usarla como ayuda a la estructura
  de
  página:
   como base para crear el layout de de nuestras páginas, siempre
 y
cuando
  no
   exista otra etiqueta de conjunto que represente mejor este
  papel...
En
   otras palabras, div es la herramienta para unir elementos
 cuando
  no
  podemos
   asociar significado semántico a este conjunto.
  
   Uso de section/ en HTML5 orientado a SEO
   El uso de seción es muy parecido al de div pero aportando la
  carga
   de
   significado mínima posible al contenido.