Foros del Web » Creando para Internet » HTML »

¿Cuál sería el mejor sentido semántico para esto?

Estas en el tema de ¿Cuál sería el mejor sentido semántico para esto? en el foro de HTML en Foros del Web. Buenas ...a ver, me gustaría que me sugieran cuál sería la forma más semántica de meter en tags la siguiente info: Es un listado de ...
  #1 (permalink)  
Antiguo 10/05/2006, 14:36
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
¿Cuál sería el mejor sentido semántico para esto?

Buenas

...a ver, me gustaría que me sugieran cuál sería la forma más semántica de meter en tags la siguiente info:

Es un listado de cursos destacados y por cada curso hay que agregar la fecha de inicio y el tipo de formación.

Osea:

Titulo del listado
Titulo de item
fecha: 20-04-06
tipo: formación reglada

Titulo de otro item
fecha: 20-04-06
tipo: seminario

...etc.

¿cómo lo harían?

lo comencé así pero no sé si habría una forma más correcta

Código HTML:
 <h2 class="pastillamarquesina">Oferta destacada</h2>
	   <ul>
	    <li><h3>Jardinería aplicada</h3>
	    <span class="pepe">Inicio: 20/09/06</span><br />
	    <span class="perico">Tipo: Formación reglada</span>
            </li>
	   </ul> 
Gracias y saludos
  #2 (permalink)  
Antiguo 10/05/2006, 14:54
 
Fecha de Ingreso: diciembre-2003
Mensajes: 1.583
Antigüedad: 14 años
Puntos: 13
Yo creo que habría que decidir entre el uso de listas desordenadas o listas de deficiones.

Listas desordenadas:

Código HTML:
<h2>Oferta destacada</h2>

<ul>
  <li><strong>Jardineria aplicada</strong>
    <ul>
        <li>Inicio: 20/09/06</li>
        <li>Tipo: Formacion reglada</li>
    </ul>
  </li>
  <li><strong>Otor item</strong>
    <ul>
        <li>Inicio: 30/09/06</li>
        <li>Tipo: Seminario</li>
    </ul>
  </li>
</ul> 
Aunque personalmente yo me inclinaría por el uso de listas de definición. Me parece más lógica y más sencilla de aplicarle CSS sin necesidad de llenarla de ID o CLASS:

Código HTML:
<h2>Oferta destacada</h2>

<dl>
  <dt>Título:</dt>
  <dd>Jardineria aplicada</dd>
  <dt>Fecha inicio:</dt>
  <dd>06/06/2006</dd>
  <dt>Tipo:</dt>
  <dd>Formacion reglada</dd>
</dl>

<dl>
  <dt>Título:</dt>
  <dd>Otro item</dd>
  <dt>Fecha inicio:</dt>
  <dd>06/08/2006</dd>
  <dt>Tipo:</dt>
  <dd>Seminario</dd>
</dl> 
__________________
El conocimiento es libre: Movimiento por la Devolución
  #3 (permalink)  
Antiguo 10/05/2006, 16:50
 
Fecha de Ingreso: octubre-2005
Mensajes: 536
Antigüedad: 12 años, 1 mes
Puntos: 1
Hola a todos, hola tunait.

A mí tambien me gustan mucho las injustamente olvidadas listas de definiciones
La estructura que propone frijolerou está muy bien, pero según cómo puede ser complejo aplicarle estilos.

Código HTML:
<h2>Titulo del listado</h2>
<ul>
<li> <dl>
	<dt>Titulo de item 1</dt>
        <dd>fecha: 20-04-06</dd>
        <dd>tipo: formación reglada</dd>
</dl> </li>

<li> <dl>
	<dt>Titulo de item 2</dt>
        <dd>fecha: 20-04-06</dd>
        <dd>tipo: seminario</dd>
</dl> </li>
</ul> 

te propongo algo más simple y más manejable con css.
  #4 (permalink)  
Antiguo 10/05/2006, 17:12
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.547
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola tunait:

Tienes la extraña virtud de plantear cosas de difícil resolución (cuando planteas algo...)

También me parece mejor usar listas de difinición, pero como plantea frijolerou... el ejemplo de Jorolo me parece que es más complejo o... (¡Hola a todos !)

Hace bastante poco tiempo que empecé a usar ese tipo de listas y me parece que dan "más juego"...

Sobre la semántica... es que tal como lo pones es correcto semánticamente si fuera XML y en html/css creo que incluso se parece a datos tabulares (con perdón de la palabra... )

Como verás, poco puedo ayudar...

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #5 (permalink)  
Antiguo 10/05/2006, 17:26
 
Fecha de Ingreso: diciembre-2003
Mensajes: 1.583
Antigüedad: 14 años
Puntos: 13
Yo también lo consideré más cercano a datos tabulares que a un listado. Por eso me pareción que una lista de definición serviría para llegar a un punto medio, sin tener que recurrir a una tabla.

De hecho hace poco en el foro de CSS puse una forma simple de darle a la lista de definicón un aspecto de tabla, faltaría jugar con los bordes nada más.
__________________
El conocimiento es libre: Movimiento por la Devolución
  #6 (permalink)  
Antiguo 10/05/2006, 17:37
 
Fecha de Ingreso: mayo-2006
Mensajes: 120
Antigüedad: 11 años, 7 meses
Puntos: 3
Me parece que la más semántica es la segunda solución de frijolerou.
Aunque al igual que caricatos pienso que es información tabular.
Sólo una pregunta a caricatos, ¿por qué planteas que en XML sería correcto semánticamente y haces difenciación del trato a datos tabulares en html y xml? ¿que diferencias hay al respecto?

saludos.
__________________
programación php
  #7 (permalink)  
Antiguo 10/05/2006, 18:31
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.547
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola:

drbi: La verdad es que he intentado pocas cosas con XML, y tal como está planteado el tema, veo una estructura XML muy común:
<listado>
<item>nombre item</item>
<fecha>fecha item</fecha>
<tipo>tipo item</tipo>

<item>nombre item</item>
<fecha>fecha item</fecha>
<tipo>tipo item</tipo>
</listado>

Y la diferenciación entre listas y tablas... en ocasiones es difícil... ya que una lista es como una tabla de solo una columna, y una tabla es como una lista de datos estructurados o también se parece a una lista de listas...
Hay veces que que se puede pensar que una tabla es un array de 2 dimensiones (matriz), pero si los datos no son homogeneos creo que la mejor definición es tabla...

Bueno, tal como dije en mi anterior participación, creo que poco puedo ayudar.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #8 (permalink)  
Antiguo 10/05/2006, 19:22
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
Yo hace rato me estoy preguntando si es correcto usar una lista de definiciones para estructurar algo que en realidad no ofrece definiciones.
__________________
...___...
  #9 (permalink)  
Antiguo 10/05/2006, 20:34
 
Fecha de Ingreso: mayo-2006
Mensajes: 120
Antigüedad: 11 años, 7 meses
Puntos: 3
Acá hay un buen artículo sobre el tema: h t http:/ / w w w.communitymx. com/content/article.cfm?cid=0BEA6

Básicamente explica que una tabla plantea relaciones de dos dimensiones lo que posibilita otras lecturas, en cambio una lista de definición tiene una única lectura líneal. Esto sería con respecto al uso de listas de definición cómo tablas de dos dimensiones.

Creo que hay una segunda cuestión y es que las tablas deben ser contenedoras de datos, en cambio las listas deben llevar información. Es decir el contenido de una celda de una tabla no tiene valor o significado individualmente.
En cambio en una lista estructuramos un conjunto de información, dónde cada elemento tiene un valor individual y aislado.
Esto último es una interpretación mía, al ver:
h t tp : //ww w.w3.o r g/TR/html401/struct/tables.html
h tt p :/ /ww w.w3.o r g/TR/html401/struct/lists.html
Dónde hablan de "data" e "information" respectivamente.
Sin embargo luego en un ejemplo usan listas (definición+desordenada) para presentar los ingredientes de una receta, que según creo son datos.

Saludos.

PD: No me deja incluir enlaces directos.
__________________
programación php
  #10 (permalink)  
Antiguo 10/05/2006, 22:12
 
Fecha de Ingreso: diciembre-2003
Mensajes: 1.583
Antigüedad: 14 años
Puntos: 13
Esta vez sí que la puso complicada tunait. Sin embargo yo sigo insistiendo en que (no excluyendo que pudiésen ser considerados como datos tabulados) está más cercano a una lista de definición.

Basta con leer lo que aparece sobre este tipo de listas en la traducción del SIDAR sobre la especificación HTML, desde donde adjunto algunos extractos:

Cita:
Las listas de definiciones, creadas por medio del elemento DL, consisten generalmente en una serie de parejas término/definición (si bien las listas de definiciones pueden tener otras aplicaciones).
Basta ver los ejemplos de usos que se presentan allí, dando a entender que una lista de definición no debe ser estar cerrada sólo para estructurar un glosario.
__________________
El conocimiento es libre: Movimiento por la Devolución
  #11 (permalink)  
Antiguo 10/05/2006, 23:44
 
Fecha de Ingreso: enero-2003
Ubicación: Córdoba, Argentina
Mensajes: 1.047
Antigüedad: 14 años, 10 meses
Puntos: 10
lamento discrepar con los maestros... pero yo creo que la forma mas correcta semanticamente seria:

Código HTML:
<h2>Oferta destacada</h2> 

<h3>Jardineria aplicada</h3> 
<ul>  
  <li>Inicio: 20/09/06</li>  
  <li>Tipo: Formacion reglada</li>  
</ul>

<h3>Otor item</h3>  
<ul>  
  <li>Inicio: 30/09/06</li>  
  <li>Tipo: Seminario</li>
</ul> 
principalmente porque pienso que es fundamental usar una etiqueta de encabezado para los titulos de los cursos.
Para la fecha y demas podrian usarse diferentes formas (ul, dl, p, etc) y ninguna, creo yo, seria semanticamente mas correcta que las otras.
__________________
oohh... quisiera ser godines!!!
  #12 (permalink)  
Antiguo 11/05/2006, 05:12
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Hola a todos

bárbaras todas las opiniones y propuestas

Me planteé, tal como sugieren, el usar listas de definición; de hecho ante la duda fue cuando preferí plantear aquí el tema y ver qué conclusiones se sacaban ante las diferentes opiniones.

Uno de los detalles que me hicieron dudar fue, precisamente, lo que plantea Daz
Cita:
Iniciado por Al Zuwaga
Yo hace rato me estoy preguntando si es correcto usar una lista de definiciones para estructurar algo que en realidad no ofrece definiciones.
Lo mismo me pasaba por la cabeza . Aunque tiene razón frijolerou en esto que menciona
Cita:
Iniciado por frijolerou
Cita:
Las listas de definiciones, creadas por medio del elemento DL, consisten generalmente en una serie de parejas término/definición (si bien las listas de definiciones pueden tener otras aplicaciones).
Basta ver los ejemplos de usos que se presentan allí, dando a entender que una lista de definición no debe ser estar cerrada sólo para estructurar un glosario.
Dándole vueltas al uso de listas de definición se me había pasado por la cabeza el hacerlo como propone Jorolo usando un dt y dos dd pero, honestamente, dudaba de si es correcto el uso de más de 1 dd para cada dt (supongo que debe de serlo)
Cita:
Iniciado por Jorolo
<dl>
<dt>Titulo de item 1</dt>
<dd>fecha: 20-04-06</dd>
<dd>tipo: formación reglada</dd>
</dl>
Respecto a la forma exacta que plantea frijolerou con listas de definición usando los dt para portar el tipo de información que se mostrará en los dd está muy buena aunque no me cuadra del todo en lo que necesito porque no debe mostrarse título con el título del curso. Supongo que se podría ocultar desde css; no sé si esto podría ocsarionar algún resultado visual inesperado
Tal vez esto estaría bien...
Código HTML:
<ul>
	<li><strong>Título del item</strong>
	   <dl>
	      <dt>Fecha: </dt>
		  <dd>29/08/06</dd>
	      <dt>Tipo:</dt>
		  <dd>Formación reglada</dd>
	   </dl>
	</li>
</ul> 
Otro punto con el que estoy de acuerdo es con el que menciona safe
Cita:
pienso que es fundamental usar una etiqueta de encabezado para los titulos de los cursos.
También pienso lo mismo
Sin embargo, creo que el título debería forma parte del listado, puesto que se supone que cada uno de los cursos es un item de un listado.

Tomando el conjunto de lo que se ha comentado en este post, tal vez la forma podría ser esta?
Código HTML:
<h2>Oferta destacada</h2>
<ul>
	<li><h3>Título del item</h3>
	   <dl>
	      <dt>Fecha: </dt>
		  <dd>29/08/06</dd>
	      <dt>Tipo:</dt>
		  <dd>Formación reglada</dd>
	   </dl>
	</li>
</ul> 
¿Cómo lo ven?
  #13 (permalink)  
Antiguo 11/05/2006, 05:24
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
por otro lado ....

Es interesante lo planteado por caricatos y por drbit sobre considerarlos como datos tabulares, no me lo habría planteado pero tienen razón.

Cita:
Iniciado por drbit
PD: No me deja incluir enlaces directos.
Cuando tengas más de 15 mensajes publicados podrás incluír links sin problemas

Cita:
Iniciado por caricatos
Tienes la extraña virtud de plantear cosas de difícil resolución (cuando planteas algo...)
eps... espero eso no sea algo demasiado malo ...


Cita:
Iniciado por frijolereu
Esta vez sí que la puso complicada tunait.
espero no me acaben odiando demasiado
  #14 (permalink)  
Antiguo 11/05/2006, 11:06
 
Fecha de Ingreso: enero-2003
Ubicación: Córdoba, Argentina
Mensajes: 1.047
Antigüedad: 14 años, 10 meses
Puntos: 10
Hola a todos,

Este tipo de temas son muy interesantes! (¿alguien ya propuso un sub foro de semantica?)

volviendo al tema que nos compete: me parece que esta muy bien la ultima opcion que propones. Aunque lo que planteas:

Cita:
Sin embargo, creo que el título debería forma parte del listado, puesto que se supone que cada uno de los cursos es un item de un listado.
es bastante relativo...pienso que con ese punto de vista deberiamos meter en una lista, por ejemplo, los ultimos post de un blog , las ultimas noticias de un sitio, etc... osea YO lo veo mas como bloques de informacion que elementos de un listado.
De todas formas, y como dije antes, no creo que ninguna de las opciones dadas sean mucho menos correctas que las otras.

Lo que si hice, ya que no me considero experto en el tema ni mucho menos, fue analizar casos parecidos en sitios de gente importante respecto a los estandares.
un ejemplo que me llamo bastante la atencion, pese a no ser muy similar al que plantea Tuait, fue uno que encontre en http://www.alistapart.com/topics/code/css/
Donde hay un "listado" de temas y utilizan la siguiente estructura para cada elemento:

Código HTML:
<div class="item">
  <h3>A More Accessible Map</h3>
  <h4>by  Seth Duffey</h4>
  <h5>Issue 215<span>April 18, 2006</span></h5>
  <p>Is there a way to display text-based data on a map</p>
</div> 
Me llamo la atencion mas que nada porque yo nunca hubiera usado los H4 y H5 para esos casos... pero supongo que esta gente que es tan reconocida sabe lo que hace .

Bueno, eso es todo lo que puedo escribir por hoy (hace 4 dias me operaron el hombro derecho y solo puedo teclear con la mano izquierda ).

Saludos
__________________
oohh... quisiera ser godines!!!
  #15 (permalink)  
Antiguo 11/05/2006, 17:43
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.547
Antigüedad: 15 años, 8 meses
Puntos: 1262
Cita:
Iniciado por tunait
...
eps... espero eso no sea algo demasiado malo ...

espero no me acaben odiando demasiado


Desde luego que prefiero este tipo de cuestiones... cuando es cosa de código, últimamente lo pongo "a capella", pero los temas de debate son los que más me gustan

Lo de tablas... no sé porqué se me pasó por la cabeza de que los datos salían de una tabla... y que se podrían consultar por título, fecha, descripción... (ordenándo de forma ascendente o descendente)

Sobre la referencia de safe (¡Hola !) en uno de mis artículos de maestros del web referencio uno de esos artículos en donde estoy convencido de que dan un ejemplo "mejorable". Y es que en la web se puede encontrar de todo.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #16 (permalink)  
Antiguo 11/05/2006, 17:50
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
Entonces, si una dl no está cerrada sólo al hecho de estructurar un glosario, me parece que está bien :)
__________________
...___...
  #17 (permalink)  
Antiguo 11/05/2006, 22:17
 
Fecha de Ingreso: diciembre-2003
Mensajes: 1.583
Antigüedad: 14 años
Puntos: 13
Tal vez lo que deberíamos preguntarnos es que si cada curso (con sus respectivos datos) debe ser tratado como ítem de un listado mayor, o como bloques por separado que forman un subcontenido para el contenido Oferta destacada. Yo me la juego por esto último, en donde el título del curso lo usaría como un encabezado y los datos de cada curso como una lista de definición:

Código HTML:
<h2>Oferta destacada</h2>

<h3>Jardinería aplicada</h3>
  <dl>
    <dt>Inicio:</dt>
    <dd>06 / 06 / 2006</dd>
    <dt>Tipo:</dt>
    <dd>Seminario</dd>
  </dl> 
__________________
El conocimiento es libre: Movimiento por la Devolución
  #18 (permalink)  
Antiguo 12/05/2006, 01:01
 
Fecha de Ingreso: enero-2003
Ubicación: Córdoba, Argentina
Mensajes: 1.047
Antigüedad: 14 años, 10 meses
Puntos: 10
frijolerou presidente!

frijolerou estoy totalmente de acuerdo

frijolerou presidente!
__________________
oohh... quisiera ser godines!!!
  #19 (permalink)  
Antiguo 02/02/2009, 18:47
Avatar de punk567  
Fecha de Ingreso: octubre-2006
Ubicación: Montevideo
Mensajes: 265
Antigüedad: 11 años, 2 meses
Puntos: 5
Respuesta: ¿Cuál sería el mejor sentido semántico para esto?

Cita:
Código HTML:
<h2>Oferta destacada</h2> 
<h3>Jardineria aplicada</h3> 
<ul>  
  <li>Inicio: 20/09/06</li>  
  <li>Tipo: Formacion reglada</li>  
</ul>

<h3>Otor item</h3>  
<ul>  
  <li>Inicio: 30/09/06</li>  
  <li>Tipo: Seminario</li>
</ul> 
Cita:
Código HTML:
<h2>Oferta destacada</h2>

<h3>Jardinería aplicada</h3>
  <dl>
    <dt>Inicio:</dt>
    <dd>06 / 06 / 2006</dd>
    <dt>Tipo:</dt>
    <dd>Seminario</dd>
  </dl> 
modificando algo más
Código HTML:
<h2>Oferta destacada</h2>

<div id="jardineria-aplicada" class="item">
  <h3>Jardinería aplicada</h3>
    <dl>
      <dt>Inicio:</dt>
      <dd>06 / 06 / 2006</dd>
      <dt>Tipo:</dt>
      <dd>Seminario</dd>
    </dl>
</div>

<div id="jardineria-aplicada-2" class="item">
  <h3>Jardinería aplicada 2</h3>
    <dl>
      <dt>Inicio:</dt>
      <dd>06 / 06 / 2006</dd>
      <dt>Tipo:</dt>
      <dd>Seminario</dd>
    </dl>
</div> 
vale recordar que en Html5/Xhtml2.0, aparecen elementos nuevos como

· section
· header
· footer
· nav
· article

Saludos
  #20 (permalink)  
Antiguo 03/02/2009, 15:06
Avatar de webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.727
Antigüedad: 15 años, 10 meses
Puntos: 997
Respuesta: ¿Cuál sería el mejor sentido semántico para esto?

punk567, por favor revisa las fechas antes de responder, este mensaje es de mediados 2006.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Tema Cerrado




La zona horaria es GMT -6. Ahora son las 20:11.