Foros del Web » Creando para Internet » HTML »

Semantica - ¿Como maquetarian esto?

Estas en el tema de Semantica - ¿Como maquetarian esto? en el foro de HTML en Foros del Web. Tengo que maquetar un listado de peliculas con algunos datos de cada una. El listado vendria a ser algo asi: Código: + | Nombre de ...
  #1 (permalink)  
Antiguo 25/07/2007, 06:18
 
Fecha de Ingreso: enero-2003
Ubicación: Córdoba, Argentina
Mensajes: 1.047
Antigüedad: 14 años, 10 meses
Puntos: 10
Semantica - ¿Como maquetarian esto?

Tengo que maquetar un listado de peliculas con algunos datos de cada una.
El listado vendria a ser algo asi:


Código:
+  |  Nombre de pelicula  |  Genero  |  Duracion  |  Rating  |  Etc
-------------------------------------------------------------------------------
+  |  Dulce y Melancolico |  Drama   |  125 min.  |     8    |  Etc
+  |  Dulce y Melancolico |  Drama   |  125 min.  |     4    |  Etc
+  |  Dulce y Melancolico |  Drama   |  123 min.  |     5    |  Etc
+  |  Dulce y Melancolico |  Drama   |  122 min.  |     6    |  Etc
+  |  Dulce y Melancolico |  Drama   |  124 min.  |     7    |  Etc
+  |  Dulce y Melancolico |  Drama   |  145 min.  |     8    |  Etc

Eso claramente son datos tabulados, por lo que no dudo que lo correcto sea utilizar una tabla.

El problema es que si el usuario presiona el "+" tiene que desplegarse un fila abajo con la informacion ampliada de la pelicula, que ya no son datos tabulados. Y eso es lo que no se como manejar. Porque la solucion mas sencilla seria aañadir una fila con colspan=X y adentro poner toda la informacion. Pero dudo que eso sea semanticamente correcto. Pero la verdad es que todavia no se me ocurrio otra solucion.
Porque creo que lo correcto seria poner esa info en un celda de la misma fila. Pero como hago para posicionarla como una nueva fila?

Alguna idea?
__________________
oohh... quisiera ser godines!!!
  #2 (permalink)  
Antiguo 25/07/2007, 06:54
Avatar de PatomaS
Colaborador
 
Fecha de Ingreso: marzo-2004
Ubicación: En alguna otra parte
Mensajes: 4.656
Antigüedad: 13 años, 9 meses
Puntos: 63
Re: Semantica - ¿Como maquetarian esto?

Hola

De hecho, la solución que planteas es correcta.

Hay otras opciones como tener tablas separadas para cada fila y debajo un div con el contenido y la misma mecánica que planteas, seguramente algo así es lo que te hacía dudar, sin embargo, eso si es totalmente impráctico y poco semántico.

Yo usaría, sin duda alguna una solución con tablas, tal y como mencionas y una fila inferior con la información ampliada. al menos si tengo que usar esa maqueta.

Dado que vas a usar javascript, otra opción es que la información salga en una capa en alguna posición de la pantalla que el diseño te lo permita, no estando esta información incluida en la tabla si no en una serie de divs o en uno solo cuya información escribes en tiempo de ejecución o creando un div vacío, clonándolo y rellenándolo cada vez con datos de una variable relacionada con cada peli.

Esa parte tiene opciones, sin embargo, tu planteamiento es correcto.

Felicidad
__________________
¡ hey, hou, hou, hey !
  #3 (permalink)  
Antiguo 25/07/2007, 12:56
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Re: Semantica - ¿Como maquetarian esto?

Si realmente estas interesado en la semantica, me inclo mas por la solucion en la capa aprte.... quiza puedas adaptar el lightbox o hacer tu mismo algo similar... no es dificil, se me ocurre una capa superior a la que le pasas la informacion mediante javascript.y con javascript controlas la visiblidad de la capa.
  #4 (permalink)  
Antiguo 25/07/2007, 13:28
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
Re: Semantica - ¿Como maquetarian esto?

Tal vez... ¿colocando la información ampliada de la película en la última columna, ocultando ésta a la vista con JS y luego mediante DOM manipular la tabla para que al hacer click en el ícono +/- la info de dicha columna se muestre/oculte en un <td colspan=X> generado al vuelo?

Navegadores que no interpreten/tengan deshabilitado JS mostrarán la "tabla ampliada" y navegadores que si lo interpreten dispondrán de una característica extra... ¿graceful degradation que le llaman?

Saludos
  #5 (permalink)  
Antiguo 26/07/2007, 12:13
 
Fecha de Ingreso: enero-2003
Ubicación: Córdoba, Argentina
Mensajes: 1.047
Antigüedad: 14 años, 10 meses
Puntos: 10
Re: Semantica - ¿Como maquetarian esto?

Muchas gracias por todas las respuestas!
El tema es que yo solo tengo quemaquetar el HTML y el resto del codigo lo hace un programador. Entonces las soluciones que proponen son solo darle mas trabajo al programador y solo voy a lograr que me odie un poco mas...

Al final decidi hacerlo con una lista de peliculas con una sublista con la informacion de cada pelicula.
Va a ser un tanto complicado, pero creo que puede llegar a quedar bien. Y sino, ya tendran noticias mias.
__________________
oohh... quisiera ser godines!!!
  #6 (permalink)  
Antiguo 26/07/2007, 12:42
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Re: Semantica - ¿Como maquetarian esto?

pufffffffff.... si es buen programador para esl sera algo snecillo, si es un nuevo pero le gusta programar sera un reto que con gusto aceptara y si no, que se valla al diablo y se busque un empleo que le guste en realidad.
  #7 (permalink)  
Antiguo 21/08/2007, 15:27
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
Re: Semantica - ¿Como maquetarian esto?

Saludos tardíos. Hace tiempo que terminé un script que cumple con el planteo que hice más arriba, pero por falta de memoria olvidé publicarlo. Acá lo dejo: Alterando una tabla con Javascript. Espero le sea de utilidad a alguien
__________________
...___...
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.
Respuesta




La zona horaria es GMT -6. Ahora son las 04:55.