Optimización de imágenes en WordPress para nitidez

¿Está utilizando los tamaños de imágenes correctos?
Puede ser que para la vista en PC los tamaños configurados por su theme u opciones del administrador de wordpress sean superiores a la resolución de las imágenes que está subiendo.
La mayoría de usuarios sube sus imágenes en PNG aunque es recomendable que se suba en WEBP, sin embargo por mi parte sigo subiéndolos en PNG optimizando el peso de las mismas pasando por 2 páginas:

• compressor.io
• tynipng

De igual manera, es preferible utilizar imágenes que ya cuenten con una calidad de nitidez alta.

Igualmente me pasa a mi tambien y no se por que, ya echo varias cosas y aun sigue igual, la verdad que me recomiendan?

El asunto está en el tamaño de las imágenes, tu mismo lo dices, en móvil se ven perfectas, en PC no. Eso es porque el tamaño para PC es insuficiente o incorrecto.

Cuidado también con los plugins de optimización / webp, hacen muchas veces que pierdan calidad y las imágenes no se vean igual de bien que cuando las subimos al wp.

@Elvis.Graph, por lo que comentas pinta que el problema lo podrías tener con los srcset, ya que dices que en móvil se ven bien las imágenes pero en PC no.

Cuando subes una imagen a WordPress, WordPress la redimensiona a distintos tamaños (1920x1080, 1024x576...) y luego sirve todos los tamaños vía srcset para mostrar la imagen al tamaño más adecuado para la pantalla. Pero el srcset no es mágico y WP no es listo, puede ser que en pantallas grandes te esté mostrando imágenes de menor tamaño del que debería. Esto es fácil de comprobar haciendo clic derecho en una imagen y le das a Abrir imagen en nueva pestaña, al final de la url te pondrá el tamaño, algo en plan "nombre-imagen-150x150.jpg".

Otra manera es simplemente redimensionando la pantalla del navegador, fíjate si cambia mucho la calidad de la imagen.

Si inspeccionas el código y buscas la etiqueta <img> de la imagen verás las fuentes del srcset con los distintos tamaños que emplea y a qué tamaños de pantalla (max-widths). Si no ves ninguno, es recomendable usar siempre srcset y tal vez te soluciona el problema.

Sam40 dijo:

El asunto está en el tamaño de las imágenes, tu mismo lo dices, en móvil se ven perfectas, en PC no. Eso es porque el tamaño para PC es insuficiente o incorrecto.

Cuidado también con los plugins de optimización / webp, hacen muchas veces que pierdan calidad y las imágenes no se vean igual de bien que cuando las subimos al wp.

Hacer clic para expandir...

Por no hablar que los plugins de optimización de imágenes dependen mucho de ciertos módulos PHP, y no todos se comportan igual y en cada servidor puede ser una historia diferente.

Yo uso WebP Express para convertirlo todo a webp, pero no ha sido fácil dar con una configuración exacta en la que no haya demasiada perdida de calidad. Incluso hay casos en los que el webp final puede acabar pesando más que el jpg o png de origen.

Yo siempre exporto en jpg pero con perfil rgb, me quedan las imagenes en buena resolucion y tamaño pequeño

yo prefiria usar el nuevo formato que es webp ,personalmente lo sigo usando hasta ahora y su calidad de imagen es bastante discreta para una web

Andre3600 dijo:

yo prefiria usar el nuevo formato que es webp ,personalmente lo sigo usando hasta ahora y su calidad de imagen es bastante discreta para una web

Hacer clic para expandir...

No funciona muy bien para el SEO por lo que he podido mirar en google imágenes.

El problema que está teniendo quizás sea por el tipo de plantilla, algún plugin o la configuración de compresión.

Hay algunos plugins para evitar que las subidas se compriman.

Creo que tú web no es responsiva, x eso no adapta las imágenes a todo tipo d pantallas trabaja en eso aquí vas en entrar la solución entiendo es estresante pasar por eso pero todo tiene solución

Cuando subes una imagen a WordPress el te indica cual es el tamaño recomendado, pero si la montas con un tamaño más pequeño esa imagen se estira y por eso sale borrosa.

En cuanto a formato por lo general utilizo Imagify en versión Infinite en los proyectos para que convierta las imágenes en formato WebP

Busca si la etiqueta que estás empleando tiene característica cover ya que suele generar ese problema, usa un tamaño dinámico con porcentajes y adiós problema

prueba usar imagenes jpg con perfil rgb