124 | Cómo usar GIFs en WordPress (eficientemente)

En el episodio 124 de WordPress semanal hablamos de los gifs en WordPress y cómo un uso correcto de ellos puede aportar calidad a tus contenidos y beneficiar tus números. Vamos allá. Hola, hola, Soy Gonzalo, de GonzaloNavarro. Es y bienvenidos a WordPress Semanal, el podcast en el que aprendes WordPress de principio a fin. Porque ya lo sabes, no hay mayor satisfacción ni mejor inversión que la de crear y gestionar tu propia web con WordPress. Y hoy hablamos de una parte de esa gestión de tu web que tiene que ver con los contenidos. Porque vamos a hablar de cómo usar los gifs. Ya sabéis que son estas imágenes en movimiento, cómo usarlas correctamente en tu web, qué te pueden aportar, cómo los puedes crear, para qué tipos de contenido yo te los aconsejaría. En fin, va a ser un episodio muy facilito de de digerir ahora que estamos terminando agosto, así que espero que lo disfrutes. Y antes de adentrarnos de lleno tanto en el plugin de la semana como en el tema central, vamos a ver qué novedades hay en mi web esta semana. ¿Qué novedades hay en GonzaloNabarro? ¿Es? Pues como cada semana, ya sabéis, todos los martes saco un nuevo vídeo de la Zona Código. Y la Zona Código no es más que una de las cosas que obtienes por ser suscriptor. ¿Y en qué consiste? Pues son vídeos semanales en los que te enseño a modificar tu web, a mejorarla, a cambiar cosas sin utilizar plugins. Todo lo hacemos por código. Y además no tienes que saber código, simplemente tienes que hacerlo, seguir el vídeo, copiar el código que te dejo y pegarlo donde te digo que lo pegues. Y además, de paso por el camino, pues vas aprendiendo código, aunque al principio no supieras. Vale, entonces esta semana el vídeo que tenemos es cómo excluir una categoría de productos de la tienda de WooCommerce. Porque ya introduje la semana pasada un vídeo de la Zona Código en el que os explicaba cómo Editar código para WooCommerce enfocado a tiendas online. Y ahora que ya sabemos hacer eso, pues ahora ya sí empezaremos poco a poco a ver también en los vídeos de la Zona Código, pues eso, cómo editar tiendas online hechas con WooCommerce. Por supuesto lo iré intercalando con ediciones o personalizaciones en general para WordPress que no tienen por qué siempre ser para WooCommerce. Entonces este es el vídeo nuevo que tenéis y en el que básicamente vas a aprender a hacer que no se muestren los productos de una categoría en la página de tienda, porque puede ser que una categoría determinada no te interese mostrarla en ese momento en la tienda. Y lo hacemos porque por código, con un par de líneas de código súper súper sencillas. Y en cuanto a los cursos, pues este mes estamos con el curso de creación de tiendas online con Storefront, que pues estos dos temas casan mucho porque ya sabéis que Storefront es uno de los mejores teams que existen para crear tiendas online con WooCommerce en este caso. Y ya a final de mes, que ya estamos a final de mes cuando sale este episodio, pero en un par de días, a finales de esta semana estará disponible también el nuevo curso que es el curso de Child Themes para WordPress. Y no simplemente Child Themes que es lo que pues todo el mundo nos recomienda cuando tenemos una web, cuando la creamos, hacer un Child Theme pues por si hacemos alguna modificación no perder nada. En este caso este curso está enfocado a crear un Child Theme para modificar por completo si quieres o poder hacer todas las modificaciones que quieras a una web y que sea totalmente distinta de la original. Así que ya es un paso digamos intermedio hacia convertirte en un creador de páginas web o en un desarrollador. Es un curso que me habéis pedido mucho y que sé que os va a encantar, pero eso ya lo comentaré la semana que viene en el próximo episodio. Ahora vamos a saltar ya al plugin de la semana que es para impedir acceso al escritorio de WordPress. Este plugin se llama Remove Dashboard Access y conseguirás bloquear el acceso a la parte de administración de WordPress aquellos roles de usuario que tú elijas. ¿Concretamente esto es lo que destaca el plugin en su página, que puedes hacer? Uno, vas a poder limitar el acceso al escritorio solo administradores, lo vas a poder limitar a administradores y editores o a administradores, editores y autores o incluso a usuarios con capacidades concretas, por si tú tienes pues un rol de usuario que has creado a medida, pues los puedes limitar el acceso según capacidades en lugar de según roles de usuario. Ya sabéis que cada rol de usuario, administrador, suscriptor, editor o lo que sea, tiene unas capacidades concretas. Capabilities, que se suele decir en inglés, este concepto, pues esa es una de sus opciones. ¿Qué más? Puedes elegir la URL a la que se redireccionará al usuario sin permiso. Es decir, si yo tengo en mi web un editor y yo el editor no le quiero dar acceso a la parte de administración, solo quiero que vea la parte frontal de la web cuando acceda, ponga su usuario y contraseña para acceder a la web. ¿A qué URL le quiero mandar en lugar de al escritorio, en lugar de al panel de administración? Pues esto lo puedes elegir. También opcionalmente puedes conceder acceso al perfil de usuario, es decir, que no puede ir al escritorio, pero que sí pueda ir a editar su perfil, ahí podrá editar sus datos y demás. Y también opcionalmente puedes mostrar un mensaje en la pantalla de inicio de sesión. Básicamente, si tienes una web de suscripción o trabajas con colaboradores, sea cual sea el tipo de web que tengas, entonces este plugin debes tenerlo muy en cuenta, ¿Vale? Yo lo suelo utilizar en las webs que hago y la utilizo también en la mía, sí. Y ahora ya sí, vamos con el tema central del programa. GIFs en WordPress. ¿Cómo usarlos en tu web? Bien, vamos a empezar por definir qué es un GIF exactamente y los beneficios de utilizarlo. Esto de qué es un GIF casi todo el mundo lo sabréis, básicamente es una imagen en movimiento. Estáis hartos de verla en redes sociales, en Facebook, en Twitter, simplemente pues un gatito moviéndose o un famoso riéndose, alguien diciendo algo gracioso. Sí, bueno, todo el mundo seguramente sabéis lo que es un GIF, pero ¿Qué beneficios tiene usarlo, digamos, en tus contenidos, en, por ejemplo, un tutorial de tu blog o un post o una noticia que publiques? Pues bueno, en primer lugar es contenido multimedia, ya sabemos que a Google le gusta que combinemos nuestros textos con contenidos multimedia, como puede ser una imagen o un vídeo. Pero En este caso, GIFs, ¿Por qué no utilizar GIFs? ¿Qué beneficios tiene? Bueno, por lo general cargan más rápidamente que los vídeos, básicamente porque son más cortos o deberían ser más cortos que los vídeos. Y además atraen la atención porque primero se empieza a reproducir solo y segundo, está en bucle, con lo cual siempre llama la atención, aunque estemos ya muy acostumbrados a verlo, siguen llamando la atención aunque. Así que elegir el GIF correcto puede ser la diferencia entre que un lector se quede o se vaya con lo cual si retienes lectores, esto es bueno para tu web, es bueno para tu negocio, es bueno para el SEO, es bueno para todo. Sí, bueno, esto es creo algo súper básico, vamos a ir adentrándonos un poco más en algo más interesante, más complejo. ¿Cuál es la mejor forma, siempre según mi opinión, de utilizar GIF? Estamos acostumbrados, como te he dicho antes, a ver pues que gifs de gatitos, de borrachos, de escenas famosas, de películas, el típico de Zag Life, que se les pone unas gafas de sol y todo el mundo empieza. Bueno, los típicos. Pues esto no es el único tipo de gif que puedes usar y quiero que te quites un poquito de la cabeza este concepto, porque todos cuando pensamos gif nos viene eso a la mente. ¿Pero por ejemplo, escribes tutoriales, pues por qué no acompañarlos de gifs explicativos? Es decir, en lugar de mostrar una imagen simplemente que no se mueve, que no, que no dice nada, que es una simple captura, pues en lugar de eso, ¿Por qué no mostrar un gif? Es decir, ¿Por qué no mostrar el proceso de ese tutorial en movimiento? Así que para tutoriales sería ideal, pero también para dar instrucciones si tienes algún servicio y quieres explicar bien en qué consiste o qué va a aportar ese servicio, siempre y cuando puedas mostrarlo con un gif claro, o para mostrar cómo funciona algún producto tuyo. Para todo esto es fantástico. Y a lo mejor si lo hicieses por capturas de imágenes, pues necesitas 20 capturas y sin embargo con un GIF o con dos o con tres, pues lo tendrías. Y además queda mucho más claro está viendo la persona que esté leyendo o que esté viendo tu tutorial, está viendo el proceso tal cual es. Os voy a dejar un enlace a uno de mis tutoriales. No utilizo muchísimos gifs, pero cuando son necesarios sí que me gusta utilizarlo. Así que os dejo uno de mis tutoriales, creo que es el de optimizar imágenes en WordPress y ahí utilizo tanto capturas de pantalla como gifs, que también os aconsejo combinarlos, no llenar todo de gif, sino que vayáis combinando capturas, incluso algún vídeo si queréis. Y luego otra forma interesante en la que podéis utilizar gifs es para CTAs, para llamadas a la acción. Siempre queremos que nuestros CTA donde queremos que la gente vaya, donde queremos que la gente haga clic o queremos que una persona tome una acción, siempre intentamos que destaque, le ponemos un botón con un color rojo fuerte o lo ponemos en una parte prominente de la web, ¿Por qué no atraer a la gente a ese lugar con un gif, con esa imagen en movimiento que tanto nos atrae a todos? Se puede utilizar ahí también, por supuesto, para publicaciones en redes sociales. Tú puedes poner, por ejemplo, una imagen destacada en tu post, como yo he hecho para este episodio del podcast, pues puedes poner que la imagen destacada sea un gif y luego cuando lo publicas en Twitter o en Facebook, pues va a aparecer el gif o si no quieres ponerlo específicamente en la imagen destacada de tu web, lo puedes poner con el plugin de Yoast en la parte de social, lo puedes poner solo para las redes sociales que consideres y dejar para tu web una imagen estática como imagen destacada. Estos son usos que más allá de lo típico, el concepto que solemos tener de gifs y que te pueden aportar muchísimo en cuanto a calidad y en cuanto, como decía al principio del todo, las estadísticas, los números de tu web, puedes mejorar gracias a los gifs. Entonces, esto es cómo usarlos o cuál sería, según mi opinión, la mejor forma de utilizarlos en tu web o en tu estrategia de contenidos. Pero ¿Qué pasa? ¿Cómo se añaden? Es decir, ¿Cómo hacemos esto técnicamente? Bueno, es muy fácil, lo puedes subir a WordPress de forma normal, un gif que tengas en tu ordenador, tal y como harías con una imagen, es decir, le das a añadir objeto o lo subes a la librería multimedia, os dejo un enlace del curso de WordPress básico en el que vemos todo esto, y ya está, y lo pones como si fuese una imagen. Pero también tienes la opción, si no quieres tenerlo en tu web, de incrustarlos, como por ejemplo harías con un vídeo en YouTube, el típico embed que se dice en inglés. Hay un montón por ahí de webs de gifs como Giphy, que es la más famosa, pues tú puedes coger el código y pegarlo en tu web y ya lo incrustarías y estaría en el servidor de Giphy en lugar de estar en tu web alojado, ¿Vale? Pero vamos, que los puedes subir a tu web sin problemas, siempre y cuando, pues yo que sé, no subas miles, ¿Vale? Después hablaremos de todas formas de cómo optimizar todo esto. Y luego también tienes algunos plugins que te dan funcionalidades extra, como por ejemplo Giphypress, que precisamente usa esta web, la de Giphy, para que tú desde tu WordPress, desde la página de edición de las entradas, puedas buscar ahí mismo los gifs que te gusten, que no tienes por qué haberlos creado tú, buscarlos por ahí e incrustarlos, insertarlos directamente. Así te ahorras tener que ir a la web de Giphy, buscarlos ahí, copiar el código, incrustarlos, tal. Si es algo que vas a utilizar bastante, pues este plugin te viene muy bien porque ya lo tienes ahí en tu web, ya lo tienes implementado y no tienes que salir cada vez que quieras utilizar un gif. Antes había, bueno, hay más plugins, pero hay muchos que están súper desactualizados porque antes WordPress no soportaba los gifs y entonces salieron varios plugins que te permitían hacer muchas cosas. Ahora hay muy pocos plugins que estén actualizados y que se mantengan todavía, pero este de Giphypress, sí bien esto si quieres buscar gifs por ahí, si quieres utilizar cosas que ya existen. Pero ¿Qué pasa si quieres crear gifs rápidamente? Pues por ejemplo, para hacer tus tutoriales, como habíamos comentado antes, para instrucciones que quieras dar a tu audiencia o para tu servicio, para lo que sea. Pues igual que muchas veces hacemos capturas de pantalla con alguna extensión de Chrome o con algún software que tengas instalado en tu ordenador, puedes hacer lo propio y buscar un programa para hacer gifs con esa misma captura de pantalla, pues lo que haces es un pequeño vídeo y lo puedes convertir a un gif. Esto hay extensiones de Chrome que lo hacen, pero yo te recomiendo más un programa, ¿Vale? Porque si usas una extensión de Chrome o de Firefox, que es lo mismo, depende del navegador que uses, pero si usas una extensión estás limitado a hacer las capturas o los gifs solo de lo que veas por Internet, mientras que si lo tienes en tu ordenador como software, como programa, puedes hacer gifs de lo que quieras. Así que yo te aconsejo más que lo instales en tu ordenador de forma normal. Yo uso por ejemplo Recorded, que os dejo el enlace, y que está disponible tanto para Mac como para Windows y es gratuito y está súper bien. Puedes elegir que se quede en formato vídeo o puedes elegir que se quede en formato gif. La verdad que es una app fantástica, que yo utilizo bastante. Y luego también puedes utilizar tus propios GIF reutilizando otros que ya existen y esto lo puedes hacer por ejemplo en la web de Giphy que tienen, te dejo el enlace, tienen un se llama gifmaker, no se han comido mucho la cabeza con el nombre, mejor así, sencillo. Y ahí pues puedes subir tus propias fotos y demás para hacer tu propio gif o puedes elegir gifs que ya hay en Giphy y añadirle cosas, que también está bien pues si quieres, yo que sé, coger uno de esos gifs famosos para llamar la atención de la gente y luego meterle pues algo específico tuyo. No tienes demasiado control porque no puedes editar el que ya existe, pero bueno, está bien para determinadas cosas. Bien, tenemos beneficios de usar los gifs, tenemos ejemplos de uso, tenemos cómo añadirlos técnicamente, tenemos cómo crearlos, como puedes crear los tuyos propios y por último te quiero dar algunos consejos para que sean óptimos y que no mermen el rendimiento de tu web, que esto también es un aspecto que siempre hay que tener en cuenta. Entonces, algunos consejos según mi experiencia, tampoco es que haya aquí nada establecido, sino un poquito de sentido común. Primero, no grabes la pantalla entera si no es necesario porque te va a quedar un gif enorme, ¿Vale? Al final no dejan de ser vídeos y que además se empiezan a reproducir solos, con lo cual si no es necesario, no lo hagas grande. Siempre puedes con estas herramientas que te digo, tanto si lo haces con un navegador o lo haces con una app que tengas instalada, puedes elegir la zona en la que quieras capturar ese gif. Entonces si vas a a capturar una ventana del navegador, haz la pequeñita en lugar de trabajar con el ordenador completo y selecciona esa zona, esa área. También no los hagas muy largos porque eso ya sería un vídeo. Para eso haces un vídeo. Los gifs por naturaleza son cortos, la gente espera que sean cortos, si te pasas, pues seguramente sea mala idea. Además no te dejarán seguramente si lo quieres publicar después en Twitter hay límites de espacio y demás, entonces cuanto más cortito, menos pesado mejor. Y luego no uses gif por usarlo. Si no aporta interés, si no aporta valor, no lo metas. Si no te va a aportar nada especial, ahórratelo porque son más pesados que seguramente una imagen optimizada. Y hablando de optimización usa optimizadores online, que los hay también para gifs, los hay ya sabéis, para JPG, para PNG, lo típico. Os dejo un enlace a una búsqueda en Google que simplemente he buscado gifs optimization y te salen todos los que hay. No te puedo recomendar ninguno porque tampoco es que controle demasiado cada uno de ellos, pero vamos, es ir probando los que salen en las primeras posiciones a ver cuál te encaja mejor. Bueno, esta optimización lo que va a hacer es quitarle peso y que cuando lo subas a tu web te ocupa menos espacio en el servidor y tarde menos en cargar. Otro consejo, no te olvides del SEO, trátalos como una imagen. Ya vimos en el tutorial, te lo dejo de SEO en las imágenes, cómo es importante dar una serie de información, rellenar una serie de datos de nuestra imagen para que Google entienda bien que está relacionada con nuestra web y para que nuestros usuarios también sepan de qué va. Por ejemplo, pues rellenando la leyenda o, o en el caso de los motores de búsqueda, rellenando el texto alt, el texto alternativo. Estos son siete consejitos, pues como digo, de sentido común, pero que es muy fácil obviarlos y ponerte a hacer gifs como un loco y no tenerlos en cuenta. Así que creo que te pueden venir bien si vas a empezar ahora a utilizar los gifs entre los contenidos de tu web. En fin, que los gifs pueden ser un muy buen recurso, como todo, pues por supuesto no conviene abusar y además debes tener en cuenta que también requieren de optimización, que es el último punto que te acabo de comentar, pero, pero pueden beneficiarte muchísimo. Primero, a Google le encanta que combines tus textos con contenido multimedia, además como son atraen mucho, pues pueden hacer que incremente el engagement de tu web. ¿Esto qué quiere decir? Pues que la gente pase más tiempo en tu web, que se sienta más atraído por ella. También hemos visto, te he comentado que puede ayudarte con las conversiones y además es algo que aportan valor en sí mismos. Así que por todo esto creo que era un tema bastante interesante para tratar en el episodio de hoy. Y por último, recuerda, si estás empezando a aprender o quieres seguir aprendiendo a a gestionar tu negocio o proyecto con WordPress, te invito a que pruebes el área para suscriptores durante 15 días sin compromiso te apuntas, echas un vistazo, ves los cursos, ves los vídeos de la zona código, me contactas por el soporte y si después de 15 días no quieres seguir, me lo dices, oye Gonzalo, ¿Que? Pues no me convence o no quiero seguir o no me apetece o no puedo o lo que sea y te devuelvo tu inversión inicial sin problemas, te devuelvo los 10 euros sin preguntas, sin nada y listo, ¿Vale? Porque yo lo que quiero es que lo pruebes, si te gusta, pues te quedas y si no, no pasa nada. Y en general, si te gusta mi podcast, si te ha gustado el episodio de hoy y quieres ayudarme a que siga creciendo, quieres aportar tu granito de arena, puedes hacerlo dejándome una valoración en iTunes. Como siempre te digo, esto os lo agradezco muchísimo porque es lo que me permite después estar ahí, es decir, que alguien busque WordPress en iTunes y que yo aparezca. Esto es todo gracias a vuestras valoraciones, así que si la habéis dejado ya, muchísimas gracias. Y si no, lo podéis hacer de forma súper sencilla y en nada, en 30 segundos, vais a vuestra aplicación de podcast, buscáis WordPress semanal y le dais a reseñas. Ya está. Y ahí dejáis la reseña que consideréis. Sí, y si estás en Ivoox, si estás en Spotify, si estás en un agregador de podcast, muchas gracias por cualquier acción que tomes, primero por escuchar y segundo por lo que sea que puedas hacer, comentar, dejar un me gusta o lo que sea. Nada más por este episodio, nos seguimos escuchando. Adiós.