Maquetación por capas

This topic contains 2 respuestas, has 3 voices, and was last updated by  Anónimo Hace 11 años, 10 meses.

  • Author
    Entradas
  • #2166

    Se abre discusión sobre el mejor procedimiento para maquetar por capas:

    Feature request 1543: Mejora de accesibilidad. Maquetación por capas (Jose Miguel Andonegi)

    A la hora de estructurar contenidos (p.e.: un texto a la izquierda, una imagen a la derecha y los permisos a pie de la imagen), la forma “tradicional” de hacer esta composición es mediante tablas.
    Este mecanismo, además de farragoso, va en contra de los principios de accesibilidad.
    Se debería pasar a estructurar los contenidos por divs. Por ejemplo, en el proyecto TodoFP, se ha seguido este proceso:
    · Definir los nombres de las clases a utilizar para estructurar contenidos (elemento_izquierda, elemento_derecha, ….).
    · Generar los .css de dichas clases (pueden ir en base.css para que se apliquen a todos los estilos).
    · Modificar el funcionamiento de los botones del editor para facilitar el uso de dichas clases a la hora de insertar imágenes, vídeos, etc.
    El plugin divimage, puede servir de ejemplo de lo que se hace en el proyecto TodoFP. Funciona con las clases del estilo FPD_MEDU.

  • #2168

    Ignacio Gros
    Keymaster

    TinyMCE permite maquetar por capas. Permite incluir estructuras predefinidas que el usuario puede seleccionar. Eso genera un HTML (un conjunto de capas) con unas clases. Incluyendo los estilos en las plantillas todo se verá como se espera.

    También se puede hacer que genere HTML con CSS en línea (style=…). Así no es necesario que las plantillas tengan esos estilos (compatibilidad hacia atrás, aunque menor control de la presentación y apariencia definida en el HTML, que siempre es peor).

    De todas formas, todos los estilos necesarios deben añadirse en una hoja de estilos común a todas las plantillas (base). Las plantillas que tengan su propio base.css incluirán ese archivo al exportar en lugar de incluir el de eXe.

    Revisando bien las plantillas y los estilos de base no hay ningún problema para hacerlo.

  • #2170

    Anónimo

    Si damos este paso, yo lo haría con todas las consecuencias, es decir:

    • Definir un listado de problemáticas que queremos abordar (combinación texto/imagen, cita a pie, enlaces a documentos con contenidos alternativos,…).
    • Definir una estructura de divs lo más concreta posible para cada caso.
    • Incorporar al editor el uso de dichos divs para que el usuario sea capaz de maquetar por capas sin saber que está maquetando por capas.

    El plugin de Tiny que podréis encontrar en el feature request, es simplemente un ejemplo de las diferentes adaptaciones que se han hecho al editor en el proyecto FPDMedu y sólo se pone con el objetivo de servir de ejemplo ilustrativo. Responde al documento de especificaciones del proyecto, que se desarrolló siguiendo los pasos descritos y seguro que es muy mejorable.

    Si damos este paso, hay que acertar con la manea de llevar las modificaciones al editor, ya que un punto clave es que el cambio sea lo más amigable posible para l usuario. A la hora de adaptar el editor, se me ocurren las siguientes estrategias:

    1. Adaptar plugins existentes para incorporarles el uso de los divs generados alrededor de las imágenes o los elementos multimedia (divimage es un ejemplo de esta estrategia). Si se hace bien, es posible editar estructuras definidas previamente (en divimage no se ha hecho por falta de tiempo)
    2. Usar el comando template para hacer uso de plantillas predefinidas.

    ¿Se os ocurre alguna otra estrategia?

    Tambien sería necesario hacer una pequeña utilidad para generar documentos html sencillos que sirvan de contenido alternativo para los casos en que sea necesario dar una explicación larga.

    ¡Un saludo!

You must be logged in to reply to this topic.

Skip to content