«Y Gutenberg llegó a nuestras vidas, y la noche se hizo»
No sé tú, pero yo sí que añadiría algo así a las sacras escrituras del marketing digital.
¿No sabes de quién te hablo? No te preocupes, que te lo explico enseguida.
Pero antes, al tema: quiero señalarte algunas cosas que conviene que tengas en cuenta cuando subas tus posts a tu blog, siempre y cuando trabajes en un entorno WordPress.
¿Por qué?
Porque, como en otras ocasiones en mi blog, me gusta escribir sobre cosas que me hubiera venido bien leer cuando yo empecé en esto.
Venga, basta de prolegómenos, que estoy escribiendo este post en pleno mes de agosto en Valencia y no es para desperdiciar el tiempo.
Te voy a hablar de...
Por qué yo, un copy, hablo sobre maquetar en WordPress
Cuando me solicitan presupuestos de redacción de contenidos turísticos siempre doy la opción de ser yo quien suba el post a WordPress.
Más o menos me manejo en ese entorno, ya que además de para ellos lo he hecho durante años para mí mismo, y creo que se te pueden estar pasando por alto algunas cosas que conviene saber.
Además, ojo a estos puntos, tenlos en cuenta:
- No soy diseñador.
- No soy consultor SEO (era hace ya tiempo).
- Desde hace muy pocos meses coexistimos con el amigo Gutenberg, de quien te tengo que hablar.
- No te voy a hacer un manual; solo te voy a señalar cosas que creo que podría venirte bien saber.
- Todo lo que te voy a decir es completamente subjetivo. Muy probablemente haya otra forma de hacer algunas cosas, pero yo voy a escribir esto desde mi experiencia.
¿Quién es Gutenberg?
Más que un quién, Gutenberg es un qué.
Si fuera persona diríamos que un cabrón, pero se trata de una forma nueva de maquetar los posts en WordPress.
Cuando escuches que una web tiene Gutenberg significa que su editor de contenidos ha cambiado con respecto a lo que teníamos hace unos pocos meses.
Bajo mi punto de vista para mal, pero eso solo lo confirmará o desmentirá el tiempo.
Gutenberg es un sistema de maquetación de contenidos por bloques.
Vas añadiendo un bloque debajo del otro, dotándolo de la naturaleza que tú quieras: bloques de texto, imágenes, listas… Hay de todo.
Ese conjunto de bloques, cuando lo ves maquetado, es el resultado final del post.
9 cosas a tener en cuenta
Ahora sí: vamos con esas nueve cosas que quería que vieras.
#1 La famosa cajita del Yoast
Cuando estemos maquetando nuestro post, ya al final, tras todo el contenido, te aparecerá la cajita de Yoast.
Yoast es un plugin que te ayuda a trabajar el SEO de tu web. Hay otros como Rank Math o SEO All in one que te hacen cosas similares, pero este te diría que es el más utilizado.
Nosotros, que no somos consultores SEO, le vamos a sacar partido de varias maneras. Fíjate en lo que está en color amarillo:
- Title, meta description: te deja escribir los de cada post. Si dejas todo en blanco, se rellenarán solos. Úsalos. Aquí te cuento cómo.
- URL: la URL de tu post. No lo dejes en blanco y escribe algo. El campo se llama «Slug».
- Puedes previsualizar cómo se vería en Google tu post. Aquí te interesa que no salga cortado. Y ojo, que puedes ver la versión móvil o la de PC. Quédate con la versión móvil y procura que ni title y ni meta description salgan cortadas.
Esto era lo básico de Yoast, pero hay alguna cosa más que quiero que veas. Si bajamos y vamos a la pestaña de Avanzado:
- Si en el desplegable de permitir a los motores mostrar la entrada en los resultados eligieras No, Google no indexaría ese post. Es decir, no lo mostraría nunca en los resultados. Sería un post que solo podría ser encontrado siendo enlazado desde otro sitio o accediendo directamente en la URL, pero nunca desde Google. Esto suele pasar cuando un SEO se pone a los mandos y se pone a limpiar canibalizaciones.
- Lo de seguir los enlaces es para decirle a Google que por defecto sus arañas hagan caso a los links de tu post. Si marcaras que no, Google entraría en tu post y se iría, sin visitar aquellos que hayas linkado. Nuevamente cosas de SEO, pero está bien que sepas que esto existe.
Y finalmente:
- No rellenes nunca la Frase clave objetivo
Pongas lo que pongas ahí Yoast solo lo va a utilizar para el análisis interno, así que olvídate. Renuncia a las bolas de color verde de la lista de posts, pues no sirven para absolutamente NADA.
O peor: te confunden y te estresan si no consigues hacer que la bolita esté de color verde.
#2 Las categorías
Las categorías en WordPress.
Lo lógico sería que tuvieras los artículos de tu blog asignados a una categoría u otra.
Pues a la derecha, en el sidebar de la página de maquetación, es donde puedes elegir la de cada post:
Esas categorías se indexan.
Es decir, los posts que vayas agregando a esas categorías salen listados en la página de la categoría, que suele ser algo tipo miweb.com/category/copywriting.
Pues esa página puede posicionar, así que elige categorías distintas y escribe sobre todas ellas en la medida de lo posible.
Puedes elegir dos categorías para el mismo post, por cierto. Es común. Yo, por ejemplo, si escribo sobre redacción SEO, ¿cuál pongo? ¿SEO o redacción? ¡Las dos!
#3 Etiquetas o tags
Aquí quizá tengas la tentación de poner cosas a lo loco, sin pensar.
Mira, de las etiquetas tienes que tener en cuenta dos cosas:
- Si no tienes un gran dominio del SEO, impide que se indexen. Lo puedes hacer desde el menú de la izquierda, SEO – Apariencia en el buscador – Pestaña Taxonomías – y poner que No a las etiquetas o post_tag.
- Que no se indexen no quiere decir que no sean útiles. Utilízalas para relacionar posts entre sí y para facilitar la búsqueda interna que un usuario pueda hacer en tu web. Yo, por ejemplo, uso tags en función de mi Buyer Persona. No pongas más de 2-3 por post o cuando lleves 50 artículos publicados te perderás.
#4 Tamaño del ancho del contenido
¿No te ha pasado nunca que has llegado a una web donde el contenido iba de un extremo de la pantalla al otro y has dicho «¡uf, qué pereza!»?
Los contenidos, con márgenes a los lados, mejor.
Mira el mío: tiene 800 px de ancho.
Para elegir cómo se visualiza cada post tienes esta opción, en la parte de abajo del sidebar:
Esto te diría, sin saberlo, que es cosa de Elementor. Elementor es el constructor que utilizó mi diseñadora web para hacer la mía.
No sé si tú lo tendrás igual o no, pero que sepas que estas cosas se pueden controlar.
Aquí puedes decir que haya una sidebar a la izquierda, otra a la derecha, que no haya, que solo haya a un lado…
Yo decidí dejar de forma predeterminada mis posts sin barras laterales y solo utilizar una sidebar en mi página genérica del blog, donde pongo algún link de afiliado y permito que el usuario busque y seleccione las categorías que uso.
#5 Las imágenes
Un auténtico quebradero de cabeza, la verdad.
Con las imágenes en Gutenberg hay un gran problema: si no pones una imagen con un ancho igual o más amplio que la caja de contenido de la que hemos hablado en el punto #4, cuando visualizas el post y le pones un borde a la imagen con CSS, el borde se sale hasta el ancho de la imagen:
Un horror, solo apreciable en versión desktop. En tu smartphone no lo notarás, pues el ancho de la imagen es mayor que el de tu pantalla.
Tras dar con una solución puedo decirte que invertiría cosa de 10-12 horas en intentar resolverlo. Te la cuento enseguida.
Pero antes, ¿qué debes saber de una imagen que subes a WordPress?
Ya te hablé de cómo optimizar imágenes de principio a fin, pero vamos a hacer un repasito breve:
El texto alt o alternativo es lo que lee Google cuando escanea esa imagen. Si en la imagen sale una habitación de hotel lo lógico es que el alt fuera alto tipo «Habitación Doble del Hotel Joan Marco».
Ojo, ese texto alt cuenta para el SEO así que si puedes poner palabras clave, mucho mejor.
En el tamaño de la imagen puedes elegir un predefinido, o personalizarlo abajo. Es una tontería. Como te dije en su momento, nunca subas imágenes de un tamaño superior al que se van a visualizar en la web. Deja siempre «Tamaño completo» en ese campo.
El último campo es interesante, pues te permite elegir qué pasa cuando alguien hace clic en esa foto. ¿Ir a otra página? ¿Hacer grande la fotografía? ¿Nada de nada?
#6 El salvavidas
Como te decía, Gutenberg es un sistema de bloques. Vas añadiendo bloques, del tipo que sean, se apilan y conforman el post.
Pues bien: uno de esos bloques es el Clásico, que no es otro que el antiguo editor de WordPress.
Fíjate en la imagen. Es exactamente la misma que he añadido hace unas líneas, pero esta vez se visualiza correctamente.
¿Por qué?
Porque he usado el salvavidas: la he introducido en un bloque de clásico. De este modo, además, he podido escribirle el atributo title. Te lo cuento luego.
Si Gutenberg en general te da por saco, pon un bloque clásico y mete TODO tu post ahí, que se visualizará bien.
Espero que esta opción dure mucho, la verdad.
#7 Imágenes – Parte II
El salvavidas o bloque de Clásico trae consigo un atributo de las imágenes que parece haberse perdido con el maldito Gutenberg.
Mira, si incluyes una imagen en un bloque clásico y le das a editar, ya no te sale la barra que te he pegado antes. Te sale el cuadro antiguo.
El cuadro antiguo se ve así:
Este viejo cuadro, que era de lo mejorcito, te da todo lo que te daba el que hay ahora y además, te dejaba rellenar el atributo title de la imagen.
Como puedes leer ahí, el title de una imagen es el cuadradito que sale encima de una imagen al pasarle el ratón por encima.
Me parece un error mayúsculo que esto se haya perdido. A ver si rectifican.
Hasta entonces, si quieres usar los titles en las imágenes, tendrás que introducirlas en tu post con un bloque de clásico.
#8 Los enlaces en Gutenberg
Los han hecho más sencillitos.
El detalle que quiero que veas es que puedes elegir dónde abrir esa página destino: si en la misma pestaña de navegación (es decir, el usuario saldría del post) o en una pestaña nueva.
Particularmente te recomiendo que se abran siempre en una pestaña nueva.
#9 No pierdas el tiempo con listas
Otra cosa algo molesta que Gutenberg no soluciona.
La manejabilidad de los bullet points o listas es pésima.
No puedes jugar con los estilos entre unos elementos y otros, no puedes escribir contenido normal entre un punto y otro… En fin, un auténtico desastre.
Evita las listas complejas. O las listas, directamente, y si añades una que sea solo para poner una breve explicación en cada punto, ya que no puedes moverte con libertad.
De hacer listas con encabezados ni hablamos.
A maquetar se ha dicho
Hasta aquí el post de este calurosísimo mes de agosto.
No es una guía para maquetar un post en WordPress, pero sí que espero haberte descubierto y aclarado algunos puntos.
El del editor clásico es el mejor, ¡y lo sabes!
Si conoces algún truquito o cosa que merezca ser contada que se me haya escapado, estaré encantado de leerte en los comentarios 🙂
8 respuestas
¡Hola, Joan! Un post diferente pero muy interesante. 😊
El punto 6 es la leche. Yo en vez de Elementor uso Visual Composer y en la parte de arriba hay una opción para volver al editor antiguo que se llama WPBakery Page Builder.
En cuanto a las listas, si quiero poner alguna, en vez de usar la opción que da WordPress, suelo poner un emoji en forma de diamante azul delante de cada párrafo de la lista y le pongo un poco de sangría. De esa manera, tengo más libertad.
¡Hola, Juan!
El salvavidas es la caña, sí. Hay otros métodos, como el que comentas o el de instalar plugins que te muestren el editor antiguo, pero para el que quiera ir «Gutenberguizándose» como que no va nada mal. En serio, yo pongo bordes a mis imágenes y vaya horror hasta que lo descubrí.
Lo de las listas tengo que probarlo, pero no es mala idea. Las numéricas yo no podría hacerlas porque eso que dices no marca el índice pero si solo son bullet points, de cabeza.
¡Gracias por pasarte!
¡Hola Joan!
Gracias por este artículo, estoy a punto de lanzar mi web y mi blog. Y esto de SEO me pone nerviosa y hasta con mareo.
Sin embargo, gracias a tus artículos me he ubicado en el terreno y siento que he aprendido un montón.
¡Muchas gracias!
Hola Zindy,
jo, acabo de ver este comentario. ¡Perdona la tardanza!
Me alegro de que te ayude. ¿Cómo la llevas? ¿La tienes terminada ya?
Hola Joan!
La verdad que en las ultimas webs que he realizado directamente he deshabilitado Gutenberg con algún plugin porque me pone muy nervioso, ya que estoy acostumbrado a elementor
He visto que nombras el plugin de Rank Math para SEO, lo has probado? y si es asi ¿Que te parece?
Muchas Gracias por el post
Un saludo
Hola Álex,
sí sí, lo de Gutenberg es para tirarse de los pelos. Mira que le están metiendo mejoras eh, pero a mí sigue sin convencerme. Imagino que antes o después nos acostumbraremos.
El de Rank Math lo vi en un site que apenas toco, pero no me pareció malo. Ligerito, la verdad, con lo básico. Pero bueno, elegiría igualmente el Yoast, que tiene todo lo que le pido yo a un plugin de SEO.
¡Gracias por el comentario!
Greetings! Very useful advice in this particular article!
It’s the little changes that make the greatest changes.
Tanks for sharing!
Here is my web site: deneme bonusu
Antalya Alanya to Airport Transfer Services