Qué necesitas saber sobre Gutenberg, el nuevo editor/constructor de WordPress

Qué es Gutenberg y para qué sirve

Gutenberg es, actualmente, un plugin desarrollado por voluntarios que añade un editor visual a los post y páginas de WordPress similar al de Medium. Pero esta es solo una fase, ya que este plugin se convertirá en el editor por defecto de WordPress cuando lance su versión 5, relegando el editor clásico a un segundo lugar optativo.

El proyecto Gutenberg avanza lento, debido a la resistencia de la comunidad a cambiar métodos de trabajo instaurados durante 10 años. Además, a esto hay que sumar que cuando Gutenberg se desarrolle por completo, será mucho más potente que la mayoría de editores de contenido de pago en el mercado (Divi, Elementor, Visual Composer…). Esto supondría una alternativa superior y gratuita a su modelo de negocio, cerrando su nicho de mercado.

A pesar de las críticas negativas que recibió al principio su versión beta, Gutenberg está escalando reputación en la comunidad, y muy pronto tendremos su versión desarrollada.

Que características tiene (en qué se diferencia del editor anterior

La principal diferencia entre Gutenberg y el editor WYSWYG de WordPress es la interpretación estructural del contenido: mientras con el editor clásico el contenido nunca ha dejado de ser un procesador de texto (hablando en plata, un documento de word); Gutenberg, interpreta cada elemento como un bloque, dando como resultando una apilación de bloques de párrafo, títulos, botones y cualquier otra cosa… y todo sin dejar de concentrarse en el contenido, lo que lo diferencia también de los famosos page builders.

Cada bloque de Gutenberg tiene sus propiedades y tiene controles de posición a su izquierda

 

Editor ClásicoGutenbergPage Builders (Divi, Elementor…)
Focus en el contenidoFocus en el contenidoFocus en la estructura
Sin control de la estructuraEstructura controlada y fácilmente editableEstructura controlada y fácilmente editable

 

De esta primera comparación podemos extraer que Gutenberg incorpora las mejores partes de los editores de esta década.

Otra característica de Gutenberg es que unifica (y más que va unificar) la forma en que personalizamos los elementos o bloques. Personalizar en Gutenberg no solo es intuitivo, sino que es extremadamente limpio en código (a diferencia de los page builders, que necesitan mucho código extra para contemplar todas las personalizaciones posibles). Merece la pena mencionar que Gutenberg tiene la intención de unificar estilos entre el editor y el resultado, de manera que cuando estemos editando tengamos la misma fuente, color, estructura y demás que cuando vemos el contenido publicado.

Editando un texto con colores y tamaños de letra personalizados desde el tema

 

Pero la característica más impresionante a nivel de diseño son las herramientas de Gutenberg para mantener la estética de la web. Como sabemos, a veces es complicado que algo quede tan bien como si estuviera recién diseñado, por no hablar de que copiar y pegar código a veces no funciona. Con Gutenberg, el usuario tiene la oportunidad de diseñar un bloque, por ejemplo, un banner promocional de un curso, y guardarlo como bloque recurrente. Y ya estaría, ahora puede pegar ese bloque en la página o post que necesite.

Cómo añadir bloques reutilizables a Gutenberg

 

Y eso no es todo, en las ‘tripas” de Gutenberg hay herramientas interesantes para los creadores de web como la posibilidad de crear una paleta de colores con nombre personalizados desde el tema, de manera que el cliente pueda usarlos (incluso es posible desactivar el personalizador de color para que el cliente no haga de las suyas y esté obligado a usar los colores del tema).

Comparativa entre Gutenberg y los demás constructores (de forma simple)

Ahora que hemos hablado un poco por encima del tema, veamos esta comparativa breve con más datos. Si necesitas entender algo más a fondo, te contestaremos en los comentarios a lo que necesites.

Editor ClásicoGutenbergPage Builders (Divi, Elementor…)
Focus en el contenidoFocus en el contenidoFocus en la estructura
Sin control de la estructuraEstructura controlada y fácilmente editableEstructura controlada y fácilmente editable
Elementos HTML como unidad de contenidoBloques como unidad de contenidoWidgets o formatos propios como unidad de contenido
Editor básico de enlaces y medios + barra de herramientasEdición rápida, limpia y uniforme de los bloquesEdición pesada, con cientos de posibilidades, lo que implica diseño poco controlado.
Visualización del contenido en modo hoja de word.Visualización del contenido como cuando se publica, incluyendo estructura, tamaños y colores.Visualización de grid o estructura con cajas clicables con contenido dentro
Poco o inexistente soporte para colores y tamañosSoporte para colores personalizadosSoporte para colores y opciones generales solo en versión PRO
Contenido no reutilizableSoporte para guardar bloques favoritos para copiarlos de nuevo donde necesitesSoporte para guardar bloques favoritos para copiarlos de nuevo donde necesites
GratisGratisGratis pero mejorable

Cómo sé si debería utilizar Gutenberg

La mayoría de las webs profesionales usan page builders para solventar la carencia del editor clásico de crear estructuras responsive. Así que para saber si debes usar o no Gutenberg debemos partir de este punto. En este momento, Gutenberg es un bebé lleno de posibilidades y no puede competir abiertamente contra empresas privadas dedicadas a mejorar la edición de contenido en WordPress. Por este motivo, y por que seguramente ya has aprendido a manejar tus contenidos con tu constructor, tal vez deberías pasar un poco del tema.

Básicamente: Si no necesitas todo esto, ve probando Gutenberg

 

Pero si eres una persona con visión, y sobre todo, con previsión, no le quitarás un ojo de encima. El cambio que va a suponer Gutenberg va a ser mucho más profundo en WordPress de lo que te imaginas, y es que los planes ambiciosos pasan por expandir sus capacidades a las plantillas de página y las zonas de widgets hasta los menú, la cabecera y el footer. Es decir, llegará un punto en el que la gente no dirá “Web en WordPress” sino que dirá “Web en Gutenberg”. Se habla incluso del momento en que los widgets y los shortcodes desaparezcan junto a los temas.

Pros y contras (para alguien que se crea/autogestiona su propia web)

Para terminar de decidirnos sobre si adoptamos al pequeño Gutenberg o lo dejamos que crezca un poco más, vamos a hacer una lista de pros y contras:

ProsContras
Editar contenido es una pasadaSigue en beta, todo puede cambiar
Reúne en poco espacio lo que antes andábamos buscando por toda la pantalla en opciones escondidas o por desplegarCada día se descubren nuevos fallos que se van solucionando lentamente por la poca (aún) popularidad en la comunidad
Trabajo con bloques reposicionables que se crean automáticamente al pegar el todo el contenidoNo se pueden crear estructuras muy complejas todavía
Aumenta la cantidad de herramientas del editor clásico como: creador de títulos, letras capitales, espaciadores, testimonios, galerías, imagen con texto encima…
Diseño limpio e inteligente que te recomienda las herramientas que más te gusta usar.
Poderosa herramienta de incrustación de elementos externos como youtube, vimeo, etc…
Comunidad incipiente de desarrolladores de plugins de Gutenberg que añaden nuevos bloques mucho más perfeccionados

 

Ahora, solo me queda preguntarte ¿Has probado Gutenberg? ¿Te gusta? Si no lo has hecho ¿Hay algo que te gustaría saber antes de empezar que no hayas visto en este post? Somos todo oídos!

Cómo adaptar tu negocio digital a la nueva RGPD

Cómo adaptar tu negocio digital a la nueva RGPD

Recopilamos todo lo que hemos estudiado para nosotros y te lo regalamos.