{"id":12845,"date":"2025-05-15T10:52:59","date_gmt":"2025-05-15T09:52:59","guid":{"rendered":"https:\/\/www.lucushost.com\/blog\/?p=12845"},"modified":"2025-05-15T10:52:59","modified_gmt":"2025-05-15T09:52:59","slug":"que-es-webp","status":"publish","type":"post","link":"https:\/\/www.lucushost.com\/blog\/que-es-webp\/","title":{"rendered":"Qu\u00e9 es WebP y por qu\u00e9 est\u00e1 revolucionando la web"},"content":{"rendered":"<p>\u00bfSab\u00edas que Google tiene su propio formato de im\u00e1genes? Pues s\u00ed, se llama WebP y est\u00e1 dise\u00f1ado para mantener la calidad de las im\u00e1genes, sin afectar a los tiempos de carga y a la velocidad de la web.<\/p>\n<p><!--more--><\/p>\n<p>Como ya sabes, utilizar im\u00e1genes de calidad en una web, especialmente cuando se trata de un ecommerce, puede ser un aspecto diferenciador con respecto a tu competencia, pero \u00a1ojo! Que no es oro todo lo que reluce.<\/p>\n<p>Las im\u00e1genes de calidad suelen pesar mucho, algo que puede afectar de manera negativa no solo a la velocidad, sino tambi\u00e9n a la experiencia de usuario. Y la consecuencia de esto est\u00e1 clara, p\u00e9rdida de posicionamiento web.<\/p>\n<p>Como soluci\u00f3n a esto, tenemos a WebP. Este formato promete reducir el peso de los archivos sin comprometer la calidad de los mismos. Esto se traduce en una web mucho m\u00e1s r\u00e1pida y una mejor experiencia de usuario para tus visitas. Suena bien, \u00bfverdad?<\/p>\n<p>Si te interesa el tema, qu\u00e9date. En este post te explico con mucho m\u00e1s detalle qu\u00e9 es WebP, qu\u00e9 ventajas tiene y c\u00f3mo empezar a usarlo en tu web.<\/p>\n<p>\u00bfVamos a ello?<\/p>\n<div id=\"toc_container\" class=\"no_bullets\"><p class=\"toc_title\">Tabla de contenidos:<\/p><ul class=\"toc_list\"><li><a href=\"#Que_es_WebP_y_por_que_es_el_formato_recomendado_por_Google\">\u00bfQu\u00e9 es WebP y por qu\u00e9 es el formato recomendado por Google?<\/a><ul><li><a href=\"#Compresion_con_perdida_y_sin_perdida_en_WebP_Que_es_exactamente\">Compresi\u00f3n con p\u00e9rdida y sin p\u00e9rdida en WebP: \u00bfQu\u00e9 es exactamente?<\/a><\/li><\/ul><\/li><li><a href=\"#Es_WebP_un_formato_universal_Que_navegadores_soportan_este_formato\">\u00bfEs WebP un formato universal? \u00bfQu\u00e9 navegadores soportan este formato?<\/a><\/li><li><a href=\"#Diferencias_entre_WebP_PNG_y_JPEG\">Diferencias entre WebP, PNG y JPEG<\/a><\/li><li><a href=\"#Convertir_imagenes_a_WebP_de_forma_sencilla\">Convertir im\u00e1genes a WebP de forma sencilla<\/a><ul><li><a href=\"#Herramientas_online_para_convertir_imagenes_a_WebP\">Herramientas online para convertir im\u00e1genes a WebP<\/a><\/li><li><a href=\"#Convertir_imagenes_a_WebP_por_linea_de_comandos\">Convertir im\u00e1genes a WebP por l\u00ednea de comandos<\/a><\/li><\/ul><\/li><li><a href=\"#Caso_practico_Reduccion_del_peso_de_una_imagen_con_WebP\">Caso pr\u00e1ctico: Reducci\u00f3n del peso de una imagen con WebP<\/a><\/li><li><a href=\"#Usar_imagenes_WebP_en_WordPress\">Usar im\u00e1genes WebP en WordPress<\/a><ul><li><a href=\"#Convertir_imagenes_de_PNG_a_WebP_desde_WordPress\">Convertir im\u00e1genes de PNG a WebP desde WordPress<\/a><\/li><\/ul><\/li><li><a href=\"#Subi_una_imagen_en_WebP_a_WordPress_pero_no_carga_que_ocurre\">Sub\u00ed una imagen en WebP a WordPress, pero no carga, \u00bfqu\u00e9 ocurre?<\/a><\/li><li><a href=\"#WebP_el_futuro_de_la_web\">WebP, \u00bfel futuro de la web?<\/a><\/li><\/ul><\/div>\n\n<h2><span id=\"Que_es_WebP_y_por_que_es_el_formato_recomendado_por_Google\">\u00bfQu\u00e9 es WebP y por qu\u00e9 es el formato recomendado por Google?<\/span><\/h2>\n<p>WebP es un formato de imagen relativamente nuevo y que ha modificado por completo la forma de optimizar im\u00e1genes en el mundo web. Pero, \u00bfc\u00f3mo lo hace?<\/p>\n<p>B\u00e1sicamente, WebP utiliza un algoritmo de compresi\u00f3n muy diferente a los formatos de imagen m\u00e1s tradicionales como, por ejemplo, PNG o JPEG. Con este algoritmo consigue reducir el peso de las im\u00e1genes sin afectar significativamente a su calidad.<\/p>\n<p>Aunque muchas veces hablamos de WebP como un formato nuevo y moderno, lo cierto es que su desarrollo se remonta a 2010 como parte de los esfuerzos de Google por mejorar el rendimiento de la web.<\/p>\n<p>A pesar de llevar 15 a\u00f1os funcionando, su uso ha crecido mucho en los \u00faltimos a\u00f1os. Tanto es as\u00ed que se est\u00e1 convirtiendo en la opci\u00f3n preferida por desarrolladores, dise\u00f1adores y webmasters.<\/p>\n<p>Pero, \u00bfpor qu\u00e9 se hizo tan famoso este formato? Bueno, principalmente a su flexibilidad y tambi\u00e9n al tipo de compresi\u00f3n que realiza. Admite compresi\u00f3n con p\u00e9rdida y sin p\u00e9rdida, algo que los profesionales de la web valoran muy positivamente.<\/p>\n<p>Ahora bien, \u00bfqu\u00e9 es esto de la compresi\u00f3n con p\u00e9rdida o sin p\u00e9rdida?<\/p>\n<h3><span id=\"Compresion_con_perdida_y_sin_perdida_en_WebP_Que_es_exactamente\">Compresi\u00f3n con p\u00e9rdida y sin p\u00e9rdida en WebP: \u00bfQu\u00e9 es exactamente?<\/span><\/h3>\n<p>Para que me entiendas, hablamos de compresi\u00f3n de im\u00e1genes cuando reducimos su peso sin que pierda demasiada calidad visual.<\/p>\n<p>Cuando hablamos de compresi\u00f3n con p\u00e9rdida, hacemos referencia a aquellas im\u00e1genes que, cuando se comprimen, se eliminan parte de sus datos para poder reducir el tama\u00f1o. Esta compresi\u00f3n se basa en la codificaci\u00f3n predictiva, similar a la utilizada en el c\u00f3dec de video VP8.<\/p>\n<p>Normalmente, esta p\u00e9rdida no es perceptible para el ojo humano (o lo que es lo mismo, tus visitas), aunque s\u00ed se hace m\u00e1s notable a medida que se agranda la imagen o si <em>se ve con lupa.<\/em><\/p>\n<p>En cambio, en la compresi\u00f3n sin p\u00e9rdida, no se elimina informaci\u00f3n de la imagen. Realmente utiliza t\u00e9cnicas como la transformaci\u00f3n de color y la predicci\u00f3n espacial para identificar y eliminar redundancias en los datos de la imagen.<\/p>\n<p>En este tipo de compresi\u00f3n la calidad de la imagen se mantiene intacta y es muy utilizada en sitios de ecommerce o p\u00e1ginas en las que la calidad de las im\u00e1genes son imprescindibles para los usuarios.<\/p>\n<h2><span id=\"Es_WebP_un_formato_universal_Que_navegadores_soportan_este_formato\">\u00bfEs WebP un formato universal? \u00bfQu\u00e9 navegadores soportan este formato?<\/span><\/h2>\n<p>Te dir\u00e9 que hasta hace poco, algunos de los navegadores m\u00e1s utilizados no soportaban este formato. De hecho, los desarrolladores ten\u00edan que seguir utilizando formatos mucho menos eficientes para web como JPEG o PNG para garantizar que las im\u00e1genes se viesen correctamente.<\/p>\n<p>Eso s\u00ed, ahora la situaci\u00f3n ha cambiado bastante, y la compatibilidad de este formato ha aumentado considerablemente.\u00a0Tanto es as\u00ed, que las versiones actuales de los navegadores m\u00e1s utilizados ya soportan perfectamente WebP, tanto en versi\u00f3n m\u00f3vil como de escritorio:<\/p>\n<ul>\n<li>Google Chrome (desde la versi\u00f3n 9)<\/li>\n<li>Mozilla Firefox (desde la versi\u00f3n 65)<\/li>\n<li>Microsoft Edge (desde la versi\u00f3n 18)<\/li>\n<li>Opera (desde la versi\u00f3n 11.10)<\/li>\n<li>Safari (desde la versi\u00f3n 14)<\/li>\n<li>Navegadores m\u00f3viles en Android e iOS<\/li>\n<\/ul>\n<p>Sin embargo, aunque la compatibilidad es muy alta, todav\u00eda no podemos decir que WebP sea un formato universal. Por ejemplo, algunos navegadores como Internet Explorer que, pese a que su soporte ya finaliz\u00f3 en 2022, todav\u00eda est\u00e1 en uso, no soporta este tipo de im\u00e1genes.<\/p>\n<p>Entonces, \u00bfsi WebP no es un formato universal, es mejor no utilizarlo por el momento? Para nada, puedes utilizarlo sin problema. Ya es lo suficientemente compatible con los navegadores y versiones m\u00e1s utilizadas, por lo que es recomendable para optimizar la velocidad y rendimiento de tu web, sin perder calidad en las im\u00e1genes.<\/p>\n<p>Ten en cuenta que, aunque ofrezcas WebP, tambi\u00e9n puedes aplicar ciertas configuraciones para que tus im\u00e1genes carguen en todos los navegadores, por ejemplo:<\/p>\n<ul>\n<li>Carga condicional: es decir, puedes ofrecer WebP por defecto, pero configurar tu sitio para ofrecer im\u00e1genes PNG o JPEG en navegadores o versiones donde todav\u00eda no hay compatibilidad.<\/li>\n<li>Utilizar la etiqueta &lt;picture&gt;: este elemento de HTML se utiliza para proveer diferentes versiones de una imagen en seg\u00fan qu\u00e9 dispositivos se cargue.<\/li>\n<\/ul>\n<h2><span id=\"Diferencias_entre_WebP_PNG_y_JPEG\">Diferencias entre WebP, PNG y JPEG<\/span><\/h2>\n<p>Si hablamos de los formatos de imagen m\u00e1s utilizados en la web, s\u00ed o s\u00ed, tenemos que mencionar a WebP, a PNG y JPEG, \u00bfpero qu\u00e9 diferencias hay entre ellos? \u00bfCu\u00e1l es el m\u00e1s adecuado?<\/p>\n<p>Cada uno de ellos tienen diferencias claras en cuanto a compresi\u00f3n, calidad y funcionalidad. Veamos cada una de estas caracter\u00edsticas por separado.<\/p>\n<p><b>Compresi\u00f3n<\/b><\/p>\n<p>Si nos centramos en el uso de im\u00e1genes para web, la compresi\u00f3n de las im\u00e1genes es clave para mantener un equilibrio entre calidad visual y tama\u00f1o.<\/p>\n<ul>\n<li><strong>WebP<\/strong>: ofrece compresi\u00f3n con y sin p\u00e9rdidas, lo que permite reducir el tama\u00f1o de los archivos sin comprometer la calidad de los mismos. Concretamente, Google afirma que es capaz de<a href=\"https:\/\/developers.google.com\/speed\/webp?hl=es\" rel=\"nofollow noopener\" target=\"_blank\"> reducir entre un 25% y un 34%<\/a> el tama\u00f1o con respecto a JPEG o PNG.<\/li>\n<li><strong>PNG<\/strong>: solamente ofrece compresi\u00f3n sin p\u00e9rdida, lo que implica que el tama\u00f1o de la imagen es mucho mayor.<\/li>\n<li><strong>JPEG<\/strong>: en este caso, JPEG s\u00ed utiliza compresi\u00f3n con p\u00e9rdida, pero elimina datos de la imagen para reducir su tama\u00f1o. En otras palabras, JPEG s\u00ed compromete la calidad de la imagen para conseguir archivos m\u00e1s peque\u00f1os.<\/li>\n<\/ul>\n<p><b>Calidad<\/b><\/p>\n<p>Especialmente en las p\u00e1ginas web donde las im\u00e1genes son importantes, debes conocer c\u00f3mo se comportan los diferentes formatos de imagen en cuanto a calidad.<\/p>\n<ul>\n<li><strong>WebP<\/strong>: al igual que las im\u00e1genes en PNG, el formato WebP mantiene una profundidad de color de 24 bits y utiliza un algoritmo de compresi\u00f3n avanzada con el que es capaz de mantener la nitidez sin generar alteraciones visuales.<\/li>\n<li><strong>PNG<\/strong>: el algoritmo de compresi\u00f3n que tiene este formato es sin p\u00e9rdidas, es decir, no se eliminan los datos ni pierde calidad. Por tanto, es ideal cuando se quiere mantener im\u00e1genes que se desean mantener todos los detalles, como por ejemplo, en un logo o gr\u00e1ficos con poco color.<\/li>\n<li><strong>JPEG<\/strong>: en este caso, al utilizar compresi\u00f3n con p\u00e9rdida, se eliminan datos y la calidad de las im\u00e1genes se ve bastante comprometida, especialmente si se aplica un gran porcentaje de compresi\u00f3n.<\/li>\n<\/ul>\n<p><b>Funcionalidades\u00a0<\/b><\/p>\n<p>En cuanto a las funcionalidades, estos formatos tambi\u00e9n presentan claras diferencias:<\/p>\n<ul>\n<li><strong>WebP<\/strong>: admiten transparencias (canal alfa) y animaciones, por lo que puede sustituir perfectamente a formatos PNG en cuesti\u00f3n de transparencia y a GIF en cuanto a movimiento.<\/li>\n<li><strong>PNG<\/strong>: de forma nativa admite transparencia, pero no movimiento.<\/li>\n<li><strong>JPEG<\/strong>: es menos vers\u00e1til, ya que no admite ni transparencia, ni animaciones.<\/li>\n<\/ul>\n<table style=\"width: 100%;border-collapse: collapse\">\n<tbody>\n<tr style=\"background-color: #18507f;color: white;text-align: center\">\n<th style=\"border: 1px solid white;padding: 10px\">Aspecto<\/th>\n<th style=\"border: 1px solid white;padding: 10px\">WebP<\/th>\n<th style=\"border: 1px solid white;padding: 10px\">PNG<\/th>\n<th style=\"border: 1px solid white;padding: 10px\">JPEG<\/th>\n<\/tr>\n<tr>\n<td style=\"border: 1px solid #ccc;padding: 10px\"><strong>Compresi\u00f3n<\/strong><\/td>\n<td style=\"border: 1px solid #ccc;padding: 10px\">Con y sin p\u00e9rdida.<\/td>\n<td style=\"border: 1px solid #ccc;padding: 10px\">Solo sin p\u00e9rdida (mayor tama\u00f1o de archivo).<\/td>\n<td style=\"border: 1px solid #ccc;padding: 10px\">Con p\u00e9rdida (se eliminan datos).<\/td>\n<\/tr>\n<tr>\n<td style=\"border: 1px solid #ccc;padding: 10px\"><strong>Calidad<\/strong><\/td>\n<td style=\"border: 1px solid #ccc;padding: 10px\">Mantiene nitidez sin distorsiones.<\/td>\n<td style=\"border: 1px solid #ccc;padding: 10px\">No pierde calidad, ideal para gr\u00e1ficos o logotipos.<\/td>\n<td style=\"border: 1px solid #ccc;padding: 10px\">P\u00e9rdida notable de calidad con alta compresi\u00f3n.<\/td>\n<\/tr>\n<tr>\n<td style=\"border: 1px solid #ccc;padding: 10px\"><strong>Funcionalidades<\/strong><\/td>\n<td style=\"border: 1px solid #ccc;padding: 10px\">Admite transparencia y animaciones.<\/td>\n<td style=\"border: 1px solid #ccc;padding: 10px\">Admite transparencia, pero no animaciones.<\/td>\n<td style=\"border: 1px solid #ccc;padding: 10px\">No admite ni transparencia ni animaciones.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2><span id=\"Convertir_imagenes_a_WebP_de_forma_sencilla\">Convertir im\u00e1genes a WebP de forma sencilla<\/span><\/h2>\n<p>Ahora que ya conoces las ventajas de utilizar el formato WebP, veamos c\u00f3mo convertir tus im\u00e1genes a este formato para utilizar en tu web.<\/p>\n<p>Por defecto, los dispositivos m\u00f3viles o c\u00e1maras no devuelven los archivos en estos formatos y, muchas herramientas de edici\u00f3n o creaci\u00f3n de im\u00e1genes, tampoco lo tienen por defecto, por lo que tienes que hacer s\u00ed o s\u00ed la conversi\u00f3n.<\/p>\n<p>Lo cierto es que no hay una \u00fanica forma de hacer la conversi\u00f3n. Tienes herramientas online que te permiten hacer la conversi\u00f3n de forma muy sencilla, no obstante, si te defiendes bien a nivel t\u00e9cnico, tambi\u00e9n puedes utilizar la l\u00ednea de comandos.<\/p>\n<h3><span id=\"Herramientas_online_para_convertir_imagenes_a_WebP\">Herramientas online para convertir im\u00e1genes a WebP<\/span><\/h3>\n<p>Una de las soluciones m\u00e1s f\u00e1ciles y r\u00e1pidas para convertir im\u00e1genes desde PNG o JPEG a WebP es utilizar una herramienta online. O por lo menos es la que yo me decanto \ud83d\ude42<\/p>\n<p>Existen un mont\u00f3n de opciones online y el funcionamiento de todas ellas es bastante similar; subes la imagen que deseas convertir y te la devuelve en el formato que hayas seleccionado.<\/p>\n<p>Algunas deque yo utilizo y recomiendo para esto son:<\/p>\n<ul>\n<li><b>Squoosh App: <\/b>sin duda mi favorita. Squoosh App es una herramienta de optimizaci\u00f3n de im\u00e1genes con la que puedes modificar el tama\u00f1o de la imagen, reducir la paleta de colores, etc. y c\u00f3mo no, convertir tus im\u00e1genes a WebP.<\/li>\n<li><b>FreeConvert<\/b>: puedes subir tus archivos desde el equipo, Dropbox o Google Drive, entre otras plataformas, y convertirlos al formato WebP eligiendo tipo de conversi\u00f3n, velocidad, calidad de la imagen, etc.<\/li>\n<li><b>Convertio<\/b>: esta herramienta te permite seleccionar el formato de origen y a cu\u00e1l quieres convertir tu imagen. Por ejemplo: WebP, ICO, GIF, etc. Asimismo, puedes convertir cualquier otro tipo de archivo como ebooks, documentos\u2026<\/li>\n<li><b>ImgTools<\/b>: puedes subir un lote de im\u00e1genes y convertirlas f\u00e1cilmente a WebP, GIF, PNG o JPEG. \u00a1T\u00fa eliges!<\/li>\n<\/ul>\n<p>Estas son solo algunas de mis sugerencias. En Internet tienes tantas opciones como quieras para convertir tus im\u00e1genes a WebP.<\/p>\n<h3><span id=\"Convertir_imagenes_a_WebP_por_linea_de_comandos\">Convertir im\u00e1genes a WebP por l\u00ednea de comandos<\/span><\/h3>\n<p>Si te manejas bien con la consola o no quieres depender de herramientas o software externo, pues tambi\u00e9n tienes opci\u00f3n de convertir tus im\u00e1genes a WebP por l\u00ednea de comandos.<\/p>\n<p>Para esto Google ha desarrollado una librer\u00eda para convertir im\u00e1genes a WebP. En su web oficial puedes <a href=\"https:\/\/developers.google.com\/speed\/webp\/docs\/precompiled?hl=es-419\" rel=\"nofollow noopener\" target=\"_blank\">descargar la librer\u00eda libwebp<\/a> correspondiente a tu sistema operativo. Cada librer\u00eda contiene el paquete completo de utilidades, entre las que se incluyen:<\/p>\n<ul>\n<li><em>cwebp<\/em>: herramienta de codificador WebP.<\/li>\n<li><em>dwebp<\/em>: herramienta de decodificador de WebP.<\/li>\n<li><em>gif2webp<\/em>: para convertir de GIF a WebP.<\/li>\n<\/ul>\n<p><b>\u00bfQuieres ver un ejemplo?\u00a0<\/b><\/p>\n<p>Para realizar la conversi\u00f3n de im\u00e1genes a WebP desde la l\u00ednea de comandos de Linux es necesario tener cwebp instalado. Para ello, abre la terminal y ejecuta el siguiente comando:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\">sudo apt update\r\nsudo apt install webp<\/pre>\n<p>Hecho esto, ya podr\u00e1s empezar a trabajar con el formato WebP \ud83d\ude42 .<\/p>\n<p>Por ejemplo, \u00bfquieres convertir una imagen PNG a WebP? Podr\u00edas hacerlo ejecutando el siguiente comando:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\">cwebp -q 75 imagen.png -o imagen.webp<\/pre>\n<p>Con esta l\u00ednea de c\u00f3digo estar\u00edas convirtiendo, con una calidad 75 (donde 0 es la peor y 100 la mejor) el archivo<em> imagen.png<\/em> a WebP y lo guardar\u00edas as\u00ed: <em>imagen.webp<\/em><\/p>\n<p>\u00a1Ojo! Tambi\u00e9n existe el comando <em>dwebp<\/em>, pero en su lugar este comando decodificar\u00eda la imagen de WebP.<\/p>\n<p>Si tienes m\u00e1s im\u00e1genes para convertir, no tienes que hacerlo una a una. Puedes utilizar el siguiente comando que convierte todos los archivos de la carpeta \u00abim\u00e1genes\u00bb a WebP y los guarda en la misma ubicaci\u00f3n.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\">for file in imagenes\/*; do cwebp -q 75 \"$file\" -o \"${file%.*}.webp\"; done<\/pre>\n<p>\u00bfAhora quieres comprobar c\u00f3mo han quedado? Lo m\u00e1s f\u00e1cil es que utilices un navegador como Mozilla, Chrome u Opera para previsualizar las im\u00e1genes con el nuevo formato.<\/p>\n<h2><span id=\"Caso_practico_Reduccion_del_peso_de_una_imagen_con_WebP\">Caso pr\u00e1ctico: Reducci\u00f3n del peso de una imagen con WebP<\/span><\/h2>\n<p>Qu\u00e9 mejor que ver un caso pr\u00e1ctico para entender mejor los beneficios de WebP, \u00bfno crees?<\/p>\n<p>Para esto, voy a hacer una prueba en la que convertir\u00e9 una imagen real desde PNG a WebP utilizando una de mis herramientas favoritas: Squoosh App.<\/p>\n<p>La imagen tiene un tama\u00f1o de 461 <span class=\"_unit_17s86_110\">kB<\/span> y unas dimensiones de 1000 x 667 px. Una vez que subo la imagen en JPG a la herramienta, sin aplicar ninguna configuraci\u00f3n avanzada y manteniendo la paleta de colores y dimensiones, es capaz de ofrecerme una imagen en WebP\u00a0 de 26.3 <span class=\"_unit_17s86_110\">kB<\/span>. Es decir, con una calidad de 75, me ahorrar\u00eda el 94% del peso original, sin una p\u00e9rdida significativa de calidad visual.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-12852\" src=\"https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/ejemplo-convertir-png-webp.webp\" alt=\"Ejemplo de convertir una imagen de PNG a WebP\" width=\"1409\" height=\"763\" title=\"\" srcset=\"https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/ejemplo-convertir-png-webp.webp 1409w, https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/ejemplo-convertir-png-webp-300x162.webp 300w, https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/ejemplo-convertir-png-webp-1024x555.webp 1024w, https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/ejemplo-convertir-png-webp-768x416.webp 768w, https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/ejemplo-convertir-png-webp-700x379.webp 700w\" sizes=\"(max-width: 1409px) 100vw, 1409px\" \/><\/p>\n<p>Incluso aplicando un nivel de calidad 90, la herramienta es capaz de reducir la imagen en un 87%, con un peso solo de 61,7 kB.<\/p>\n<p>Esto es solo una imagen, \u00bfte imaginas si haces lo mismo con todas las de tu web?<\/p>\n<h2><span id=\"Usar_imagenes_WebP_en_WordPress\">Usar im\u00e1genes WebP en WordPress<\/span><\/h2>\n<p>El 20 de julio de 2021 se liber\u00f3 la versi\u00f3n 5.8 de WordPress y con ella el lanzamiento de una nueva funcionalidad: la compatibilidad de WordPress con WebP.<\/p>\n<p>\u00bfY qu\u00e9 quiere decir esto? Que de forma nativa, WordPress ya es compatible con el formato WebP. Por tanto, puedes subir y utilizar las im\u00e1genes en este formato sin problemas, tal y como lo hac\u00edas con PNG o JPG.<\/p>\n<p>Es m\u00e1s, no es que puedas hacerlo\u2026 \u00a1Debes hacerlo! Como te dije, es el formato recomendado por Google y tiene alg\u00fan que otro beneficio para tu web. Te recuerdo:<\/p>\n<ul>\n<li>Son entre un 25% y un 34%, de media, m\u00e1s peque\u00f1as que los formatos PNG y JPEG, lo que se traduce en una mejora considerable de velocidad y rendimiento web.<\/li>\n<li>WebP permite compresi\u00f3n con y sin p\u00e9rdida, transparencia y animaciones. Es decir, es un formato muy vers\u00e1til.<\/li>\n<li>Aunque la mayor\u00eda de navegadores ya soportan WebP, es posible configurar tu sitio para que muestre un formato compatible a usuario que utilizan versiones m\u00e1s antiguas.<\/li>\n<\/ul>\n<p>\u00bfY para subir una imagen en WebP a WordPress?<\/p>\n<p>Igual de f\u00e1cil que hacerlo con el formato PNG o JPEG. Accede al <a href=\"https:\/\/www.lucushost.com\/blog\/frontend-backend\/\">backend<\/a> de tu aplicaci\u00f3n y ve a la secci\u00f3n \u00abMedios\u00bb &#8211; \u00abBiblioteca\u00bb. Haciendo clic en \u00abA\u00f1adir nuevo archivo de medios\u00bb podr\u00e1s subir una imagen en WebP desde tu equipo.<\/p>\n<p>Tambi\u00e9n es posible hacerlo desde una entrada o una p\u00e1gina de WordPress, haciendo clic en la opci\u00f3n \u00abA\u00f1adir medios\u00bb.<\/p>\n<h3><span id=\"Convertir_imagenes_de_PNG_a_WebP_desde_WordPress\">Convertir im\u00e1genes de PNG a WebP desde WordPress<\/span><\/h3>\n<p>\u00bfY qu\u00e9 ocurre su ya tengo un mont\u00f3n de im\u00e1genes subidas y quiero modificar el formato de todas? \u00bfTengo que hacerlo una a una?<\/p>\n<p>No, \u00a1claro que no! Ya sabes que en WordPress siempre (o casi siempre) hay una soluci\u00f3n sencilla. Y en este caso no iba a ser menos.<\/p>\n<p>Existen son algunos de los plugins que te permiten hacer la conversi\u00f3n de forma totalmente autom\u00e1tica de tu biblioteca de medios:<\/p>\n<ul>\n<li><strong>WebP Conversion<\/strong>: este plugin te permite realizar f\u00e1cilmente la conversi\u00f3n a WebP, de forma individual o masiva desde la biblioteca de WordPress. Adem\u00e1s, proporciona configuraciones flexibles para gestionar la calidad y tipo de compresi\u00f3n.<\/li>\n<li><strong>Converter for Media \u2013 Optimize images | Convert WebP &amp; AVIF<\/strong>: este complemento te permite acelerar tu web reemplazando archivos JPEG, PNG y GIF en WebP y AVIF.<\/li>\n<\/ul>\n<p>Si utilizas un alojamiento web con LiteSpeed, como nuestros planes de <a href=\"https:\/\/www.lucushost.com\/hosting-wordpress\">Hosting WordPress<\/a>, tambi\u00e9n tienes la posibilidad de realizar la conversi\u00f3n al formato WebP de forma autom\u00e1tica con LiteSpeed Cache. \u00bfQuieres ver c\u00f3mo se hace?<\/p>\n<ol>\n<li>Accede a la secci\u00f3n \u00abOptimizaci\u00f3n de im\u00e1genes\u00bb de LiteSpeed Cache.<\/li>\n<li>Activa la opci\u00f3n \u00abReemplazo de im\u00e1genes WebP\u00bb.<\/li>\n<\/ol>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-12854\" src=\"https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/convertir-webp-litespeed-cache-wordpress.webp\" alt=\"Convertir en lote las im\u00e1genes a webp con LiteSpeed Cache for WordPress\" width=\"1169\" height=\"456\" title=\"\" srcset=\"https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/convertir-webp-litespeed-cache-wordpress.webp 1169w, https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/convertir-webp-litespeed-cache-wordpress-300x117.webp 300w, https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/convertir-webp-litespeed-cache-wordpress-1024x399.webp 1024w, https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/convertir-webp-litespeed-cache-wordpress-768x300.webp 768w, https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2025\/05\/convertir-webp-litespeed-cache-wordpress-700x273.webp 700w\" sizes=\"(max-width: 1169px) 100vw, 1169px\" \/><\/p>\n<p>De esta forma, se servir\u00e1n autom\u00e1ticamente las versiones WebP de tus im\u00e1genes a los navegadores que las soporten, manteniendo las originales para aquellos que no.<\/p>\n<h2><span id=\"Subi_una_imagen_en_WebP_a_WordPress_pero_no_carga_que_ocurre\">Sub\u00ed una imagen en WebP a WordPress, pero no carga, \u00bfqu\u00e9 ocurre?<\/span><\/h2>\n<p>Antes de nada, comprueba que est\u00e1s utilizando una versi\u00f3n de WordPress igual o superior a la 5.8. Y si no es as\u00ed, \u00a1actualiza! No solo por tener la compatibilidad con WebP, sino porque ya sabes lo importante que es tener las versiones m\u00e1s recientes de este CMS.<\/p>\n<p>Tambi\u00e9n es posible que tu proveedor de hosting no utilice Imagick, una biblioteca de PHP requerida para el uso de WebP. En ese caso, si tus im\u00e1genes en WebP no cargan, contacta con Soporte t\u00e9cnico para que puedan darte una soluci\u00f3n.<\/p>\n<p>\u00bfTienes tu web con nosotros? Entonces no vas a tener problema, puedes utilizar sin problemas el formato WebP en nuestros servidores :-).<\/p>\n<h2><span id=\"WebP_el_futuro_de_la_web\">WebP, \u00bfel futuro de la web?<\/span><\/h2>\n<p>Despu\u00e9s de lo que vimos hasta ahora, podemos decir que el formato WebP no es solo una alternativa a PNG o JPEG, sino que adem\u00e1s es una aut\u00e9ntica revoluci\u00f3n en la optimizaci\u00f3n de im\u00e1genes para la web. Este formato desarrollado por Google apuesta por una reducci\u00f3n considerable del tama\u00f1o de los archivos, sin comprometer su calidad visual. \u00bfY en qu\u00e9 se traduce esto? B\u00e1sicamente en p\u00e1ginas web m\u00e1s r\u00e1pidas, mejor experiencia de usuario y, c\u00f3mo no, mejor posicionamiento en buscadores.<\/p>\n<p>La compatibilidad de WebP con los principales navegadores, herramientas web y CMS como WordPress, hace que su implementaci\u00f3n sea cada vez m\u00e1s sencilla. Pero \u00a1ojo! Hay en algunos casos que todav\u00eda es recomendable ofrecer una versi\u00f3n alternativa a tus usuarios, especialmente en navegadores o dispositivos que a\u00fan no soportan este formato de manera nativa.<\/p>\n<p>\u00bfTe preocupa el tiempo que llevar\u00eda convertir todas las im\u00e1genes de tu web a WebP? Ya viste que no es necesario hacer el cambio una a una. Puedes optar por alg\u00fan plugin de conversi\u00f3n espec\u00edfico para WordPress o utilizar el Optimizador de Im\u00e1genes de LiteSpeed que te permite hacer el cambio en un par de clics.<\/p>\n<p>\u00bfTe decides a dar el cambio? D\u00e9jame un comentario aqu\u00ed abajo y me cuentas \ud83d\ude42 .<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u00bfSab\u00edas que Google tiene su propio formato de im\u00e1genes? Pues s\u00ed, se llama WebP y est\u00e1 dise\u00f1ado para mantener la calidad de las im\u00e1genes, sin afectar a los tiempos de carga y a la velocidad de la web.<\/p>\n","protected":false},"author":3,"featured_media":12848,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[44,46],"tags":[],"_links":{"self":[{"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/posts\/12845"}],"collection":[{"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/comments?post=12845"}],"version-history":[{"count":9,"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/posts\/12845\/revisions"}],"predecessor-version":[{"id":12859,"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/posts\/12845\/revisions\/12859"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/media\/12848"}],"wp:attachment":[{"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/media?parent=12845"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/categories?post=12845"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lucushost.com\/blog\/wp-json\/wp\/v2\/tags?post=12845"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}