• Ir al contenido principal
  • Ir a la barra lateral primaria
  • Inicio
  • Quienes somos
  • Marketing

Marketing Digital

Mucho más que estrategia

Ventajas Y Consejos Para Optimizar Las Imágenes Que Aparecen En Una Página Web

10 octubre 2021 by nredmobile Dejar un comentario

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.

Antes, y como complemento, de la optimización de las imágenes, es imprescindible que revisemos los ajustes de WordPress. Está ubicada en España y podrás ejercer tus derechos de acceso, rectificación, limitación o supresión de tus datos (ver la política de privacidad). Además, debemos acordarnos de las copias que hace WordPress de nuestras imágenes.

El peso de las imágenes es uno de los aspectos que más ralentizan el rendimiento de una web desarrollada en WordPress. Es uno de los primeros errores que se cometen cuando se crea una web. Se suben imágenes sin tener en cuenta lo que ocupan y con el tiempo acabamos ocupando demasiado espacio en nuestro hosting, haciendo que la web tenga una carga más lenta. Te contamos qué debes hacer si ya has subido imágenes sin optimizar a tu hosting y cómo puedes optimizarlas a partir de ahora. Tinypng es la aplicación online para comprimir fotos o reducir el tamaño de las imágenes que yo utilizo más a menudo. Es un clásico entre los clásicos y me gusta por su sencillez y facilidad de uso, pero sobre todo porque puedo comprimir las fotos tantas veces como quiera y al final elegir la que yo considere.

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.

Compresión De Imágenes Con Herramientas De Tu Servidor Para WordPress

En esa optimización de los tiempos de carga de una web los elementos que más peso suelen tener e influencia en los tiempos de carga suelen ser las imágenes. Esta imagen y la siguiente tienen aproximadamente 8kb de tamaño, y como vemos cumple con el requisito perfecto para que ocupe poco en formato PNG , y por el contrario se necesita comprimir muchísimo para reducir su tamaño en JPG. Este formato es el ideal para mostrar fotografías o texturas, ya que es el que permite comprimir mejor este tipo de imágenes. Las imágenes de nuestra web o blog, como primera premisa, deben de estar siempre en el tamaño que se van a usar y no tener imágenes enormes que después se verán pequeñas, sino queremos aumentar el peso de la web. Una vez visto el ejemplo y cómo se pueden optimizar las imágenes que se quieren mostrar en la web, es el momento de ver cuáles son los principales beneficios que se obtienen después de haber realizado todo este proceso.

  • Cuando queremos implementar una imagen en web hemos de plantearnos la función de esta misma.
  • Resumiendo, optimizar las imágenes en WordPress o en cualquier otro CMS, es importante si queremos empezar a mejorar su Web Performance Optimization .
  • Optimizar el peso de las imágenes para tu web es clave para mejorar el posicionamiento de tu página.
  • Mi cámara de fotos, por ejemplo, saca imágenes con una resolución enorme, 5000 px de ancho, haciendo que algunas pesen hasta 50 Mb.

Esta web utiliza Google Analytics para recopilar información anónima tal como el número de visitantes del sitio, o las páginas más populares. Todos los archivos que manejas en un ordenador tienen un «peso», que es la referencia de cuánto ocupan en kilobytes, megabytes, etc. Cuando en el paso anterior modificamos la medida, lo hicimos con el objetivo de subir a la web el tamaño óptimo, ya que una imagen más grande pesa más. Por si no sabes cuál es el ancho de tus posts (se suelen poner imágenes que ocupen el ancho entero), prueba a subir una imagen de 850 píxeles. Las imágenes destacadas de tus posts, o las que introduzcas a lo largo del texto, se van a ver a un tamaño predefinido por la plantilla que haya usado el diseñador a la hora de crearte la web. Por eso, si la imagen se va a ver a un tamaño, pongamos, de 800 píxeles; no tiene sentido que subas una de 6.000 píxeles.

¿en Qué Consiste La Optimización De Imágenes Web?

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 diseño web 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.

En este caso hemos elegido 800px de ancho, pero puedes personalizar según lo que necesites. A lo largo de este post veremos la forma que consideramos más eficaz para conseguir la carga diferida en tu sitio web. La carga diferida es una técnica que sirve para que, según estemos navegando por un sitio web, las imágenes que contiene se vayan cargando según vayan siendo visibles, y no de golpe cuando nos metemos en la página. Estoy usando Compress JPG complementándolo con Resize, las dos online, puesto que no estoy en WordPress. Pero tengo un trabajito por delante para hacerlo en todas las fotos del blog . De todos modos, tengo la intención de contratar un hosting y un dominio propio y migrar a WordPress, aunque está pendiente para un par de meses por cuestiones entremedias.

Es “la mala” ya que pierde un poco de información por el camino , pero a cambio la compresión es mucho mayor. Eso si, no pienses que vas a pasar de una foto que se ve perfectamente nítida a una imagen totalmente pixelada. Las compresiones lossy son muy respetuosas, y en muchas ocasiones no vas a notar la pérdida de calidad respecto a la foto original. En mi experiencia te diré que normalmente las imágenes tipo fotografía (hechas con una cámara, con tu smartphone…) pesan menos como jpeg, mientras que las capturas de pantalla, diagramas, etc. , pesan mucho menos si son archivos png.

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

El objetivo de este plugin no es el optimizar la imagen en sí, sino aumentar la velocidad de carga de tu página web mediante la carga diferida. Para elegir el tamaño adecuado, debes pensar en el diseño de tu blog o página web, y adaptar las medidas de las imágenes a ello. Como has podido comprobar el tiempo de carga de una web es uno de los elementos que Google tiene en cuenta a la hora de posicionar una web.

Puede obtener más información, o bien conocer cómo cambiar la configuración, pulsando en Más información. La mayoría de las herramientas que están en la lista ofrecen optimización de varias imágenes a la vez. La idea de este post era dar a conocer un buen número de herramientas. Y si necesitas más información, una comparativa entre varias de estas herramientas, o que comente alguna de ellas en mayor profundidad, sólo tienes que dejarme un comentario aquí abajo.

Te permite no solo escalar una imagen, sino que con él, las podrás modificar a tu antojo. Cuando trabajo desde casa, no tengo ningún impedimento en usar Photoshop porque el ordenador de torre puede con todo. La mejor solución es usar Photoshop o Gimp, pero si no estás familiarizado con estos programas, te voy a recomendar 4 herramientas online muy fáciles de usar. En esta imagen podemos ver cómo se deteriora tanto en modo de baja calidad, que comienzan a aparecer artefactos en las altas luces. Eso puede ser molesto para la audiencia que busca un fotógrafo de calidad. Sin embargo, en compresión media la textura no se ve mal, ni se ven artefactos aparentes, a pesar de que sí se nota una caída de nitidez muy grande.

Utiliza una compresión inteligente que disminuye el número de colores utilizados y promete una reducción de hasta el 70% de la imagen, pero sin perder calidad. No es necesario utilizar este formato o “truco” si vamos a usar la imagen para uso personal o si vamos a almacenarla en el ordenador. Puede que así ahorres espacio, pero no es aconsejable que lo hagas cuando vas a retocar tus fotos porque perderás la calidad original. Está exclusivamente pensado para transferir archivos por correo electrónico si no te importa perder algo de calidad. O para subirlo a una web, un blog o un programa de diseño que requiera un peso manejable. Tu objetivo con la optimización de imágenes para WordPress es reducir el tamaño del archivo sin sacrificar la calidad de la imagen.

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.

como optimizar imágenes para la web

Optimizar las imágenes de tu web es una tarea que ya deberías estar haciendo si quieres que tu blog sea rápido, ligero y que ofrezca una buena experiencia de usuario para tus lectores. La mejor opción, siempre que sea posible, es la de tratar nosotros mismos las imágenes y especificar el tamaño, la resolución y el nivel de compresión. Para ello los editores principales como Adobe Phosothop o Gimp entre imagen en la web otros, poseen opciones para exportarlas a nuestro gusto. A la hora de preparar imágenes para web debemos prestar especial atención a la resolución. Para web considera más que suficiente una resolución de 72ppp, pero la aparición de pantallas de mayor calidad, capaces de soportar densidades de puntos mayores. Dicho esto, no te asustes, usar imágenes en tu sitio web es algo clave dadas las estadísticas.

Google tiene en cuenta todos estos datos y en consecuencia, si son negativos, nos restará posiciones en las SERP,s en beneficio de nuestra competencia y haciéndonos perder mucho dinero por algo que es bastante fácil de solucionar. En cuanto a lo que es la optimización de la imagen antes de subirla a WordPress, sí. Ahora ya sabes lo que hay que hacer, pero nos falta el cómo o con qué. Ahora que seguro que estás concienciado de la importancia de comprimir y ajustar las imágenes, toca ver cómo hacerlo.

Archivado en:Marketing Etiquetado con:aparecen, consejos, imágenes, optimizar, página, ventajas

Interacciones con los lectores

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Barra lateral primaria

Entradas recientes

  • Diseñador De Páginas Web, ¿qué Está, Qué Hace Y Cómo Elegir Al Mejor?
  • Conforme Ser Diseñador Fuerte Paginas Web
  • Las 31 Herramientas De Diseño Web Que Convienes Conocer En 2022
  • Diseñador De Páginas Web, ¿qué Está, Qué Hace También Cómo Elegir Por Lo Menos Mejor?
  • Desarrollador Web Vs Diseñador Web 2021 ¿cuáles Son Las Diferencias? No-code Developer

Copyright © 2025 · Lifestyle Pro on Genesis Framework · WordPress · Iniciar sesión