<\/p>
Optimizar el tamaño de los archivos de imagen es esencial para aumentar el rendimiento de un sitio. El uso del formato WebP sirve para ello sin sacrificar la calidad de la imagen, lo que lo convierte en un formato adecuado para muchos propietarios de sitios web.<\/p>
En este artículo, aprenderás qué es WebP, así como las ventajas y desventajas que presenta. También repasaremos las formas de utilizar WebP en WordPress y cómo guardar un archivo WebP en tu computadora.<\/p>
\n\n\n\n\n\n\n
¿Qué es WebP?<\/h2>\n
WebP es un formato de imagen que utiliza métodos de compresión de imágenes con y sin pérdidas para reducir el tamaño de la imagen manteniendo una buena calidad.<\/p>\n <\/div>\n\n\n\n<\/p>
¿Cuáles son las ventajas de WebP?<\/h3>
Estas son las principales ventajas de utilizar imágenes WebP:<\/p>
- \n
- Aumenta el rendimiento del sitio web<\/strong>. El formato WebP es más ligero en comparación con JPEG y PNG. Los archivos de imagen más pequeños aumentan la velocidad de carga de un sitio.<\/li>\n\n\n\n
- Ahorra más ancho de banda<\/strong>. El ancho de banda es la velocidad a la que tu servidor puede transferir datos a tus usuarios finales en un tiempo determinado. WebP puede liberar espacio de ancho de banda, lo que permite a los sitios web ofrecer más contenido. Esto es especialmente importante para los sitios web con muchas imágenes, como los blogs de comida<\/a>, viajes<\/a> o fotografía.<\/li>\n\n\n\n
- Mejora la optimización de los motores de búsqueda (SEO)<\/strong>. El aumento de la velocidad de la página debido a las imágenes más ligeras afectará positivamente al posicionamiento del sitio en motores de búsqueda como Google.<\/li>\n\n\n\n
- Muestra imágenes de alta calidad<\/strong>. No es necesario sacrificar la calidad de las imágenes por una mayor velocidad de carga. Con WebP, puedes tener lo mejor de ambos mundos y mejorar la experiencia de usuario en tu sitio.<\/li>\n\n\n\n
- Muestra varios tipos de imágenes<\/strong>. WebP admite imágenes transparentes y animadas.
Para ilustrar mejor las ventajas de WebP sobre otros formatos como JPEG y PNG, veamos lo que ofrecen ambos en comparación.<\/li>\n<\/ul>JPEG (o JPG)<\/strong> es excelente para imágenes con muchos colores y es la opción preferida para fotos fijas. Sin embargo, los archivos de imagen JPEG utilizan una compresión con pérdidas<\/strong>, lo que significa que la calidad disminuirá cuando se vuelvan a guardar o editar. Otro inconveniente de este formato es que no admite transparencias ni animaciones.<\/p>
Por otro lado, el tipo de archivo PNG<\/strong> es excelente para conservar una alta calidad de imagen gracias a su compresión sin pérdidas<\/strong>. Este formato se adapta a las imágenes que tienen muchos píxeles, como las infografías con mucho texto. También es compatible con la transparencia, lo que lo hace ideal para elementos de diseño web y logotipos. Lamentablemente, PNG suele tener un tamaño de imagen mayor y no admite animaciones.<\/p>
WebP tiene las mejores cualidades de ambos formatos. Lo más importante es que ofrece un tamaño de archivo aproximadamente un 25-34% menor<\/a> con un índice de calidad SSIM equivalente al de PNG o JPEG.<\/p>
\n![\"Comparación](\"https:\/\/www.hostinger.com\/mx\/tutoriales\/wp-content\/uploads\/sites\/39\/2020\/09\/jpeg-webp.png\")
<\/figure><\/div>Echa un vistazo a las imágenes de muestra de la galería WebP<\/a> de Google. El sitio web compara imágenes JPEG y WebP de calidad similar.<\/p>
Haz clic en cada imagen del sitio y compara lo que ves. No hay mucha diferencia de calidad entre las imágenes JPEG de la izquierda y las WebP de la derecha. Sin embargo, los archivos WebP son significativamente más pequeños en tamaño en comparación con los JPEG.<\/p>
¿Cuáles son las desventajas de WebP?<\/h3>
Aunque el uso de WebP tiene muchas ventajas, hay algunos inconvenientes que hay que tener en cuenta. Vamos a repasar los problemas relacionados con el software, especialmente con los navegadores web.<\/p>
Aunque la compatibilidad de WebP con los principales navegadores ha ido mejorando a lo largo de los años, algunos navegadores siguen sin admitir este tipo de archivo.<\/p>
Navegadores populares como Google Chrome<\/strong>, Mozilla Firefox<\/strong>, Opera<\/strong> y Microsoft Edge<\/strong> han tenido soporte para WebP durante años. Más recientemente, Safari finalmente agregó soporte para WebP<\/a> también.<\/p>
Dada la tendencia actual, es de esperar que otros navegadores que no han soportado WebP eventualmente sigan su ejemplo, así que no dejes de estar al tanto<\/a> de los desarrollos.<\/p>
\n![\"Navegadores](\"https:\/\/www.hostinger.com\/mx\/tutoriales\/wp-content\/uploads\/sites\/39\/2020\/09\/navegadores-webp-1024x409.png\")
<\/figure><\/div>En cuanto a otros programas, no todos son compatibles con el formato WebP. Algunos visores y herramientas de edición de imágenes no pueden abrir archivos WebP. Por ejemplo, Adobe Photoshop no lo soporta por defecto. Para editar un archivo WebP en Adobe Photoshop, es necesario instalar primero el plugin WebPShop<\/a>.<\/p>
Usar imágenes WebP en WordPress<\/h2>
WordPress introdujo el soporte para WebP en la versión 5.8 de WordPress para permitir la subida de imágenes WebP a la biblioteca de medios.<\/p>
Ve a Medios -> Añadir nuevo<\/strong> y selecciona los archivos WebP que quieres subir. Una vez que hayas añadido las imágenes a la biblioteca de medios, comprueba si ha funcionado sin problemas. También puedes subir una imagen al escribir un post o editar una página.<\/p>
Sin embargo, el soporte de WebP de WordPress no convertirá automáticamente las imágenes existentes en la biblioteca de medios al formato WebP. Utiliza un plugin de optimización de imágenes para convertirlas a WebP cuando se muestren en tu sitio web.<\/p>
![\"Plugin](\"https:\/\/www.hostinger.com\/mx\/tutoriales\/wp-content\/uploads\/sites\/39\/2022\/05\/shortpixel-1024x519.png\")
<\/figure>ShortPixel<\/a> es un plugin gratuito de compresión de imágenes para WordPress. Una vez instalado, puede convertir las imágenes existentes y futuras de tu biblioteca a WebP. El plugin utiliza la nube y una red de distribución de contenidos<\/a> (CDN) para almacenar y transferir tus imágenes optimizadas, lo que te permite ahorrar aún más espacio de almacenamiento y ancho de banda.<\/p>
Además de la conversión a WebP, ShortPixel también ofrece otras características útiles de optimización de imágenes como WP Retina 2x<\/a> y compatibilidad con CloudFlare<\/a>. El soporte está disponible de forma directa con los desarrolladores.<\/p>
El plan gratuito de ShortPixel te permite comprimir hasta 100 imágenes al mes<\/strong>. Si tienes muchas imágenes en tu sitio, considera la posibilidad de actualizar a uno de sus planes premium<\/a>. Tienes la opción de comprar planes mensuales o créditos de una sola vez.<\/p>
\n![\"Página](\"https:\/\/www.hostinger.com\/mx\/tutoriales\/wp-content\/uploads\/sites\/39\/2022\/05\/optimole-1024x496.png\")
<\/figure><\/div>Otro plugin que funciona de manera similar es el plugin Optimole<\/a>. En el plan gratuito, no hay límite<\/strong> en cuanto al número de imágenes que puedes optimizar, siempre que tengas menos de 5.000 visitas al mes<\/strong>. Si tus visitas mensuales superan ese límite, considera contratar uno de sus planes premium<\/a>.<\/p>
Como alternativa, si buscas un enfoque manual, utiliza la API Photon<\/a>. Éste convierte tus imágenes JPEG y PNG en cualquier formato de archivo que desees, incluido WebP. Sin embargo, ten en cuenta que sólo puedes utilizar esta API si usas WordPress.com<\/a> o si tu sitio de WordPress autoalojado está conectado a Jetpack<\/a>.<\/p>
Cómo guardar imágenes WebP como archivos JPEG o PNG<\/h2>
Aunque WebP es superior a los formatos PNG y JPEG en muchos aspectos, hay razones por las que podrías querer guardar las imágenes como JPEG o PNG.<\/p>
Por ejemplo, si el software gráfico que usas no es compatible con WebP, necesitarás la versión JPEG o PNG de la imagen. Estos son algunos métodos que puedes probar para guardar las imágenes WebP como JPEG o PNG:<\/p>
- \n
- Utiliza otro navegador<\/strong>. Abre la página web que contiene la imagen que quieres guardar utilizando un navegador que no soporte WebP. El navegador mostrará la versión JPEG o PNG de la imagen y podrás guardarla como siempre.<\/li>\n\n\n\n
- Utiliza Microsoft Paint<\/strong>. Si utilizas Windows, guarda la imagen WebP. Luego, ábrela en Microsoft Paint. Ve a Archivo -> Guardar como<\/strong>. Elige el formato que prefieras.
![\"Guardar](\"https:\/\/www.hostinger.com\/mx\/tutoriales\/wp-content\/uploads\/sites\/39\/2020\/09\/guardar-como-paint.png\")
<\/li>\n\n\n\n- Utiliza una herramienta de conversión de imágenes en línea<\/strong>. Guarda la imagen WebP en tu ordenador y conviértela online utilizando una herramienta como CloudConvert.<\/li>\n<\/ul>
![\"\"](\"https:\/\/blog.hostinger.io\/mx-tutoriales\/wp-content\/uploads\/sites\/39\/2023\/02\/ES-Web-hosting_in-text-banner-1024x300.png\")
<\/a><\/figure>Conclusión<\/h2>
WebP es un formato de imagen de nueva generación que mejora a sus predecesores, como JPEG y PNG. Ofrece tecnologías de compresión avanzadas que permiten conservar la calidad de la imagen y, al mismo tiempo, reducir el tamaño de los archivos.<\/p>
En este artículo, hemos proporcionado formas de resolver problemas relacionados con el formato WebP. Hemos explorado cómo utilizar WebP en WordPress y cómo guardarlo como JPEG o PNG. Esperamos que este artículo te haya ayudado a entender mejor el formato WebP y a resolver los problemas que puedas tener.<\/p>\n","protected":false},"excerpt":{"rendered":"
Muchos sitios web comenzaron a adoptar un nuevo formato de imagen llamado WebP. ¿Qué es WebP y por qué puede ser más beneficioso que otros formatos de imagen? WebP es un formato desarrollado por Google tras la adquisición de On2 Technologies. Basado en el códec de video VP8, WebP ofrece imágenes de alta calidad en […]<\/p>\n
- Utiliza Microsoft Paint<\/strong>. Si utilizas Windows, guarda la imagen WebP. Luego, ábrela en Microsoft Paint. Ve a Archivo -> Guardar como<\/strong>. Elige el formato que prefieras.
- Ahorra más ancho de banda<\/strong>. El ancho de banda es la velocidad a la que tu servidor puede transferir datos a tus usuarios finales en un tiempo determinado. WebP puede liberar espacio de ancho de banda, lo que permite a los sitios web ofrecer más contenido. Esto es especialmente importante para los sitios web con muchas imágenes, como los blogs de comida<\/a>, viajes<\/a> o fotografía.<\/li>\n\n\n\n