Saltar al contenido
Imágenes y medios

Evita que WordPress comprima tus imágenes al 82%

WordPress recodifica cada JPEG que genera con calidad 82 en una escala de 0 a 100. Ese valor por defecto vive en WP_Image_Editor::get_default_quality() y se aplica a

Publicada

WordPress recodifica cada JPEG que genera con calidad 82 en una escala de 0 a 100. Ese valor por defecto vive en WP_Image_Editor::get_default_quality() y se aplica a cada versión derivada que WordPress recorta a partir de tu subida: thumbnail, medium, medium_large, large y todos los tamaños adicionales que registre tu tema. Para fotografías, 82 es un equilibrio razonable entre peso del archivo y artefactos. Para capturas de pantalla, capturas de interfaz, gráficos, logos y cualquier cosa con texto nítido o color plano, 82 es visiblemente destructivo: aparece ruido de mosquito alrededor de cada letra y bandas en los degradados suaves.

Para cambiarlo, añade un filtro y regenera tus miniaturas. Para arreglar las capturas de pantalla en concreto, la mejor respuesta suele ser dejar de entregarle un JPEG a WordPress de entrada.

De dónde sale realmente el número 82

WordPress bajó su calidad JPEG por defecto de 90 a 82 en la versión 4.5 (2016) como optimización del peso de página. El valor lo devuelve get_default_quality() en wp-includes/class-wp-image-editor.php y se lee cada vez que el editor activo —WP_Image_Editor_Imagick si tu hosting tiene Imagick, o WP_Image_Editor_GD en caso contrario— escribe un archivo redimensionado.

El detalle importante: el 82 se aplica por cada tamaño derivado, no una sola vez. Subes una imagen y WordPress la pasa por el codificador varias veces, recuantizándola a calidad 82 en cada pasada. El archivo original que subiste queda intacto siempre que esté por debajo del umbral de imagen grande (2560px en el lado largo). Si lo supera, WordPress genera un -scaled.jpg recodificado a calidad 82 y sirve ese como tamaño “full”. Así que “mi imagen a resolución completa se ve bien pero la versión de la página se ve emborronada” casi siempre es un srcset eligiendo un subtamaño de calidad 82 o el archivo -scaled.

Cómo cambiar la calidad

Solo hay un filtro que enganchar. wp_editor_set_quality es el moderno y canónico: se dispara tanto para JPEG como para WebP y recibe el tipo MIME, así que puedes ramificar:

add_filter( 'wp_editor_set_quality', function ( $quality, $mime_type ) {
    if ( 'image/jpeg' === $mime_type ) {
        return 92; // up from 82
    }
    return $quality;
}, 10, 2 );

Ponlo en un pequeño mu-plugin (wp-content/mu-plugins/) o en un plugin específico del sitio. functions.php también funciona, pero pierdes el ajuste en cuanto cambies de tema.

También verás que recomiendan el filtro más antiguo jpeg_quality. Sigue disparándose (WordPress lo aplica justo después de wp_editor_set_quality, solo para JPEG), pero no hay razón para enganchar los dos: wp_editor_set_quality cubre todo lo que hacía el antiguo y más.

Algo que todo el mundo olvida: este filtro solo afecta a las imágenes codificadas después de que esté activo. Cada miniatura que ya está en wp-content/uploads se escribió a 82 y seguirá en 82. Regenéralas:

wp media regenerate --yes

Si no usas WP-CLI, el plugin Regenerate Thumbnails hace lo mismo desde el administrador.

Antes de decidirte por un número, vale la pena ver qué le hace realmente una calidad concreta a tu imagen en lugar de adivinar. Nuestra herramienta de calidad JPEG para WordPress recodifica una muestra en el navegador en cada nivel de calidad para que veas aparecer los artefactos: hace que la diferencia entre 82, 90 y 100 sea evidente en una captura de pantalla de un modo que un número en un archivo de configuración nunca conseguirá.

La mejor solución para capturas de pantalla y gráficos planos

Subir el número del JPEG trata el síntoma. El problema real con las capturas de pantalla es que el JPEG es el códec equivocado para ellas. La compresión DCT del JPEG está ajustada para los degradados fotográficos; se cae a pedazos en los bordes duros de negro sobre blanco del texto y de la interfaz, que es exactamente por lo que la calidad 82 se ve mucho peor en una captura que en la foto de una playa.

Sube un PNG en su lugar. WordPress mantiene los subtamaños PNG como PNG, y el PNG es sin pérdidas: el filtro de calidad no lo toca, así que no hay artefactos en ningún tamaño, solo un remuestreo limpio. Para una captura de pantalla, un PNG bien optimizado suele ser más pequeño que un JPEG de alta calidad de la misma imagen de todas formas, porque el color plano se comprime bien en PNG y fatal en JPEG.

Si quieres los archivos más ligeros de un formato con pérdidas pero sin el daño en los bordes del JPEG, el WebP es el término medio, pero sigues controlando su calidad con el mismo filtro wp_editor_set_quality mostrado arriba, ramificando en image/webp.

Qué no hacer

No pongas la calidad a 100 de forma global. Esta es la respuesta más votada en la mitad de los hilos de foros, y está mal. El JPEG a calidad 100 no es sin pérdidas —sigue cuantizando— pero infla cada fotografía de tu sitio de forma considerable sin ganancia visible, lastrando el LCP y las Core Web Vitals. Sube el número para el formato que lo necesite, o cambia de formato para los gráficos; no arrases con la compresión de todo el sitio.

No edites class-wp-image-editor.php. Cambiar el valor de retorno de get_default_quality() en el núcleo funciona hasta que el siguiente wp core update lo sobrescriba en silencio. Usa el filtro.

No desactives los tamaños de imagen para “evitar la compresión”. Apagar la generación de miniaturas no detiene la recodificación: rompe el srcset responsive, de modo que los navegadores descargan tu imagen a tamaño completo en los móviles. Otro problema, con un resultado peor.

No des por hecho que volver a subir arregla las imágenes existentes. Si pones el filtro pero te saltas el paso de regenerar, cada versión derivada antigua sigue en calidad 82. El filtro solo mira hacia adelante.

No culpes al archivo -scaled si tus imágenes están por debajo de 2560px: esa ruta nunca se ejecuta para ellas. Si la estás alcanzando y quieres que se sirva el original intacto, ese es un ajuste aparte; consulta cómo desactivar las imágenes scaled.

¿Sigues atascado?

Si un tamaño concreto se sigue viendo mal después de regenerar, confirma qué archivo está sirviendo realmente la página: abre la imagen en una pestaña nueva y comprueba si el nombre de archivo termina en un sufijo de dimensiones (-1024x768.jpg) o en -scaled.jpg. El inspector de tamaños de imagen muestra cada versión derivada que WordPress genera a partir de una sola subida, así puedes ver exactamente qué tamaño le está entregando tu srcset al navegador y dejar de depurar el archivo equivocado.