ElegantThemes

Anteriormente WordPress 5.9 Look: El camino hacia un diseño de bloques más receptivo

El gerente de proyectos de Gutenberg, Matías Ventura, anunció la Camino provisional a 5.9 hoy en el blog Make Core. Ha cubierto varios cuadro grande Elementos, incluidos varios subelementos para cada uno. También se vinculó a un Problema de GitHub con tareas específicas y tickets que necesitan trabajo.

El artículo contiene información sobre patrones de bloques, menús de navegación, theme.json Interfaz de usuario (estilos globales), herramientas de diseño y flujos de edición para temas de bloques. Hay mucha información y áreas suficientes para cubrir diferentes intereses.

El enfoque más emocionante de 5.9 podría ser simplemente profundizar en el diseño receptivo a nivel de bloque, ya sea código bajo el capó o opciones de bloque disponibles a través de la interfaz de usuario.

«Uno de los mayores puntos de fricción para los creadores de patrones y temas es la falta de herramientas receptivas disponibles a nivel de bloque», escribió Ventura. «Esto tiene que resolverse de tal manera que la complejidad de la interfaz no aumente de manera desproporcionada».

Diseño web intrínseco con bloques

Muestras de diseño móvil compartidas por Ventura.

Es fácil estar molesto por el lento progreso hacia las opciones de bloque de respuesta en los últimos años. No estoy completamente insatisfecho con esto, porque quiero que el equipo proceda metódicamente y esté preparado para el futuro, al menos en la medida de lo posible.

Lo que hemos visto con demasiada frecuencia con las consultas e incluso los complementos de terceros es el uso de consultas de medios basadas en ventanas gráficas para controlar la respuesta de los bloques a diferentes dispositivos (por ejemplo, computadoras de escritorio, tabletas y dispositivos móviles). Si bien estos controles a veces pueden ser la herramienta adecuada para el trabajo, no siempre son el camino a seguir para el diseño basado en componentes.

Las consultas de los medios suelen preferir métodos de diseño holísticos. Sin embargo, el diseño basado en componentes es la cara moderna de la web. Los bloques son solo un componente más, y dado que los desarrolladores o incluso los usuarios pueden colocarlos en cualquier lugar del diseño general, debemos centrarnos más en cómo reaccionan a su entorno que en la ventana del navegador.

«El modelo de bloques es un buen caso para aplicar algunos principios de diseño intrínsecos porque un bloque puede ocupar un lugar en muchos diseños y contenedores diferentes para los cuales las consultas de medios prescriptivas que no consideran el contexto son inflexibles», escribió Ventura.

Un ejemplo simple es el bloque de columnas principal de WordPress. Podríamos agregar fácilmente opciones de consulta de medios al romper cualquier bloque de columna interno. Pero, ¿cómo debería reaccionar la tipografía con tres columnas frente a cuatro columnas y con diferentes anchos? Esto es más una función del tamaño del contenedor que de la ventana gráfica.

¿Y cómo funcionan estas consultas de medios cuando las columnas están anidadas dentro de otra columna? Esto se convierte en un problema más complejo que debe resolverse cuando pone los controles de diseño en manos de los usuarios. Presionar el botón de avance rápido en las opciones de bloqueo de respuesta puede sentirse bien en este momento, pero también podría crear problemas heredados que serán difíciles de encontrar cuando una mejor solución llegue al mercado.

Incluso algo aparentemente simple como un encabezado de sitio web simple puede volverse complejo cuando se diseña para la entrada del usuario. No hay forma de que un diseñador de diseño sepa cuántos caracteres hay en el título del sitio, por ejemplo, o cuántos elementos hay en el menú de navegación. El sistema de bloqueo puede complicar aún más esto al permitir que los usuarios finales ingresen otras incógnitas.

«Cada área de bloque debe ser intrínsecamente sensible para que los bloques se puedan juntar, envolver, apilar y organizar para adaptarse a las diferentes salas y pantallas», escribió Ventura. «Para que esto funcione bien, los bloques contenedores deben adaptarse a más controles de diseño».

También mencionó Consultas de contenedor como un posible punto de extensión si son totalmente compatibles con los navegadores en el futuro. Chrome Canary actualmente tiene una bandera de soporte para habilitar la función.

Las consultas de contenedores son una especie de santo grial para los diseñadores. Como diseñador web Ethan Marcotte escribió hace cuatro años:

Quizás empiece aquí: en los últimos años mi trabajo de diseño se ha centrado mucho más en patrones y menos en «páginas». En lugar de tratar un diseño receptivo como algo holístico y unificado en el que cada parte del diseño cambia y se adapta al mismo ritmo, es más útil dividir un diseño receptivo en piezas de diseño más pequeñas y reutilizables, incluidas cosas como «aviso legal» » pie de página. «», «Título» y así sucesivamente.

En otras palabras, en mi proceso de diseño, veo el diseño receptivo como una red de pequeños sistemas de diseño. Cada uno de estos componentes son básicamente pequeños diseños receptivos con sus propios puntos de interrupción.

¿Suena familiar? Sí, el sistema de bloques de WordPress se basa en la misma base de pequeños componentes de diseño.

Todo lo que WordPress hace hoy en el nivel de la interfaz de usuario tiene que considerar las consultas de contenedores del futuro. O al menos use las herramientas existentes que podrían replicar la función de alguna manera, como: min(), max(), y clamp() Funciones CSS.

El problema es averiguar qué características deben exponerse como opciones de bloque o no manejarse bajo el capó. El equipo de desarrollo debe encontrar un equilibrio entre la facilidad de uso y la flexibilidad para los diseñadores. Algunas cosas deberían «simplemente funcionar» «fuera de la caja», otras deberían ser configurables caso por caso.

Este debería ser uno de los problemas más interesantes, complejos, frustrantes y gratificantes a resolver en el ciclo de WordPress 5.9. Para aquellos que buscan un desafío, este podría ser punto de entrada perfecto.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *