Lidiar con un sitio web lento es increíblemente frustrante. Después de ayudar a miles de lectores de WPBeginner a acelerar sus sitios, hemos descubierto que un problema aparece más que cualquier otro: imágenes grandes y no optimizadas.
Muchos propietarios de sitios web temen que reducir el tamaño de sus imágenes las haga ver borrosas y poco profesionales. Lo entendemos. La buena noticia es que no tienes que elegir entre páginas de carga rápida y fotos hermosas de alta calidad.
Hemos perfeccionado un proceso simple para la optimización de imágenes que usamos en todos nuestros propios sitios web. Esta guía te guiará a través de esos pasos exactos y amigables para principiantes. Aprenderás a hacer tus imágenes más pequeñas sin sacrificar la calidad.
Dado que esta es una guía completa sobre optimización de imágenes para la web, hemos creado una tabla de contenido fácil de seguir:
- ¿Qué es la optimización de imágenes?
- ¿Cuáles son los beneficios de la optimización de imágenes?
- Cómo guardar y optimizar imágenes para el rendimiento web
- Las mejores herramientas y programas de optimización de imágenes
- Los mejores plugins de optimización de imágenes para WordPress
- Reflexiones finales y mejores prácticas para la optimización de imágenes
- Tutorial en video
- Preguntas frecuentes sobre la optimización de imágenes
- Recursos adicionales para mejorar el rendimiento de WordPress
1. ¿Qué es la optimización de imágenes?
La optimización de imágenes es el proceso de guardar y entregar imágenes en el tamaño de archivo más pequeño posible sin reducir la calidad general de la imagen.
Si bien el proceso suena complejo, en realidad es bastante fácil hoy en día. Puedes usar uno de los muchos plugins y herramientas de optimización de imágenes para comprimir automáticamente las imágenes hasta en un 80% sin ninguna pérdida visible en la calidad de la imagen.
Aquí tienes un ejemplo de una imagen optimizada frente a una no optimizada:
Como puedes ver, cuando se optimiza correctamente, la misma imagen puede ser hasta un 80% más pequeña que la original sin ninguna pérdida de calidad. En este ejemplo, la imagen es un 52% más pequeña.
¿Cómo funciona la optimización de imágenes?
En términos sencillos, la optimización de imágenes funciona mediante el uso de tecnología de compresión.
La compresión puede ser 'con pérdida' o 'sin pérdida'.
La compresión sin pérdida reduce el tamaño total del archivo sin ninguna pérdida de calidad de imagen. Con la compresión con pérdida, puede haber una pequeña pérdida de calidad, pero idealmente, no será perceptible para sus visitantes.
¿Qué significa optimizar imágenes?
Es posible que haya recibido una recomendación para optimizar imágenes de su soporte de hosting de WordPress o de una herramienta de prueba de velocidad y se pregunte qué necesita hacer.
Necesitará reducir el tamaño del archivo de sus imágenes optimizándolas para la web. Le mostraremos cómo hacerlo paso a paso.
2. ¿Cuáles son los beneficios de la optimización de imágenes?
Si bien hay muchos beneficios en la optimización de sus imágenes, aquí están los principales que debe conocer:
- Mayor velocidad del sitio web
- Mejores rankings SEO
- Una mayor tasa de conversión general para ventas y prospectos
- Menos almacenamiento y ancho de banda (lo que puede reducir los costos de hosting y CDN)
- Copias de seguridad del sitio web más rápidas (lo que puede reducir el costo del almacenamiento de copias de seguridad)
Las imágenes son el segundo elemento más pesado en una página web después de los videos. Según el archivo HTTP, las imágenes a menudo constituyen la mayor parte del tamaño total de archivo de una página.
Dado que sabemos que los sitios web rápidos se clasifican más alto en los motores de búsqueda (SEO) y tienen mejores conversiones, la optimización de imágenes es algo que todo sitio web de negocios debe hacer si quiere tener éxito en línea.
Ahora podrías preguntarte qué tanta diferencia puede hacer realmente la optimización de imágenes.
Un estudio fundamental de Strangeloop encontró que un retraso de un segundo en el tiempo de carga podría costar el 7% de las ventas, un 11% menos de páginas vistas y una disminución del 16% en la satisfacción del cliente. Hoy en día, con las expectativas de los usuarios aún más altas, el impacto es aún más significativo.
Si estas no son suficientes razones para acelerar tu sitio web, entonces debes saber que los motores de búsqueda como Google también dan un tratamiento SEO preferencial a los sitios web que cargan más rápido.
Esto significa que al optimizar tus imágenes para la web, puedes mejorar la velocidad del sitio web y aumentar los rankings SEO de WordPress.
3. Cómo guardar y optimizar imágenes para el rendimiento web
La clave para una optimización de imágenes exitosa para el rendimiento web es encontrar el equilibrio perfecto entre el tamaño de archivo más pequeño y una calidad de imagen aceptable.
Las tres cosas que juegan un papel importante en la optimización de imágenes son:
- Formato de archivo de imagen (JPEG vs. PNG vs. GIF)
- Compresión (mayor compresión = menor tamaño de archivo)
- Dimensiones de la imagen (alto y ancho)
Al elegir la combinación correcta de los tres, puedes reducir el tamaño de tu imagen hasta en un 80%.
Echemos un vistazo a cada uno de estos con más detalle.
1. Formato de archivo de imagen
Para la mayoría de los propietarios de sitios web, los únicos tres formatos de archivo de imagen que realmente importan son JPEG, PNG y GIF. Elegir el tipo de archivo correcto juega un papel importante en la optimización de imágenes.
Para simplificar, querrás usar JPEGs para fotos o imágenes con muchos colores, PNGs para imágenes simples o transparentes, y GIFs solo para imágenes animadas.
Para aquellos que no conocen la diferencia entre cada tipo de archivo:
- El formato de imagen PNG utiliza compresión sin pérdida. Esto significa que reduce el tamaño del archivo sin ninguna pérdida de calidad, lo que lo convierte en una excelente opción para logotipos, gráficos con mucho texto e imágenes donde necesitas líneas nítidas y transparencia.
- Por otro lado, JPEG es un formato de archivo comprimido que reduce ligeramente la calidad de la imagen para ofrecer un tamaño de archivo significativamente menor.
- Mientras que GIF solo usa 256 colores junto con compresión sin pérdidas, lo que lo convierte en la mejor opción para imágenes animadas.
En WPBeginner, usamos una combinación de estos formatos. Sin embargo, muchos sitios web modernos ahora están utilizando el formato WebP. WebP a menudo proporciona una compresión aún mejor que JPEG y PNG (lo que significa archivos más pequeños) con una calidad excelente. La mayoría de los navegadores ahora lo admiten, y muchos complementos de optimización pueden convertir automáticamente tus imágenes a WebP para un gran aumento de velocidad.
Para más información sobre formatos de imagen, consulta nuestra guía sobre WebP vs. PNG vs. JPEG: cuál es el mejor formato de imagen para WordPress.
2. Compresión
Lo siguiente es la compresión de imágenes, que juega un papel muy importante en la optimización de imágenes.
Existen diferentes tipos y niveles de compresión de imágenes disponibles. La configuración para cada uno variará según tu herramienta de compresión de imágenes.
La mayoría de las herramientas de edición de imágenes como Adobe Photoshop, ON1 Photo, GIMP, Affinity Photo y otras tienen funciones de compresión de imágenes integradas.
También puedes guardar las imágenes normalmente y luego usar una herramienta web como TinyPNG o JPEGmini para una compresión de imágenes más fácil.
Aunque requieren algo de esfuerzo manual, estos dos métodos te permiten comprimir imágenes antes de subirlas a WordPress, y esto es lo que hacemos en WPBeginner.
También hay varios plugins populares de WordPress como Optimole y EWWW Image Optimizer que pueden comprimir automáticamente las imágenes cuando las subes por primera vez. Esto es conveniente, y muchos principiantes e incluso grandes corporaciones prefieren usar estos plugins de optimización de imágenes.
Compartiremos más sobre el uso de plugins de WordPress más adelante en el artículo.
3. Dimensiones de la imagen
Normalmente, cuando importas una foto desde tu teléfono o una cámara digital, tiene una resolución muy alta y dimensiones de archivo grandes (alto y ancho).
Cuando obtienes fotos de tu teléfono o una cámara digital, a menudo tienen dimensiones de píxeles muy grandes (como 4000 píxeles de ancho) y pueden tener una configuración de 'resolución' de 300 DPI.
Aquí tienes un consejo clave para imágenes web: puedes ignorar completamente el DPI. Esa configuración es para imprimir. Para la web, lo único que importa son las dimensiones en píxeles (alto y ancho).
Reducir las dimensiones de la imagen a algo más razonable puede disminuir significativamente el tamaño del archivo de imagen. Puedes simplemente cambiar el tamaño de las imágenes usando software de edición de imágenes en tu computadora.
Por ejemplo, tomamos una foto con unas dimensiones originales enormes de 4900 × 3200 píxeles. El tamaño del archivo original era de 1.8 MB.
Elegimos el formato JPEG para una mayor compresión y cambiamos las dimensiones a 1200×795 píxeles. El tamaño del archivo se redujo a solo 103 KB. Eso es un 94% más pequeño que el tamaño original del archivo.
Ahora que conoces los tres factores importantes en la optimización de imágenes, veamos varias herramientas de optimización de imágenes para propietarios de sitios web.
4. Las mejores herramientas y programas de optimización de imágenes
Como mencionamos anteriormente, la mayoría del software de edición de imágenes viene con configuraciones de optimización y compresión de imágenes.
Fuera del software de edición de imágenes, también existen varias herramientas gratuitas y potentes de optimización de imágenes que puedes usar para optimizar imágenes para la web (con solo unos pocos clics).
Recomendamos usar estas herramientas para optimizar imágenes antes de subirlas a WordPress, especialmente si eres un perfeccionista.
Este método te ayuda a ahorrar espacio en disco en tu cuenta de hosting de WordPress, y garantiza la imagen más rápida con la mejor calidad, ya que revisas manualmente cada imagen.
Adobe Photoshop
Adobe Photoshop es una aplicación premium de edición de imágenes que te permite exportar imágenes con un tamaño de archivo más pequeño para la web.
Usando el cuadro de diálogo de exportación, puedes elegir un formato de archivo de imagen (JPG, PNG, GIF) que te dé el tamaño de archivo más pequeño.
También puedes reducir la calidad de la imagen, los colores y otras opciones para disminuir aún más el tamaño del archivo.
GIMP
GIMP es una alternativa gratuita y de código abierto a Adobe Photoshop. Se puede usar para optimizar tus imágenes para la web. La desventaja es que no es tan fácil de usar como otras soluciones en esta lista.
Primero, necesitas abrir tu imagen en GIMP y luego seleccionar la opción Archivo » Exportar como…. Esto abrirá el cuadro de diálogo Exportar imagen, donde puedes darle un nuevo nombre a tu archivo. Luego, necesitas hacer clic en el botón ‘Exportar’.
Ahora verás las opciones de exportación de imagen. Para archivos JPEG, puedes usar el control deslizante ‘Calidad’ para seleccionar el nivel de compresión y reducir el tamaño del archivo.
Finalmente, deberías hacer clic en el botón ‘Exportar’ para guardar el archivo de imagen optimizado.
TinyPNG
TinyPNG es una aplicación web gratuita que utiliza una técnica de compresión inteligente con pérdida para reducir el tamaño de tus archivos PNG y JPEG. Todo lo que tienes que hacer es ir a su sitio web y subir tus imágenes usando un simple arrastrar y soltar.
Comprimirán la imagen y te darán un enlace de descarga.
También tienen una extensión para Adobe Photoshop, que es lo que usamos como parte de nuestro proceso de edición de imágenes porque te permite acceder a TinyPNG desde dentro de Photoshop.
Para desarrolladores, tienen una API para convertir imágenes automáticamente. Además, para principiantes, tienen un plugin de WordPress que lo hará por ti. Hablaremos de esto más adelante.
JPEGmini
JPEGmini utiliza una potente tecnología de compresión con pérdida que reduce significativamente el tamaño de las imágenes sin afectar su calidad percibida. También puedes comparar la calidad de la imagen original y la imagen comprimida para verlo tú mismo.
Puedes usar su versión web de forma gratuita o comprar el programa para tu computadora. También tienen una API de pago para automatizar el proceso para tu servidor.
ImageOptim
ImageOptim es una utilidad para Mac que te permite comprimir imágenes sin perder calidad, encontrando los mejores parámetros de compresión y eliminando perfiles de color innecesarios.
Una alternativa para Windows es Trimage.
5. Los mejores plugins de optimización de imágenes para WordPress
Creemos que la mejor manera de optimizar tus imágenes es hacerlo antes de subirlas a WordPress. Sin embargo, si administras un sitio con varios autores o necesitas una solución automatizada, puedes probar un plugin de compresión de imágenes para WordPress.
Aquí tienes nuestra lista de los mejores plugins de compresión de imágenes para WordPress:
- Optimole, un popular plugin del equipo detrás de ThemeIsle
- EWWW Image Optimizer
- Compresión de imágenes JPEG, PNG y WebP, un plugin del equipo de TinyPNG mencionado anteriormente
- Imagify, un plugin del popular equipo de WP Rocket
- ShortPixel Image Optimizer
- Smush
- reSmush.it
- Envira Gallery es un plugin de galería para WordPress con compresión de imágenes integrada
Estos plugins de optimización de imágenes para WordPress te ayudarán a acelerar tu sitio web.
6. Reflexiones finales y mejores prácticas para la optimización de imágenes
Si no estás guardando imágenes optimizadas para la web, entonces necesitas empezar a hacerlo ahora. Hará una gran diferencia en la velocidad de tu sitio, y tus usuarios te lo agradecerán.
Sin mencionar que los sitios web más rápidos son excelentes para el SEO, y es probable que veas un aumento en tus rankings en los motores de búsqueda.
Fuera de la optimización de imágenes, las dos cosas que te ayudarán significativamente a acelerar tu sitio web son usar un plugin de caché de WordPress y usar una CDN de WordPress.
En WPBeginner, usamos WP Rocket porque combina potentes funciones de almacenamiento en caché y optimización de imágenes, incluida la carga diferida (que significa que las imágenes solo se cargan cuando un visitante se desplaza hacia ellas) y el soporte WebP, en una única solución.
Si usas el plugin Envira Gallery, también recomendamos su servicio Envira CDN. Es una CDN específica para imágenes que hace que tus galerías de fotos carguen increíblemente rápido sin la complejidad de una configuración de CDN tradicional.
Alternativamente, puedes usar una empresa de hosting de WordPress administrado porque a menudo ofrecen caché y CDN como parte de la plataforma.
Tutorial en video
Preguntas frecuentes sobre la optimización de imágenes
A lo largo de los años ayudando a los usuarios a mejorar la velocidad de sus sitios web, hemos respondido muchas preguntas sobre la optimización de imágenes. Aquí están las respuestas a algunas de las más comunes.
1. ¿Cuál es el mejor formato de imagen para la web?
Depende del tipo de imagen. Para fotografías con muchos colores, JPEG suele ser la mejor opción. Para gráficos simples, logotipos o imágenes que requieren un fondo transparente, PNG es ideal. Los GIF solo deben usarse para animaciones. El formato más nuevo, WebP, también es una excelente opción que proporciona gran calidad con tamaños de archivo pequeños.
2. ¿La optimización de imágenes reduce su calidad?
No siempre. La compresión ‘sin pérdidas’ (lossless) reduce el tamaño de los archivos sin ninguna pérdida de calidad. Incluso con la compresión ‘con pérdidas’ (lossy), el objetivo es encontrar un equilibrio donde el tamaño del archivo se reduzca drásticamente, pero cualquier cambio de calidad sea virtualmente imperceptible para el ojo humano.
3. ¿Cuál es un buen tamaño de archivo para imágenes web?
No existe un tamaño perfecto, pero un buen objetivo para la mayoría de las imágenes es menos de 150 KB. Para imágenes grandes de ancho completo, podrías llegar hasta 500 KB. El objetivo principal es siempre obtener el archivo más pequeño posible manteniendo la imagen nítida y clara en tu sitio.
4. ¿Cómo mejora la optimización de imágenes el SEO?
Los motores de búsqueda como Google utilizan la velocidad de carga de la página como un factor de clasificación. Dado que las imágenes suelen ser los archivos más grandes de una página, optimizarlas hace que tu sitio web cargue más rápido. Esta mejora de velocidad puede conducir a mejores clasificaciones SEO y una mejor experiencia para tus visitantes.
5. ¿Puedo optimizar imágenes ya subidas a WordPress?
Sí. La mayoría de los plugins de optimización de imágenes para WordPress incluyen una función de ‘optimización masiva’. Esta herramienta puede escanear toda tu biblioteca multimedia y comprimir todas tus imágenes existentes, lo cual es perfecto para mejorar la velocidad de un sitio web establecido.
Recursos adicionales para mejorar el rendimiento de WordPress
Esperamos que este artículo te haya ayudado a aprender cómo optimizar tus imágenes en WordPress. También puedes querer ver otros artículos relacionados con la mejora del rendimiento de WordPress:
- La guía definitiva para mejorar la velocidad y el rendimiento de WordPress
- Cómo acelerar el rendimiento de WooCommerce
- Cómo descargar medios de WordPress para mejorar la velocidad del sitio web
- Los mejores plugins de caché de WordPress para acelerar tu sitio web
- Cómo optimizar las Core Web Vitals para WordPress (Guía definitiva)
- Cómo reducir el tiempo de primera respuesta (TTFB) en WordPress – Consejos de expertos
- Cómo usar el plugin GTmetrix para mejorar el rendimiento del sitio de WordPress
- Hosting de WordPress más rápido (Pruebas de rendimiento)
- Métricas importantes para medir en tu sitio de WordPress
- Cómo realizar correctamente una prueba de velocidad de sitio web
- Cómo realizar una prueba de estrés a un sitio web de WordPress
Si te gustó este artículo, suscríbete a nuestro canal de YouTube para obtener tutoriales en video de WordPress. También puedes encontrarnos en Twitter y Facebook.
Diane Talbotier
Hola, ¿redimensionar significa cambiar el tamaño de las imágenes tal como se muestran en el sitio web, o cambiar el tamaño del archivo, por favor?
Y ¿cómo sé cuál es el tamaño óptimo?
Soporte de WPBeginner
Dependería de a qué te refieras, para la compresión en esta guía, es el tamaño del archivo. También puedes reducir el ancho y la altura de una imagen si es demasiado grande. Tu tema específico determinaría el tamaño de imagen específico que deseas usar.
Administrador
Terri
Mencionaste en tu ejemplo de optimización que tu foto original era de 300 ppp, y luego la optimizaste a un tamaño de archivo más pequeño. Pero no dijiste cuál era el ppp objetivo. ¿Es 72 para la web? ¿O más alto? Gracias por el artículo informativo.
Soporte de WPBeginner
Eso dependería de tu preferencia personal y de cuán grandes quieras/necesites que sean las imágenes.
Administrador
Romel
muchas gracias, aclaró muchas dudas.
Soporte de WPBeginner
Glad our article was helpful
Administrador
Odenyi Emmanuel Chidera
Lo que más me gusta de wpbeginner es que te dan información sobre qué implementar en tu propio sitio, pero también te dicen qué están usando ellos en su propio sitio. Realmente me ayuda a decidir más rápido. Aprender de un maestro siempre es más fácil. Gracias.
Soporte de WPBeginner
You’re welcome, glad you like our content
Administrador
Luz Manalo-Cruz
He comprimido imágenes a través de TinyPNG y he intentado reemplazar las imágenes más pesadas en mi sitio con estas (es decir, eliminé las fotos pesadas y subí las comprimidas). Sin embargo, la biblioteca de medios todavía está subiendo las imágenes antiguas y pesadas. ¿Significa eso que no puedo reemplazar las imágenes antiguas ya subidas? ¿Solo subirá las imágenes comprimidas que no se han subido en absoluto?
Soporte de WPBeginner
Si estás reemplazando las imágenes más pesadas, querrás asegurarte de que no tengas caché en tu sitio que esté mostrando la imagen antigua y que cuando subas la nueva imagen, estés subiendo la imagen correcta.
Administrador
Giovanna
Gracias por el artículo informativo, Syed.
De ahora en adelante, me aseguraré de usar siempre imágenes optimizadas. ¿Me recomiendas que regrese a las publicaciones ya publicadas y reemplace mis imágenes con unas optimizadas?
Soporte de WPBeginner
If possible we would recommend updating your older images, the plugins we recommended should handle that for you
Administrador
Percy Young
Gracias por tu publicación. Muchas herramientas útiles. Me pregunto si hay algo que se pueda hacer para cambiar el tamaño de las imágenes que se han subido previamente, y cómo eliminar las imágenes que WordPress ya no está utilizando.
Soporte de WPBeginner
Si necesitas generar nuevas imágenes, puedes seguir nuestra guía aquí:
https://www.wpbeginner.com/plugins/regenerate-thumbnails-new-image-sizes-wordpress/
Para eliminar las imágenes extra, hay plugins de limpieza de medios que puedes usar.
Administrador
Soporte de WPBeginner
Glad you’ll use our recommendations
Administrador
Dr Amandeep Sandhu
¡Gracias por compartir tales ideas...!
Soporte de WPBeginner
You’re welcome, thanks for reading our articles
Administrador
İbrahim BOZKURT
Soy un desarrollador de WordPress. Escribo desde Turquía.
Muy difícil encontrar recursos de WordPress de calidad.
Los descubrí. No sabía inglés pero aprendí inglés. Gracias a ustedes todo.
Soporte de WPBeginner
Thank you for reading our articles and congratulations on learning a new language
Administrador
Felipe Adan Lerma
Hola, ¿parece que WordPress ha incorporado algo de esto en su proceso actual de carga de imágenes, al menos en el segmento Premium?
Pregunto porque ahora tengo la opción de elegir el tamaño real o algo más grande o más pequeño.
¿O ese proceso no es una optimización / reducción del tamaño de la imagen?
¡Muchas gracias! Tema muy importante y útil.
Adan
Soporte de WPBeginner
Parece que podrías estar hablando de WordPress.com y ellos tienen plugins personalizados configurados para los sitios en su servicio
Administrador
Felipe Adan Lerma
Ahhh, sí, olvido que los dos WP difieren, lo siento. Todavía estoy tratando de averiguar cómo trabajar donde estoy con WP y definitivamente es a través de sus sitios .com. Muchas gracias entonces, WP – Adan
Soporte de WPBeginner
No worries, should it help we have our article listing the differences here:
https://www.wpbeginner.com/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
Anna
¡¡Información muy útil!! Estaba investigando cómo hacer esto cuando llegó tu correo. Me ahorró tiempo y esfuerzo y tenía justo el consejo que buscaba.
Soporte de WPBeginner
Glad our guide and newsletter could be helpful
Administrador
Lindsay
Al guardar en Photoshop, ¿qué ancho sugieres para un rendimiento web óptimo?
Mi tema es guardar 1600x1050 para un encabezado óptimo, pero ¿qué debo hacer para las imágenes del cuerpo? El diseñador del tema no tiene una recomendación.
Soporte de WPBeginner
Si estás siguiendo los otros pasos de este artículo, entonces el tamaño de la imagen sería el que mejor se ajuste a las dimensiones de tu contenido para que WordPress no necesite redimensionar la imagen.
Administrador
edccde
Por favor, actualiza ese video de YouTube. Primero que nada, Jpegmini no es una aplicación web, es un software que tengo que instalar en mi PC.
Soporte de WPBeginner
Thank you for letting us know about the video, we’ll certainly look into updating the video
Administrador
Jackie
¿Hay alguna forma de comprimir imágenes ya subidas a WordPress? ¿O necesito comprimir todas mis imágenes y luego volver a subirlas a WP? Gracias de antemano por los consejos.
Irina
Hola,
Necesito un consejo: Necesito subir imágenes de baja y alta resolución (1200 píxeles a 300 ppp) para que mis clientes puedan descargarlas. No tengo preguntas sobre la optimización de imágenes de baja resolución. ¿Cómo puedo guardar imágenes de alta resolución? El tamaño es de hasta 2 MB. Tengo cientos de miles de imágenes...
Ratan Kumar
Esta publicación es increíble y realmente agrega valor a mi sitio. Sin embargo, recientemente intenté guardar imágenes de flipkart pero se guardaron en un formato de píxeles muy bajo. Me pregunto si puedes ayudarme a averiguar cómo hacerlo.
Ray
Ya subí masivamente 1500 imágenes de productos que estaban conectadas a URLs de imágenes que encontré en internet.
Ahora que ya tengo esas 1500 imágenes en mi Biblioteca de Medios, ¿cómo puedo regresar y redimensionarlas y comprimirlas?
Además, estoy confundido sobre si redimensionar significa cambiar el tamaño de las imágenes tal como se muestran en el sitio web, o cambiar el tamaño del archivo.
¡Gracias!
Sara Lewis
¿qué hay del plugin ewww image optimizer?
Soporte de WPBeginner
Hola Sara,
Sí, es una buena alternativa. Sin embargo, para obtener mejores resultados, todavía recomendaríamos optimizar las imágenes en su programa de edición de imágenes antes de subirlas a WordPress.
Administrador
Donna
Viajaré a un lugar donde la conectividad a internet es limitada y costosa. Por lo tanto, quiero reducir el tamaño de archivo de mis fotos antes de conectarme para subirlas a mi blog. ¿Alguien podría recomendarme qué resolución y dpi serían buenos para usar? La aplicación que planeo usar pide tres medidas:
resolución – de 200 a 2048
DPI – de 72×72 a 300×300
calidad jpeg (nivel de compresión) – de 0.00 a 1.00
Carrie
En el video ella cambia su foto. Entiendo la pantalla en PS. Pero no has explicado cuáles deberían ser el ancho y el alto en píxeles para WP, el límite es de 2 MB. ¿Cuál sería un buen estándar para los sliders, etc. para un sitio de WP?
Carrie
Perdón por ser el tonto en la esquina, pero ¿alguien podría aclarar una cosa? Instalé el plugin WP Smush it y he estado trabajando lentamente en todas las fotos que he subido a mi sitio durante los últimos 2 años. Estoy haciendo 50 a la vez, el límite gratuito. Sin embargo, ahora que tengo el plugin, para futuras cargas de fotos, ¿tenerlo significa que no tengo que usar ningún otro programa para cambiar el tamaño de mis fotos antes de subirlas a mi sitio de WP? Si tengo una foto de 8 MB y la subo a mi sitio, ¿el plugin hace todo por mí? Solo quiero confirmar que la foto original no se sigue subiendo y guardando en mi servidor de alojamiento, SiteGround. Mi sitio es muy lento, he ejecutado toneladas de diagnósticos y todavía no puedo entender por qué, excepto que todo apunta a mis fotos. ¡Gracias!
Tony Squibb
Hola Carrie, Definitivamente no soy un experto de ninguna manera, pero tengo experiencia con WP Smush it y sí, las futuras cargas deberían ser 'aplastadas' automáticamente. Hay una pequeña notificación en la galería de medios mientras lo haces.
Para verificar las causas de tu sitio lento puedes usar GTmetrix y luego abrir la página de cascada (waterfall) donde se mostrarán los tiempos de carga de los elementos individuales de la página. Una vez que sepas cuál es el problema, podrás abordarlo.
I hope that helps from one ‘dunce’ to another
Carrie
Hola Tony:
Thanks for weighing in! Unfortunately I uninstalled WP Smush and tried EWWW Image Optimizer along with the Thumbnail Regerate plugin (based on another bloggers suggestion) and royally messed up the photos on my site. I’m a newb with regards to how to manage my files through the FTP on my web host, so I ended up deleting a bunch of images (as in hundreds) and re-uploading them after resizing them manually in an image program. Turns out that too was a bad idea. Now I have a bunch of error messages when I render my site in my Google Console because when Google crawls my site, those files are now gone or moved. AGH! I’m on the verge of simply paying someone to revamp my site or quitting altogether. But I really appreciate that you took the time to leave a helpful comment.
¡Feliz Año Nuevo! Que el 2017 sea mejor que el 2016.
Jeff
hola
¿Cuáles son los mejores plugins de optimización de imágenes para sitios de WordPress?
Gagan
Estaba pensando, ¿qué pasaría si subiera mis imágenes a Google Blogger y las usara en mi sitio de WordPress con la opción "Insertar desde URL"?
¿Alguna sugerencia si esta es una buena idea o no?
Gracias de antemano
Zimbrul
Volví aquí porque estoy buscando plugins que suban una imagen grande como una imagen optimizada directamente a WordPress. Estoy seguro de haber visto esto en algún lugar aquí en WP Beginner, pero no lo encuentro.
Soporte de WPBeginner
Por favor, echa un vistazo a Optimización de imágenes con WP Smush: pros, contras y alternativas.
Administrador
Jack
Photoshop es definitivamente el mejor, para servicios en línea, kraken.io y resizeimage.net son buenas alternativas a tinypng.
tanveer
¿Es xnview una buena opción para comprimir imágenes?
Soporte de WPBeginner
No lo hemos probado.
Administrador
Larry Aldrich
Alguien mencionó RIOT en un comentario anterior. Es mi aplicación preferida para minimizar imágenes ANTES de subirlas. La tasa de compresión es casi fenomenal. Lo siento, usuarios de MAC, pero solo está disponible para Windows.
Martin
Hola WPBeginner,
Estaría muy interesado en la versión de Windows de Trimage que aparentemente has visto.
En la página principal de Trimage solo ves un enlace pidiendo ayuda con el puerto de Windows...
Greg
Me he acostumbrado a usar Fireworks aunque tengo CS3
Zimbrul
Yo también. Uso CSS4 y todavía recurro a Fireworks para la optimización de imágenes.
Marianne P.
Acabo de revisar el sitio de Trimage y no vi la versión de Windows, solo varias versiones de *nix. Por favor, indícame la dirección correcta. ¡Muchas gracias, artículo realmente genial!
Corinna
Me preguntaba si había alguna forma de reducir el tamaño de las imágenes ya subidas a un sitio. He cambiado la forma en que las subo, así que en el futuro todas mis imágenes serán más pequeñas. Pero pensé que tal vez sería útil cambiar el tamaño de las ya subidas.
Julie Anglesey
También me gustaría saber cómo reducir el tamaño de las imágenes ya subidas.
Zimbrul
Era (o es) Smush-It.
Samiullah Khan
Busco demasiado en la web para encontrar una buena solución para optimizar imágenes; pero la mayoría de ellas, la mayoría de ellas no me dejan ver si las herramientas mencionadas en esta publicación funcionan o no.
Graham
El artículo define PNG como un formato de archivo sin comprimir, pero hasta donde sé, los PNG estándar utilizan compresión sin pérdidas.
Y creo que sería útil mencionar por qué podrías elegir un formato sobre otro para imágenes de tono continuo (por ejemplo, una foto) frente a imágenes de paleta limitada (por ejemplo, un logotipo).
Rob Dewing
¿Por qué no se menciona Photoshop Elements, la versión reducida para uso doméstico de Photoshop? Hace el 90% o más de las cosas que hace Photoshop completo, incluida la compresión de imágenes para web, todo por menos de $100.
Ines
¿Recomendarías usar Flickr para subir tus imágenes y luego copiar el código HTML a tu sitio de WordPress? ¿Qué sugerirías para blogs de viajes que contienen muchas fotos? Gracias.
Soporte de WPBeginner
Puedes agregar fotos de Flickr en WordPress simplemente pegando la URL de la foto en una publicación. Normalmente no lo recomendaríamos, porque la gente verá y encontrará tus fotos en Flickr y es posible que nunca tengan la oportunidad de visitar tu sitio web. Sin embargo, si sientes que construir una comunidad en torno a tus fotos en Flickr es más útil para ti, entonces adelante.
Administrador
Benjamin
Podrías agregar kraken.io a tu lista. Hace lo mismo que Jpegmini pero también funciona con imágenes PNG.
Aurel
Estoy usando RIOT, que es un programa gratuito, muy rápido y excelente.
Debra Torres
He estado usando la herramienta Yahoo Smush it en: http://www.smushit.com/ysmush.it/
¿Recomendarías esta? ¿O son mejores las otras que mencionaste?
Soporte de WPBeginner
Smushit también es una gran herramienta. Pero prueba otras herramientas que mencionamos y compara los resultados.
Administrador
James DiGioia
Hay un plugin de WordPress para Smush.it:
http://wordpress.org/plugins/wp-smushit/
Esto facilita la compresión de imágenes usando Smush.it sin tener que prepararlas de antemano.
Youri van Dijk
Yo también estaba a punto de mencionar ese plugin. Generalmente optimizo mis imágenes yo mismo, pero para clientes que no están muy familiarizados con estas herramientas, instalar el plugin es un gran beneficio.
John Mauldin
Tu artículo es MUY oportuno. Acabo de encontrar la necesidad de reducir cientos de fotos para una sala de exhibición de cocinas y baños. Compré JPEGmini ya que solo podía hacer 20 fotos al día en la versión gratuita, pero $19.99 no es nada por la capacidad de arrastrar y soltar carpetas enteras en el programa y que las comprima en segundos/minutos. ¡Muchas gracias por la ayuda!
Haseeb
¿No hay alguna forma automatizada de hacer esto en WordPress? ¿Qué tal 'WP Smush.it'?
Personal editorial
Puedes automatizar el proceso con algunas herramientas que mencionamos o usando este plugin:
http://wordpress.org/plugins/ewww-image-optimizer-cloud/
Pero, ¿por qué crear más carga en el servidor cuando esto se puede resolver educando al usuario?
Administrador
Marlene
Gran artículo, sin embargo, tenía entendido que las imágenes con texto debían guardarse como archivos PNG para obtener la mejor nitidez... ¿?
Personal editorial
PNG will definitely have a higher quality, but most folks won’t be able to tell the difference unless you put them side-by-side. If you can speed up your site with a non-noticeable difference, then why not
Administrador
Adam W. Warner
Gran artículo y un tema importante que muchos administradores de WordPress pasan por alto.
[Enlace Eliminado]
Lynn
Lightroom tiene una serie de ajustes preestablecidos para exportar a Facebook y a la web. ¿Esos comprimen los archivos de imagen lo suficiente o debería recurrir a Photoshop?
Personal editorial
No estoy seguro sobre Lightroom y cómo exporta imágenes. Puedes hacer una prueba comparativa.
Administrador
Graham
Lightroom hará prácticamente el mismo trabajo que Photoshop al exportar fotos a JPEGs.
Bill Wells
Lightroom es la opción principal para los fotógrafos; te permite optimizar tus fotos en lotes y luego exportará el lote a tu tamaño de píxel y compresión preferidos en varios formatos, incluido JPEG. También agrega automáticamente tu mensaje de derechos de autor al lote si lo deseas.
No sé sobre el procesamiento por lotes en Photoshop, pero lo uso solo para manipulaciones de imágenes importantes.
Supongo que si estás haciendo gráficos o manipulaciones pesadas, usa Photoshop, pero si estás usando muchas fotos y solo quieres que se vean lo mejor posible, usa Lightroom.
Scott Wyden Kivowitz
Soy un gran defensor de muchos de los productos que mencionaste. Ahora puedo agregar este enlace a mis recursos para cuando los clientes me hagan exactamente esta pregunta. Gracias, Syed.
Personal editorial
De nada, Scott.
Administrador
Dave Kulas
Si estás tomando las fotos tú mismo para tu sitio web... configura tu cámara para que tome una foto a 800 x 600 y con menor resolución. Algunas cámaras tienen una configuración de resolución Bueno – Mejor – Óptimo... usa la configuración "BUENO". Deberías obtener una imagen que cargue rápidamente.
Si ya tienes algunas imágenes… échale un vistazo GRATIS… http://www.getpaint.net ….. Lo he estado usando por años. Tomo las fotos ENORMES que me dan los clientes… luego las REDIMENSIONO a 800 x 600. Luego uso la herramienta de compresión integrada para comprimir la imagen.
Steven Alig
No recomendaría tomar fotos de baja resolución.
Querrás tomar tus fotos originales en resoluciones más altas por si acaso quieres usarlas para algo más. Además, si tomas fotos en una resolución más alta, tendrás la capacidad de recortar un área si lo deseas.
Si las fotos son de menor resolución, no tendrás esa opción y te quedarás con lo que hayas tomado como original.
Mark Pridham
Tengo que estar de acuerdo con Steven en esto. Recomiendo encarecidamente tomar imágenes de alta resolución en tu cámara. Luego tendrás un archivo grande con el que podrás trabajar. Es muy fácil reducir el tamaño del archivo de una imagen de alta resolución, pero imposible hacer lo contrario. Al tomar imágenes de alta resolución, también tienes la opción de usarlas para trabajos de impresión si surge la necesidad. En general, termino con la imagen grande y sin procesar, una imagen impresa recortada y retocada, y una imagen más pequeña para trabajo en la web.
Michael Maye
También estaría de acuerdo en tomar fotos en alta resolución. Luego redimensiona y comprime para subir a tu sitio web. Siempre tendrás la foto original de alta resolución para otros usos.
Zimbrul
Normalmente uso Fireworks y luego Tiny PNG si es necesario.
Personal editorial
Yup that’s a good combination
Administrador
Geoffrey Gordon
Gran artículo Syed.
Sin embargo, creo que Fireworks es el rey cuando se trata de optimizar imágenes para la web y es mucho más barato que Photoshop.
Personal editorial
Gracias Geoffrey. Sí, sé que Photoshop es caro, por eso mencioné otras herramientas gratuitas también. GIMP y Fireworks tienen esta funcionalidad.
Administrador
paul
Entonces, ¿seguiré las opciones que se ven en la imagen en la sección de Photoshop de este artículo y todo estará bien?
Personal editorial
Sí, si haces eso, entonces probablemente tendrás uno de los mejores resultados de rendimiento. Sin embargo, dependiendo de la imagen, algunas podrían no verse tan bien, así que en esos casos probamos la Muy Alta. Hazlo caso por caso, pero la mayoría de las imágenes estarán bien.
Administrador
Andrew Brown
Discutiste el uso de Photoshop, que está muy por encima de las necesidades o el precio de la mayoría de los bloggers. ¿Por qué no te refieres a Lightroom, que también tiene una excelente opción de exportación de imágenes, incluida una opción para restringir el tamaño máximo del archivo, así como para guardar por dimensión o usando un dpi establecido?
Una vez que alguien sabe que las pantallas de la computadora funcionan a 72 ppp, el resto se vuelve mucho más fácil, y resulta sorprendente lo fácil que es tener una plantilla web entre las opciones de exportación sin necesidad de tener conocimientos profundos sobre lo que hay que hacer.
Personal editorial
Andrew,
Sí, entendemos que Photoshop es caro, por eso mencionamos varias otras opciones gratuitas. Acabamos de actualizar el artículo para agregar un enlace a GIMP justo debajo de Photoshop.
En cuanto a Lightroom, no lo mencionamos porque no lo usamos. Misma razón por la que se omitió Fireworks.
Administrador