A continuación te explico paso a paso como hago yo para optimizar el peso de las imágenes de mi página y mejorar así la velocidad de carga. Ahora que ya sabes cómo optimizar las imágenes WordPress es hora de empezar a sacarle todo el jugo a esto para obtener el máximo potencial de tu web. Además, como un punto fuerte, también nos permite optimizar varias imágenes a la vez, haciendo el proceso mucho más sencillo y rápido.
Se trata de Picresize y reduce el tamaño de nuestra imágenes de forma individual o en lotes. De este modo puedes conocer el tamaño exacto en píxeles de tus imágenes cuando se muestran. En general nos va a ser suficiente con conocer el ancho máximo para establecer el tamaño final al que ajustar cada imagen. Es el proceso por el cual optimizamos las imágenes una vez subidas al servidor donde está alojada nuestra web. A lo largo de este post vamos a ver cómo podemos optimizar correctamente todas y cada una de las imágenes que tengas en tu web.
Lo primero que vamos a hacer es cambiar la resolución a una apropiada para pantalla. En este caso, la imagen está a 300 píxeles por pulgada inicialmente, que es una resolución adecuada para imprimir. Para pantalla cambiaremos este valor por 72ppp y a continuación modificaremos la unidad de medida a píxeles. Si no eres de trabajar con interfaces web estás de suerte, ya que TinyPNG cuenta con un plugin para utilizar su algoritmo de compresión directamente en Photoshop.
Puedes usar sin problema esta herramienta en su opción gratuita, pero encontrarás ciertas funciones más avanzadas que están bloqueadas y para hacer uso de ellas deberás contar con un plan PRO. Cuenta con 3 modos distintos de compresión y con cada uno de ellos podrás aplicar diferente grado de optimización en tus imágenes. Pero cómo sobre estas herramientas se ha hablado mucho y puedes encontrar cantidad de información, prefiero mostrarte otras, que no por ser menos conocidas son peores. No es necesario que descargues ningún tipo de programa en tu ordenador, puesto que lo harás de forma Online. Con la herramienta Resize Photos, además de poder cambiar el tamaño de las imágenes, tienes la posibilidad de comprimirlas y aplicar algunos efectos. Por lo que un paso que no debes obviar es el de modificar su ancho, adaptándolo al que tienen predefinido en tu web.
Si tienes varias imágenes en tu página, entonces la primera imagen debería incluir tu palabra clave objetivo. Cada imagen que le sigue debería usar una variación de esa frase, diseño web sin dejar de ser relevante para la imagen. Con estos, todo lo que tienes que hacer es subir tus fotos y la herramienta se ejecutará y descargarás tus fotos optimizadas.
Esto lo podemos conseguir con cualquier programa de edición de fotografía o herramientas online creadas para ello. Optimiza las imágenes, carga, redimensiona, comprime y mejora la velocidad de tu página. Smush es un plugin de WordPress que comprime todas las imágenes sin una caída visible de la calidad. Te permite optimizar 50 imágenes en un sólo clic y además redimensionarlas. Del mismo modo te permite localizar rápidamente las imágenes que están ralentizando tu sitio web. [newline]Una de sus características más especiales es su integración con los bloques de Gutenberg . Nos permite optimizar imágenes en .jpg, .png y .gif permitiéndonos elegir la configuración de la compresión y realizar algunos ajustes en nuestra imagen antes de proceder a optimizarla.
- Del mismo modo te permite localizar rápidamente las imágenes que están ralentizando tu sitio web. [newline]Una de sus características más especiales es su integración con los bloques de Gutenberg .
- Esto se debe a que este tamaño se verá bien en los monitores y móviles de la mayoría de usuarios.
- Otro de los sitios imprescindibles en cuanto a la edición de fotografías es Image Resizer.
- Puede ocurrir que haya algunas imágenes que o no bajen suficiente de peso o se vean fatal.
- Pero no se miden los píxeles totales, sino que la resolución se expresa con el número de filas y columnas que forman dichos puntos.
A continuación, aprenderás cómo puedes optimizar tus imágenes para WordPress de una manera que conserve la calidad y no sacrifique el rendimiento. La optimización de tus imágenes no tiene que ser difícil ni requerir de mucho tiempo, y puede formar parte de tu flujo de trabajo de publicación habitual. No optimizar tus imágenes puede ser perjudicial para el éxito de tu sitio. En esta guía aprenderás por qué es imprescindible optimizar tus imágenes, así como cinco maneras de optimizar las imágenes para WordPress.
Comprimir Fotos Sin Perder Calidad
Aunque la modalidad lossless sólo puede aplicarse sobre archivos PNG y JPG. Ofrecen unplugin para Photoshop, que te permite exportar de forma diseño web jaén sencilla, sin tener que preocuparte de los parámetros. Se trata de un filtro que consigue que los elementos queden más destacados y vistosos.
Si la imagen de ese slider tiene el ancho máximo al que se va a mostrar, tiene un formato apropiado, y se ha comprimido al máximo posible su peso, la tendremos optimizada. Por ejemplo, no es el mismo uso el de una imagen que vamos a utilizar en el slider del encabezado principal de una web a ancho completo que el de la imagen interna de un post como este mismo que estás leyendo ahora mismo. El formato PNG tiene la peculiaridad de admitir transparencias, siendo la versión de 24bits la más indicada para incluir en una web imágenes transparentes si no queremos perder calidad. Ahora, teniendo una diferencia de peso tan abrumadora entre una imagen y otra, a simple vista, ¿qué diferencia en la calidad se puede apreciar entre las imágenes originales y las optimizadas?
Para evitar esto, es necesario hacer los cambios sobre la imagen original. Este sitio web utiliza cookies para mejorar la experiencia de navegación. Si sigues navegando estarás consintiendo las cookies de este sitio. Para mi la mejor opción es controlar el proceso de compresión lo máximo posible. Si no es con Photoshop, Befunky o Squoosh también son buenas opciones, y de esta forma sólo tocamos la imagen una vez y elegimos el tamaño según las peculiaridades de cada una. Para mi éste el mejor método de optimizar imágenes para web, porque nos da un control total del proceso.
Photoshop
En el vídeo-tip de hoy nos salimos un poco del repaso que estamos haciendo por todas las opciones del administrador de WordPress porque optimizar imágenes para WordPress es básico también. Algo que debes hacer desde el principio para luego no tener que volver a ello. Como puedes ver es exactamente lo mismo pero hecho de dos formas. Si no conoces muy bien Photoshop y lo único que quieres hacer es reducir el tamaño, el método 2 te resultara más rápido y fácil ya que está todo en la misma ventana.
Si tardan mucho en cargar tus imágenes, seguramente las necesites optimizar. Una de las técnicas más comentadas en la mayoría de blogs de profesionales SEO, es la WPO , que consiste básicamente en optimizar la velocidad de carga de la web. Si logramos mantener estas exportaciones para crear imágenes que sean ligeras y que permitan cargar la página con mayor velocidad, lograremos mejorar el puntaje que nos ayudará a destacar en la web. En el caso de la calidad, siempre podemos jugar a ajustar un 10% por arriba y por debajo del valor establecido para encontrar más o menos detalle, sin que eso equivalga un gran cambio de peso. Lo importante es saber que cuando se exporte se va a ver bien para su propósito. En el caso de las flores de arriba, al exportar para web, abajo podemos ver un ejemplo de cómo se puede previsualizar para ver si la función de lupa está funcionando bien.
Para solventar los problemas que puede causar un peso excesivo de nuestras imágenes, vamos a ver dos de las mejores para optimizar tus fotografías, mediante plugins de WordPress y herramientas de edición online. En mi caso, no acostumbro a utilizar herramientas online, además de tampoco tener mi blog en WordPress; por lo que acostumbro a usar Riot y FSResizer. Dos herramientas que se pueden usar de forma portable para Windows. También me gusta mucho y cuando se me termina la opción gratuita de tinyPNG es mi siguiente opción para comprimir imágenes.
Cómo optimizar imágenes para la web para mejorar la velocidad de carga e indexación por @manuelcervilla
– Optimizar no es solo comprimir
– Cómo optimizarlas
– Cómo mejora la indexación
– Dónde descargar imágenes-> https://t.co/WcPk1VPlEB#WPO pic.twitter.com/IaEYgjuQ9o
— Raúl González – Ragose (@YoRaulGonzalez) December 7, 2018
Una vez subida la imagen y configurados estos parámetros, habrá que darle al botón “Optimize Now”. Finalizado el proceso, aparecerá información sobre el ahorro logrado y un botón para lanzar la descarga de la imagen resultante desde su servidor a nuestro equipo. A la hora de optimizar una imagen lo suyo es utilizar el archivo original. Como hemos explicado anteriormente, se trata de un archivo con pérdida lo que significa que cada vez que guardamos, estaremos perdiendo calidad respecto al original. Si queremos editar una imagen que ya ha sido optimizada con anterioridad, estaremos corriendo el riesgo de que su calidad se vea muy afectada.
¿Cómo optimizar tus imágenes para la web? http://t.co/rrMoD8cX64
— Laura Cuesta Cano (@LauraCuestaCano) December 12, 2013
Para optimizar el tamaño de las imágenes lo primero es conocer las dimensiones que deben tener para adaptarlas exactamente a ese formato. Como norma general, cuanto más grande es una imagen, más tamaño tendrá el archivo. Debemos reducir los tiempos de carga de la web al mínimo para mejorar la experiencia de usuario y por ende, el SEO.