This is Dieter, a template for agencies and freelancers who are not afraid to stand out.
Top
que es wordpress gutenberg

Analizamos a fondo el nuevo Wordpress Gutenberg

 

Seguro que ya habrás oido la frase ‘El Proyecto Gutenberg’ que la comunidad WordPress nos lleva comunicando desde hace tiempo. Gutenberg es el futuro del Editor Visual de WordPress. Muchos pensamos que ya era hora de que cambiara. Si eres usuario de WordPress, debes ser consciente de lo que llega. Te va a dar unas nuevas sensaciones, muy interesantes, únicas y muy chulas para redactar tus artículos. Pero, de momento, no todo iba a ser bueno. Analicemos a fondo todos los cambios son buenos.

 

Matt Mullenweg anunció, en el último WordCamp, que quería que WordPress tuviera un nuevo enfoque a la hora de escribir. ¿El objetivo? Que agregar contenido a nuestro WordPress sea algo muy sencillo e intuitivo. ¿Hay algún problema con eso? Para algunos desarrolladores sí. Para mi, desde luego que no. Voy a explicarte qué es Gutenberg. Te hablaré de los pros y de los contras. De cómo instalarlo, probarlo y una reflexión final.

 

Matt Mullenweg (el fundador de WordPress) espera obtener 100.000 instalaciones activas #Wordpress Clic para tuitear

 

Ahora, vamos a echar un vistazo al nuevo editor de WordPress. Vamos a ver de dónde viene, qué pretenden con este revolucionario editor WordPress Gutenberg.

 

¿Qué es WordPress Gutenberg?

 

WordPress Gutenberg es nueva versión de WordPress que se encuentra en fase beta y a puntito de salir ya en 2018. Se ha utilizado ese nombre como homenaje a Johannes Gutenberg, que inventó la prensa con el tipo móvil hace más de 500 años, y supuso un antes y un después en la trasmisión del conocimiento. Sin duda alguna es una declaración de intenciones: simplificar para crear más y más fácil. ¡Bravo! El objetivo final es que redactar post sea mucho más fácil de manejar.

 

Es un cambio radical resumido en una frase: “lo que ves es lo que tienes”. No hay más.

 

WordPress introduce el concepto construcción por “Bloques”. Al igual que con cualquier cambio importante en WordPress, esto tendrá inevitablemente efectos en todo el mercado web WordPress. Sin duda esto supone un pequeño terremoto. Por eso te voy a acercar también cuáles son los efectos que ven los desarrolladores y las futuras compatibilidades, o en el peor de los casos, las incompatibilidades.

 

Gutenberg tiene un poco más de 2.000 instalaciones activas con más de 9.000 descargas #marketingdigital Clic para tuitear

 

Eso sí, nos vamos a asegurar de mantener esta publicación actualizada a medida que las mejoras y los cambios se producen

 

Pero, ¿cómo afectará Gutenberg al ecosistema WordPress? Si te apetece, puedes opinar, dejar comentarios e ideas en el foro de soporte de WordPress. También puedes unirte a las opiniones que tienen lugar en el famoso WordPress Slack.

 

Podéis echar también un vistazo a esta serie de videos de los chicos de Yoast:

 

 

Quizá te interese: «’Razones por las que elegir un diseñador WordPress’»

 

La creación de contenidos con WordPress Gutenberg

 

De todo lo que he visto, sin duda, la motivación principal es mejorar drásticamente la experiencia de los usuarios finales con la creación de contenidos en WordPress.

 

El editor de post que nos tiene acostumbrados WordPress se ha quedado francamente anticuado. De todas las posibilidades, Gutenberg tiene como objetivo ser el creador de contenidos del futuro para WordPress.

 

Tengo que ser honesto. Al principio era bastante escéptico sobre Gutenberg. Pero después de tantas pruebas, uno le está cogiendo el gustillo. De hecho, te olvidas de todo lo anterior. Ahora, ¡hasta me pone trabajar con el nuevo Gutenberg!

 

Muy intuitivo y fácil de usar

 

No te va a llevar mucho tiempo insertar un texto, una cabecera o una imagen. Es realmente fácil. No hay apenas distracción, ya que lo que vemos en pantalla es mucho vacío. Eso es muy bueno.

 

Vaya por delante que debes probarlo por ti mismo. Está disponible en wordpress.org, y es mejor que te lo instales en un sitio de pruebas. ¿Cómo? Es muy sencillo:

 

que es wordpress gutenberg

 

puedes descargar la última versión de Gutenberg buscándola en tu panel de Plugins de WordPress y “Añadir nuevo”. Una vez más, te recomiendo que lo instales en un sitio de prueba, no la vayas a liar porque puede provocar fallos. Recuerda que es Beta.

 

gutenberg

 

Nueva tecnología en Gutenberg

 

Gutenberg es un reemplazo a pantalla full de toda la zona de edición de posts. ¿Ampliable a otras secciones de la creación web? Para mi sería, sin duda, el camino.

 

¿Pero un cambio tan radical ayudará realmente a los usuarios o los sobrecargará? De manera lógica, si ayuda a los usuarios en su experiencia de edición de textos, debería ayudarles también a escribir mejor contenido. Mejor SEO, mejor posicionamiento, mejores resultados de búsqueda… Creo que ess una nueva y sencilla experiencia.

 

Compatibilidad con otros plugins

Esto sí que es harina de otro costal. Aquí hay verdadero pánico. Y con razón. Pero viendo lo que opina el creador de uno de los plugins más importantes para WordPress, se pasa un poco canguelo:

Joost de Valk, fundador del plugin utilizado por millones de páginas webs en todo el mundo, YOAST SEO, no tiene dudas:

 

“Nos encanta lo que Gutenberg significa para el futuro de WordPress. La nueva experiencia del editor viene con algunos conceptos nuevos alrededor de la experiencia editorial.

 

Un ejemplo de uno de los nuevos conceptos discutidos para implementar en Gutenberg es un flujo de trabajo de pre-publicación, que permite un paso intermedio entre el borrador y la publicación. Estamos pensando activamente en integrar nuestra vista previa de fragmentos de textos.

 

El concepto de “pequeños bloques” también permite una profunda optimización de la forma en que analizamos el contenido del post, ya que en lugar de analizar todo, podemos hacerlo bloque por bloque. Esto también significa dar retroalimentación a nivel de bloque.

 

En general, estamos entusiasmados con la oportunidad de reimaginar uno de los aspectos más importantes de nuestro plugin “.

 

Estamos a un paso de empezar a hacer las cosas muy bien. Intentar cumplir con las directrices que nos está marcando Google. Es decir: hacer que todo quede claro, limpio y útil para el usuario. 

 

Pros de WordPress Gutenberg

 

Entonces creo que es necesario que antes de nada, te deje algunas cosas buenas que vemos del nuevo editor Gutenberg de WordPress:

 

1- Es muy flexible. Mucho.

2- Intuitivo. Para los editores que prefieren la experiencia de edición de estilo más actual, es probable que les vaya encantar el editor de WordPress Gutenberg.

3- Usabilidad 100%.

4- Sin distracciones a la hora de escribir. Gutenberg te ofrece más espacio en la pantalla.

5- Los bloques son divertidos de usar. Se aprende en 1 minuto.

6- Ya funciona muy bien en el móvil. ¿Necesitas hacer una edición rápida en tu teléfono mientras está por la calle? No hay problema. Hasta ahora era un sufrimiento solo hacer login.

7- La implementación para la inserción de los archivos de medios está muy bien ejecutada.

8- Parece ser que se va a añadir una API para convertir a Word o nuestro Google Docs en bloques nativos de WordPress. Esto sería increíble. ¡Brutal! En este momento, la copia desde Google Docs a WordPress no funciona una mi***.

 

Contras de WordPress Gutenberg

 

Y aquí están algunos contras que vemos en el actual editor de Gutenberg. Recuerda, todavía está en la fase de pruebas, por lo que muchas de estas cosas probablemente desaparecerán, o no, quién sabe:

 

1- Tienes que hacer clic para alinear los bloques en las áreas de contenido, y a veces da problemas.

2- Gutenberg está considerando cambiar las cajas meta. Esto provocará que muchos plugins dejen de funcionar desde el segundo uno.

3- El uso del contenido insertado o incrustado parece desordenado.

4- No admite plugins como Yoast SEO (todavía). Esto por sí solo lo hace inútil en este momento. Joost de Valk, el desarrollador de Yoast SEO, planteó también su preocupación por la accesibilidad de Gutenberg. 

5- Debe incluir una hoja de estilo básica para controlar el diseño, ya que hay un montón de desarrolladores por ahí que hay que guiarles.

6- ¿Cómo se va a implementar cuando tengas un montón de plugins? ¿Aparecerán todos en el menú insertar? ¿Habrá muchos bloques? Puede ser un caos.

 

Yo creo que todo debe extenderse a la estandarización entre plataformas. Una experiencia de escritura más rápida y todo más cercano al front-end. ¿Por qué no hacer las cosas simples? Caramba, aún cuesta vender eso (si Steve Jobs levantara cabeza).

 

Cómo instalar Gutenberg

 

Vamos al pan. Es tan sencillo, que me da no sé qué explicarlo… Es como instalar un plugin normal. No reemplazan al editor de WordPress por defecto, lo cual es algo positivo en nuestra opinión. Está genial que durante la fase de pruebas te permita cambiar de uno a otro. A partir de la última versión, ahora también se admite en las páginas. ¡Ese es el camino que os nombraba antes!

 

instalando gutenberg wordpress

 

En tu barra de herramientas de WordPress (a la izquierda) tienes un acceso directo. Ahora, fíjate, puedes ver que el editor es absolutamente diferente. Es como un PageBuilder con mucho sentido, intuitivo y directo ¡sigue siendo brutal!

 

que es gutenberg wordpress

 

Personalemente creo que abre miles de oportunidades a los usuarios. WordPress Gutenberg está centrado en las publicaciones como objetivo final. Por ello, ¡Gutenberg va a ser un buen cambio amigos! Realmente se enfoca en lo de “escribir” y está tratando de crear un ambiente que no te distraiga, que ofrezcas “todo” a tus lectores a golpe de vista.

 

Quieren liderar (es evidente) el camino, el cambio hacia una magnífica Experiencia de Usuario (UX) cuando se trate de escribir artículos.

 

Cómo usar los nuevos Bloques de WordPress Gutenberg

 

Arrastrando y soltando las imágenes

 

Seguimos con la simplicidad. Ahora puedes arrastrar y soltar imágenes directamente en el bloque imagen. Esto es muy similar como cuando lo haces para añadir nuevos medios en tu biblioteca. De momento no nos ha dado ningún fallo y funciona igual. Lo brillante de esto es que lo puedes mover donde te de la gana.

 

Sí amigos, ahora todo se mueve. Olvídate de la ventanita en la que escribí este artículo. Ahora todo se mueve por tu pantalla y lo sitúas donde te da la gana. Se trata de añadir y quitar. De mover y ajustar.

 

añadir imagenes con gutenberg

 

Y mira qué bien porque nos da una opción para insertar nuestros propios estilos CSS, que auguran una buena compatibilidad con desarrolladores.

 

 

estilos css gutenberg wordpress

 

Añadiendo citas con Gutenberg

 

Por otro lado, ya sabemos que hemos estado utilizando las comillas para introducir citas. Bueno, pues olvídate. Ahora tienen una sección nueva para crearlas: “Bloque de citas”.

 

Con el editor WordPress Gutenberg (como ves a continuación), puedes añadir por el momento, dos tipos diferentes de citas. Puedes cambiar el tamaño de la fuente y el color. Eso lo puedes personalizar también.

 

También te dejan añadir al autor de la cita. Espero que te dejen hacer algo más, porque por el momento no es mucho más personalizable.

 

añadir citas con gutenberg wordpress

Añadir un Botón con WordPress Gutenberg

 

Esta sí es una importante novedad. Puedes insertar fácilmente un botón o un Call To Action, cosa que hasta ahora como no usaras un plugin de terceros no era posible. Esto facilita, y mucho, la libertad de generar enlaces por parte de los autores a otras páginas o enlaces internos y mejorar considerablemente el Link Juice de sus blogs.

 

nuevo boton con gutenberg wordpress

 

El Bloque Tablas

 

Las tablas son un contenido esencial a la hora de estructurar contenidos. Para Google son imprescindibles en la indexación de contenidos. Creo que WordPress Gutenberg está en el camino acertado por cómo lo han enfocado.

 

A ver si es posible que podamos dejar de usar plugins de terceros que ralentizan nuestras webs o incrustando códigos HTML.

 

Aquí están constantemente realizando cambios, por lo que no te desesperes si no las encuentras.

 

La sección Recientes

 

Esta es una magnífica opción que nos han creado en el editor Gutenberg. Nos facilita mucho la vida a la hora de añadir otros bloques que estemos utilizando constantemente. Esta muy bien.

bloques con gutenberg

 

Título

 

Seguimos con lo genial. Es mi opinión, pero me recuerda mucho a la manera de componer las Newsletters que utiliza MailChimp. Creo que ahí ha habido algo de inspiración (si lo copiaran aún más, no pasaría nada. ¿Qué opinas?). Puedes añadir tus títulos, cambiar el tamaño de la fuente, color… Genial, vamos.

 

añadir texto con gutenberg wordpress

 

 

Opciones de incrustación (embed videos)

 

Esto sí que me ha enamorado. Ya era hora de poder mover los videos incrustados en los artículos con una facilidad pasmosa.Wordpress Gutenberg hace la integración de contenido multimedia muy sencilla. Da igual de qué plataforma lo quieras hacer, funciona a la perfección: Youtube, SoundCloud, Vimeo… Todos los que quieras.

 

añadir video a wordpress gutenberg

 

Editor de texto de Gutenberg

 

Aquí está la chicha. Mientras que los usuarios y redactores estamos felices, ya te he mecionado que muchos de los autores de plugins están de los nervios. Sobre todo TinyMCE, que tendrá que reimaginar cómo se puede integrar su plugin en esta nueva interfaz.

 

La integración de Gutenberg con el resto

 

La cuestión es que Gutenberg se escribe de arriba a abajo con Javascript. La pregunta es: ¿cómo va Gutenberg a integrarse con el trabajo que han hecho todos los desarrolladores de plugins, widgets y demás?

 

Esperemos que los desarrolladores de Gutenberg se aseguren en que el integrar nuevos bloques, sea tan relativamente sencillo como integrar nuevos códigos cortos.  

 

En el editor de WordPress Gutenberg puedes hacer clic en “Settings” para quitar la barra lateral derecha. Para cambiar entre el modo de editor visual y el editor de texto (código), ahora hay una lista desplegable en la parte superior izquierda. Observarás que ahora hay comentarios HTML al principio y al final de cada bloque.

 

Esto permite crear los bloques directamente desde el modo de editor de texto. Sin embargo, también agrega mucho más desorden de lo que probablemente se utiliza si estás editando en este modo. No mola mucho escribir así, pero que sepáis que se puede cambiar la vista. (Ahí os dejo la captura).

 

editor de gutenberg

 

Lo mejor de todo, que de eso se trata, hay opciones de mover fácilmente cada bloque hacia arriba o hacia abajo con las flechas, borrarlo o ir a la configuración del bloque (ruedecita). Simple, sencillo y útil.

 

Reacciona súper rápido. Puedes utilizar Ctrl + Z también. Es perfecto.

 

bloques gutenberg wordpress

 

WordPress Gutenberg en el móvil

 

También nos sorprendió lo bien que funcionó usándolo en un móvil. Si necesitas insertar una imagen rápida o añadir un párrafo antes de publicar un post en tu móvil, parece que Gutenberg va a hacer que esto sea muy fácil.

Ya era hora. Está claro por dónde vamos. Aunque se reacciona tarde, estamos en un mundo con más móviles que personas 😉 Y hablando de Google ya sabéis la importancia que le está dando a la usabilidad móvil.

 

¿Qué pasa con TinyMCE?

 

Según lo que hemos hablado al principio, notarás que la barra de herramientas TinyMCE, a la que hemos estado acostumbrados a ver durante años, ya no existe en el nuevo WordPress Gutenberg. Ahora se reemplaza por un menú desplegable superiro que verás si haces clic en el botón “Insertar”. Bueno, parece que Gutenberg está tratando de despegarse de esta dependencia a TinyMCE. Hay mucha polémica con esto, y mucha discusión sobre qué incompatibilidades ofrecerá. Iré actualizándolo.

 

insertar bloques gutenberg

 

Gutenberg y los creadores de plugins

 

En términos generales, los autores de plugins se muestran optimistas, como vimos con el creador de Yoast. Están deseosos de ver cómo pueden sacar el máximo provecho de lo que Gutenberg puede ofrecer. Están convencidos de las facilidades que el comando Insertar les va a ofrecer.

 

Confiemos en la filosofía #Wordpress de compatibilidad 100% Clic para tuitear

 

Sin embargo, hay otros que mantienen una preocupación, ya que WordPress no les promete el nivel más alto de compatibilidad, como hasta ahora. Si falla la compatibilidad, ¿será eso un fracaso absoluto de Gutenberg? Sin duda sería la peor de las noticas para WordPress.

 

Conclusión

 

En general, estámos muy impresionados con el nuevo editor WordPress Gutenberg. Definitivamente es algo muy bueno para todos los amantes de WordPress.

 

Te animo a probarlo, ya mismo, en un sitio de pruebas. Se presenta una ocasión única para ayudar a construir el redactor de texto soñado. Te animo a colaborar con la comunidad WordPress. Podemos tener la misma experiencia que en el resto de programas favoritos, pero esta vez en nuestro CMS preferido. Es suficiente para estar contentos ¿no?

 

Además, ya sea por nosotros mismos, o por cómo ayudes a tus clientes a manejar su blog o web, es un cambio exponencial. Fuera miedos. Eso también es positivo, ya que muy pocos se echarán para atrás con algo tan sencillo de usar.

 

Además, Yoast SEO ya está funcionando a pleno rendimiento. Han creado una mega pantalla con sugerencias para tu escritura y SEO. ¡Todo son ventajas!

 

¿Has probado Gutenberg? Si es así, me encantaría escuchar tus pensamientos, tanto buenos, como malos.

 

Otras consideraciones

 

Acudí a la Wordcamp Madrid 2017 en Campus Madrid. Allí asistí al evento 2×1 sobre “Temas de WordPress” con Pablo López Mestre y Alejandro Sevilla. Escuché decir a Pablo López: “algo que es fácil, rápido y directo, significa que es una mierda, no tiene mucho trabajo y parece que se hace como churros” (eso dijo). Generando debate; que puedas crear webs rápidas, sencillas y fáciles de usar no significa que sean malas. Hacer las cosas fáciles no hace que sea cutre.

 

Amo pensar en ayudar a la gente. Facilitarles la vida. Que la tecnología no riña con el ser humano y, por ende, con su entorno. Centrarnos en la Tecnología Humanista es un camino necesario para mantener un equilibrio que, muchas veces perdemos. Hace mucha falta.

 

Hacer las cosas simples, bellas, útiles e intuitivas.

 

Te recomiendo un libro, si te interesa el asunto:

 

Libro para amantes de lo simple y UX: «’Don´t make me think’».

Leer relacionado: «’Diseño WordPress. Ay madre, por Dios! Qué es eso?»

 

Resumen
Fecha de revisión
Artículo revisado
▷ ¿Qué es WordPress Gutenberg? [2018] Con ejemplos y ¡A FONDO!
Clasificación del autor
51star1star1star1star1star