Capas y compatibilidad

Toni · #1 (**permalink**) 09/02/2005, 05:56

Hola a todos.

Hace tiempo que no pregunto nada y me ha surgido una duda que quiero comentaros:

Estamos cambiando la web de mi empresa y ya he expresado mi voluntad de adaptarla al máximo para que cumpla los estándares.

En principio eso no supondría ningún problema, pero el diseño (donde yo no tengo nada que hacer, será ese diseño y ya está) no facilita demasiado el trabajo.

Aún y así no tendría problemas para respetar los estándares con XHTML frames, pero como sé que trabajar con frames es un coñazo, pues me gustaría aprovechar el potencial de las CSS para no tener que usarlos.

El problema está en la zona donde se mostrarán los contenidos (texto explicativo de cada sección) ya que al hacer click en los enlaces, tendría que ocultar la capa activa y mostrar otra con los nuevos contenidos (me parece la forma más práctica para hacerlo). Podría hacerlo con DHTML, pero trabajar con capas que se muestran y se ocultan, no me da muy buena espina francamente, sé que los resultados en cuanto a compatibilidad, no son muy buenos.
También sería un problema de cara a las estadísticas del site, ya que todas las capas y toda la información estarían dentro de la misma página independientemente de que se mostraran o no, y por tanto no podría saber qué sección de la web interesa más. Tampoco quiero usar un iframe, quizás podría tener la información de cada página guardada en archivos .xml y al hacer click que se mostraran los datos de ese archivo en la zona apropiada qué os parece?

Alguien conoce alguna web que lo haya implementado y que sea compatible al máximo? algún otro comentario o sugerencia al respecto?

Gracias de antemano

. Toni.

Zerjillo · #2 (**permalink**) 09/02/2005, 06:54

¿Para que quieres ocultar y mostrar capas?

Cuando pinchas un enlace, que cargue la página con la información que se correspodne con ese link y vas que chutas... Ni javascript ni nada.

Un saludo

Zerjillo

Toni · #3 (**permalink**) 09/02/2005, 08:40

Hola Zerjillo, gracias por contestar.

Lo que me comentas no lo puedo hacer por temas de diseño. Si hago eso, se tendrían que volver a cargar los menús de nuevo y deberían estar siempre fijos en la pantalla. Además, tendría que mandarle algún parámetro a la página a la que quisiera enlazar porque el menú siempre debe señalar la sección dónde se está.

Sé que todo eso lo puedo hacer con frames, se dejan los elementos fijos y ya está, pero precisamente lo que quiero evitar es usar frames.

Ahí se complica el tema, porque aunque con CSS se pueden posicionar elementos fijos, el de la parte de contenidos con la info, debería cambiar según el enlace que se pinche en los menús.

Saludos.

Khronos · #4 (**permalink**) 09/02/2005, 08:51

Cita:

Iniciado por Toni

Hola Zerjillo, gracias por contestar.

Lo que me comentas no lo puedo hacer por temas de diseño. Si hago eso, se tendrían que volver a cargar los menús de nuevo y deberían estar siempre fijos en la pantalla. Además, tendría que mandarle algún parámetro a la página a la que quisiera enlazar porque el menú siempre debe señalar la sección dónde se está.

Sé que todo eso lo puedo hacer con frames, se dejan los elementos fijos y ya está, pero precisamente lo que quiero evitar es usar frames.

Ahí se complica el tema, porque aunque con CSS se pueden posicionar elementos fijos, el de la parte de contenidos con la info, debería cambiar según el enlace que se pinche en los menús.

Saludos.

La verdad es que trato de visualizar en mi mente una capa dinámica que cambia por otra al haber ejecutado la acción clic sobre un vínculo y no logro encontrar explicación ni forma.

Ahora, lo que tampoco comprendo es por qué te niegas a usar los iframes. Creo que son una buena alternativa.

Por otro lado, pienso que esto de las capas deberías consultarlo en el foro de CSS. Seguro algun guru de CSS te dará respuestas.

Toni · #5 (**permalink**) 09/02/2005, 09:51

Gracias Kronos por contestar.

No quiero usar iframes porque sólo funcionan en Internet Explorer, que yo sepa no están implementados por el w3c, si me equivoco corregidme please

Como una imagen vale más que mil palabras os pongo un link:

http://softron.webcindario.com/maqueta.gif

En esa imagen se ve la estructura que tendrá la web. Quiero que los div 1, div 2 y div 4 estén siempre fijos y que al hacer click en alguna opción del menú (por ejemplo en Submenú 1.1) se carguen los contenidos en el div 3 que es el de los contenidos.

Por tanto el div 3 sí que tendrá que cambiar para enseñar los diferentes contenidos pero los otros deben quedar fijos. Como he dicho antes eso se puede hacer con frames, pero preferiría hacerlo con CSS, por tanto, para cambiar los contenidos que se muestran (o sea el div 3) tendría que ocultar el div actual y mostrar el nuevo.

No quise ponerlo en el foro de CSS porque me pareció que era más correcto este y no quería publicar el mismo mensaje en dos sitios distintos, pero luego a lo mejor sí que pongo un enlace a esta conversación.

Perdón por la taladrada

Toni

Daphne · #6 (**permalink**) 09/02/2005, 10:04

Toni, tengo exactamente la misma duda que tú desde hace bastante tiempo, si alguien te la resuelve le tendré que poner un altar.

Khronos · #7 (**permalink**) 09/02/2005, 10:23

Cita:

Iniciado por Toni

Gracias Kronos por contestar.

No quiero usar iframes porque sólo funcionan en Internet Explorer, que yo sepa no están implementados por el w3c, si me equivoco corregidme please

El elemento IFRAME funciona tanto en IE como en Firefox al igual que en Opera.

Cita:

Sobre IFRAME:

El elemento IFRAME permite a los autores insertar un marco dentro de un bloque de texto. Insertar un marco en línea dentro de una sección de texto es muy similar a insertar un objeto mediante un elemento OBJECT: ambos permiten insertar un documento HTML en medio de otro, ambos pueden alinearse con el texto circundante, etc.

La información a insertar en línea se designa mediante el atributo src de este elemento. Los contenidos del elemento IFRAME, por su parte, sólo deberían ser mostrados por los agentes de usuario que no soporten marcos o que estén configurados para no mostrar marcos.

Para aquellos agentes de usuario que soporten marcos, el siguiente ejemplo colocará un marco en línea rodeado por un borde en medio del texto.

<IFRAME src="blabla.html" width="400" height="500"
scrolling="auto" frameborder="1">
[Su agente de usuario no soporta marcos o está actualmente configurado
para no mostrar marcos. Sin embargo, puede visitar
<A href="blabla.html">el documento relacionado.</A>]
</IFRAME>

Los marcos en línea no pueden ser redimensionados (y por lo tanto no tienen un atributo noresize).

Nota. También puede incluirse un documento HTML dentro de otro documento HTML por medio del elemento OBJECT. Véase la sección sobre documentos incluidos para más detalles.

Fuente:
http://html.conclase.net/w3c/html401...es.html#h-16.5

Cita:

Sobre la inclusión de documentos:

Algunas veces, más que crear un vínculo a un documento, lo que quiere un autor es incluirlo directamente en un documento HTML principal. Para esto, los autores pueden usar o bien el elemento IFRAME o bien el elemento OBJECT, pero ambos elementos difieren en varios aspectos. No solamente tienen los dos elementos modelos de contenido diferentes, sino que el elemento IFRAME puede ser un marco destino (veáse la sección sobre la especificación de información sobre el marco destino para más detalles) y puede ser "seleccionado" por un agente de usuario dirigiendo a él el foco para imprimir, ver el fuente HTML, etc. Los agentes de usuario pueden representar los marcos seleccionados de modo que se distingan de los marcos no seleccionados (p.ej., dibujando un borde alrededor del marco seleccionado).
Un documento incluido es completamente independiente del documento en el cual se incluye. Por ejemplo, los URIs relativos del documento incluido se completan de acuerdo con el URI base del documento incluido, no con el del documento principal. Un documento incluido sólo se representa dentro de otro documento (p.ej., en una subventana); por lo demás sigue siendo independiente.

Por ejemplo, la línea siguiente incluye los contenidos de incluye_me.html en el lugar en que aparece la definición OBJECT.

...texto antes...
<OBJECT data="incluye_me.html">
Atención: no se pudo incluir incluye_me.html.
</OBJECT>
...texto después...

Recuérdese que los contenidos de OBJECT sólo deben ser representados si no se puede cargar el fichero especificado por el atributo data.

El comportamiento de un agente de usuario en los casos en que un fichero se incluye a sí mismo queda sin definir.

Fuente:
http://html.conclase.net/w3c/html401...dded-documents

Toni · #8 (**permalink**) 09/02/2005, 11:06

Hola.

Khronos pues de verdad que pensaba que sólo funcionaba en IE, si está definido en el W3c, todos los navegadores deberían implementarlo (otra cosa es que lo hagan

)

Entonces ya tengo una buena/gran solución al problema. TEndría que inventar alguna historia en JavaScript para cargar un iframe u otro ya que imagino que no hay soporte para _target.

Pues lo dicho, gracias, ya veré como me lo monto pero la idea base ya la tengo. Sería un lujazo mandar los frames a tomar por saco.

Saludos.

P.D: Daphne, quizás ya tengas a alguien a quién poner en un altar

Daphne · #9 (**permalink**) 09/02/2005, 11:12

Hombre, los iframes están definidos, pero creo que el HTML strict no los permite. Que alguien me corrija si me equivoco, por favor.

Soporte para _target en strict no hay, tampoco.

A mí lo que me gustaría es no depender de los iframes en absoluto. Aunque bueno, Toni, tampoco entiendo bien cuál es tu idea. :P

tunait · #10 (**permalink**) 09/02/2005, 11:23

Cita:

Iniciado por Daphne

Hombre, los iframes están definidos, pero creo que el HTML strict no los permite. Que alguien me corrija si me equivoco, por favor.

Soporte para _target en strict no hay, tampoco.

A mí lo que me gustaría es no depender de los iframes en absoluto. Aunque bueno, Toni, tampoco entiendo bien cuál es tu idea. :P

Buenaass....

al respecto de lo que comenta Daphne (hola maja

) os recomiendo este fantástico post (no olviden calificarlo para que le salgan estrellitas) http://www.forosdelweb.com/f4/iframes-validos-xhtml-1-1-a-261077/

Traslado el tema al foro de CSS

saludos

Durgeoble · #11 (**permalink**) 09/02/2005, 11:33

No veo el problema para no hacer tu site en javascrip y capas, seria sencillo la capa superior y lateral fija.
El javascrip detecta un parametro de la pagina (donde has pulsado) y cambia el menu y muestra la capa correspondiente
hay ejemplos de menus en arbol, solo deberias adptarlos para mostrarse horizontalmente (puedes tomar ejemplo de este mismo foro).
De esa forma solucionarias el problema.
Deberias darte una vuelta por javascrip ya que supongo que seria lo mas adecuado a lo que tu quieres.
Y hay soporte para _target en xhtml 1.1

kemie · #12 (**permalink**) 09/02/2005, 12:17

tal vez este script es algo asi como lo que buscas...
http://www.onlinetools.org/tools/domtab.php

Khronos · #13 (**permalink**) 09/02/2005, 12:23

Cita:

Iniciado por kemie

tal vez este script es algo asi como lo que buscas...
http://www.onlinetools.org/tools/domtab.php

Muy interesante script

Toni · #14 (**permalink**) 10/02/2005, 05:15

Gracias por las respuestas.

Entiendo que no se comprenda mucho el problema, porque quizás no me he explicado muy bien, aunque en la imagen creo que se puede entender bien la historia.

Está muy bien el script que ha puesto kemie, y es muy buena opción, sólo tiene una pega: En los logs de acceso sólo aparecería esa página y no podría saber qué "ficha" ha tenido más visitas usando sólo el programa de estadísticas . Por eso me interesa más ahora la idea del iframe sabiendo que es compatible con todos los navegadores que implementen bien los estándares del w3c.

Me he mirado por encima el link de tunait y está muy bien, tengo que mirarlo más a fondo, seguramente haré algo así.

Gracias a todos!!!!

andreusup · #15 (**permalink**) 10/02/2005, 10:30

Muy bueno el link de kemie... ahora mismo estaba queriendo hacer algo así. Me ha servido de gran ayuda.

http://www.onlinetools.org/tools/domtab.php

DeLaVega · #16 (**permalink**) 11/02/2005, 04:25

Generalmente no uso iframes... por lo único que me preocuparía (dado que decís que es el sitio de una empresa) es primero por si sólo se va a acceder por web. Puede ser que se quiera hacer que el mismo sitio sea visible por ejemplo en PDAs (a cada versión asignarle una hoja de estilos diferente). Quizás si tienen pensando eso, el iframe puede presentar problema (me refiero a usarlo para visualizar en PDAs).
Lo segundo, sería el tema del posicionamiento. Al no usar demasiado iframes, no tengo mucha idea de como indexa Google (seguro que lo indexa, pero no sé si te puede relegar o si indexa directamente la página dentro del iframe únicamente, sé que con los frames se corre ese riesgo y se puede aplicar un poco de javascript para que se cargue siempre dentro del frame). Tampoco sé que si importa para el sitio de la empresa el posicionamiento.
Tercero, y estaría relacionado con el primer punto, por un tema de accesibilidad. No sólo las PDA entrarían acá, sino también los screen readers (los browsers para personas no videntes, esos que leen el sitio, por ejemplo el JAWS).
Por supuesto, todo esto es para evaluar, seguramente no todas estas cosas son para todos los sitios, pero me parecen importantes para tener en cuenta antes de decidir.
Saludos, espero sirva ;)

Toni · #17 (**permalink**) 11/02/2005, 05:41

Hola DeLaVega.

En principio la web no será accesible para pda, y no importa en exceso. Respecto a la indexación no estoy preocupado ya que según tengo entendido los indexan igual que los frames.

Respecto a lo de las personas invidentes pues,

no sé si leerá los iframes, pero las otras opciones que barajaba (capas dinámicas y frames) supondrían el mismo problema.

Creo que con los iframes he encontrado la mejor solución para el diseño que tengo que llevar a la web.

Saludos y gracias