Si una imagen realmente vale más que 1,000 palabras, entonces, ¿por qué no las estás usando para contar la historia de tu marca?
Un copy poético y florido es genial, pero las imágenes le dan vida y emoción a tu sitio web.
Son descripciones visuales de tu marca y productos.
Y hacen más que apenas proporcionar a tu audiencia la oportunidad de ver lo que tienes para ofrecer.
Son fundamentales cuando se trata de impulsar las ventas y los compartidos.
Las necesitas en tu página.
Pero no puedes simplemente agregar algunas imágenes de alta resolución y listo.
¿Por qué? Porque la velocidad es el quid de la cuestión cuando se trata de diseño web.
Si tu sitio se ve bonito, pero no se carga en los primeros cinco segundos, puedes despedirte de algunas preciosas conversiones.
La velocidad es un factor importante para impulsar el tráfico y las conversiones, y para tener un éxito general.
Y es probable que tu sitio no sea tan rápido como debería ser.
De hecho, de acuerdo con Google, la mayoría de nuestros sitios web no se cargan lo suficientemente rápido.
Lo que significa que estás perdiendo muchas conversiones.
Y la razón más probable es que un 99% del diseño de tu sitio esté compuesto por imágenes.
Esto es lo que quiero decir:
El tamaño de tu página (el tamaño en megabytes o kilobytes de todos los elementos de tu página) es demasiado grande. Eso causa lentitud en los tiempos de carga y prácticamente ruega a las personas que reboten.
¿Por qué? Porque tus imágenes ocupan demasiado espacio.
De hecho, es probable que tus imágenes ocupen un 99% del tamaño de tu página.
Y tienes que arreglarlo si deseas ver aumentos en la velocidad y en las conversiones posteriores.
Tener un sitio lento ya no es una opción.
Afortunadamente, este es un problema que se puede arreglar. Y tampoco tienes que hacer un rediseño completo del sitio.
Te voy a mostrar por qué un 99% del diseño de tu sitio son imágenes (y lo que deberías y puedes hacer al respecto).
La mayoría de los sitios son muy centrados en las imágenes
Sabemos que necesitas imágenes si deseas generar conversiones.
Pero demasiadas imágenes pueden acumularse rápidamente cuando se trata del tamaño de la página.
En comparación con otros elementos de la página, como el texto y los botones, las imágenes ocupan la mayor parte del espacio de la página.
Lo que significa que la mayor parte de tu espacio estará dominado por imágenes.
Permítame ser claro: Tener muchas imágenes no es algo malo. De hecho, cuantas más imágenes, mejor.
Pero la mayoría de las personas se equivocan al olvidar optimizar sus imágenes para la velocidad de la página y el tamaño de la página.
Echa un vistazo al sitio web de Evernote, por ejemplo:
Es un sitio minimalista y hermoso, como mínimo.
Pero, de inmediato, te das cuenta de que tiene muchas imágenes. No hay casi nada en cuanto a texto y otros elementos de página.
La mayor parte del diseño de su sitio se centra en las imágenes.
O qué tal el sitio web de Intercom:
Es lo mismo.
Está dominado por imágenes que transmiten la mayor parte del significado.
Y eso es perfecto. Las imágenes son mucho mejores para comunicar valor y utilidad, que un bloque de texto.
Así que, tiene sentido que el diseño de tu sitio web esté centrado principalmente en las imágenes.
Pero si no te dedicas lo suficiente a conseguir las imágenes adecuadas, puedes tener problemas en la velocidad de tu página.
Marketo es otro ejemplo de un sitio que tiene muchas imágenes, pero lo hacen bien:
¿Has notado un patrón?
La mayoría de los sitios son muy centrados en las imágenes.
En la siguiente sección, veamos cómo las imágenes pueden reducir la velocidad de tu sitio.
Sitios lentos acaban con las conversiones
En 2017, Google publicó algunos datos críticos de un estudio acerca de la velocidad de página que mostró la sorprendente lentitud de nuestros sitios web.
El primer dato se trataba exactamente de lo que estoy hablando en este momento:
Las imágenes ocupan la mayor parte de tu página y tienen el mayor peso.
De hecho, según el informe de Google, el peso promedio de una página web en bytes es mucho mayor de lo que sugieren las mejores prácticas:
Cuando se trata del peso promedio de la página, cuanto menor sea, mejor.
Cuanto menor sea el peso de tu página en bytes, más rápido se cargará y más conversiones generará.
En lo que respecta a las mejores prácticas, debes apuntar a menos de 500 KB. ¡Pero la mayoría de las páginas llegan a más de 2 MB de tamaño!
Eso es muy lejos de donde deberían estar las páginas.
¿Y qué produce el mayor peso? Lo has adivinado: problemas de velocidad de página.
La mejor práctica para la velocidad de página es de tres segundos.
Si tu sitio web no se carga en los primeros segundos, estás arriesgando perder valioso tráfico y ventas.
O sea, cuanto más grande es la página, mayor es el tiempo de carga, lo que conduce a efectos negativos en el tráfico y en las ventas.
Es un círculo vicioso.
Los hallazgos de Google confirmaron esto. Cuanto más tu sitio tarde en cargarse, mayor es la probabilidad de rebote:
Si observas el gráfico de la velocidad promedio de página, el rango típico es de 8-12 segundos.
Eso significa que las personas rebotan de tu sitio, en masa, simplemente debido a la velocidad.
Y el problema de la velocidad se desarrolla a partir de un mayor peso de página, que podría estar siendo generado por la enorme cantidad de archivos de imágenes grandes que probablemente tienes en tu sitio.
De hecho, de acuerdo con ese mismo estudio, un sitio móvil promedio tarda 22 segundos en cargarse.
Afortunadamente para nosotros, hay una manera de diagnosticar y arreglar estos problemas para salvar las conversiones y aumentar la velocidad.
Te voy a explicar cómo.
Diagnosticar tus problemas
Google hizo el trabajo preliminar y descubrió que la gran mayoría de los sitios son demasiado lentos.
Esto significa que tu sitio no funciona al ritmo que debería para aprovechar el tráfico que recibe.
Afortunadamente, ¡podemos diagnosticar este problema rápidamente y encontrar excelentes soluciones!
Una excelente herramienta para esto es la herramienta Test My Site de Google:
Esta es la mejor herramienta de prueba de sitios móviles que Google ofrece.
También puedes usar Page Speed Insights de Google para las pruebas en computadoras de escritorio.
Para este ejemplo, nos centraremos en las pruebas de sitios móviles, pero siéntete libre de usar la herramienta de prueba de escritorio también, para obtener los máximos beneficios.
Empieza ingresando tu URL en la barra, y entonces haz clic en la flecha para empezar la prueba.
Luego, espera aproximadamente un minuto para que la herramienta escanee todo tu sitio web y te proporcione algunos datos valiosos y formas de arreglar los problemas.
Una vez que se carga, puedes descargar tu informe gratuito o ver los datos iniciales de la prueba:
¿Te das cuenta de que el tiempo de carga en dispositivos móviles fue de apenas cuatro segundos y, aún así, estoy perdiendo un 10% de los visitantes?
Así de importante es la velocidad de la página.
Un único segundo sobre lo que se considera la mejor práctica me hace perder un 10% del tráfico.
Después, probé mi sitio con la herramienta Page Speed Insights de Google y encontré esto:
Ahí está el verdadero problema.
Mis imágenes están saboteando la velocidad de mi sitio web.
Y simplemente optimizándolas, puedo disminuir su tamaño en un 78%.
Eso podría potencialmente ahorrarme unos 2-3 segundos de velocidad y recuperar mis conversiones perdidas.
Eso es impresionante.
Recuerda que las conversiones son en gran medida un juego de números. Cuantas más personas visiten (y permanezcan en) tu sitio, mejores serán tus tasas de conversión.
Expones tus marcas a más personas. Por lo tanto, disfrutas de más conversiones.
Pero, cuando la velocidad de tu página es lenta, los visitantes rebotan. Son demasiado impacientes – y saben que otros sitios se cargan más rápido.
Déjame darte un ejemplo rápido de cómo las imágenes pueden acumularse rápidamente en tu sitio si no las optimizas.
Supongamos que tu sitio está en WordPress y vas a agregar imágenes a tu publicación de blog.
Vas a la sección de la biblioteca de imágenes y subes una foto para agregar:
Haces clic en «Agregar Nuevo» y empiezas a importar algunas imágenes.
Ahora, echa un vistazo a cada imagen y ve cuál es el tamaño del archivo:
253 KB para una sola imagen.
O qué tal esta imagen que subí recientemente:
2 MB para una única imagen.
Y recuerda, de acuerdo con Google, la mejor práctica para el peso/tamaño de la página es menos de 500 KB.
Así que, incluso subir unas pocas de esas imágenes y dejarlas sin optimización puede hacer que tu sitio funcione increíblemente lento.
La mayoría de los sitios web con los que trabajo también cometen este error con bastante frecuencia.
Un usuario subirá fotos de productos o imágenes SaaS in-app a sus páginas de características y las pondrá en funcionamiento.
Y luego se dan cuenta de que sus tiempos de carga de las páginas están por las nubes.
Entonces, es hora de arreglar estos problemas.
Comprimir imágenes
Los archivos y elementos de página más grandes de tu página tardarán más en descargarse.
Cuando descargas una aplicación o programa en tu computadora, cuanto mayor sea el tamaño, más tiempo demorará.
Bastante claro, ¿verdad?
Bueno, es lo mismo cuando se trata de tu sitio.
Las imágenes grandes ocupan más espacio. Cuando un visitante llega a tu sitio web, el navegador tarda más en cargarlo debido a esas imágenes de alta resolución.
Y según Kinsta, la mayor parte del tamaño se reduce a un factor molesto: las imágenes voluminosas.
Kinsta dice que la selección de formato, el tamaño, y la compresión son los principales factores para reducir el tamaño y aumentar la velocidad de una página.
Incluso recomiendan comprimir tus imágenes a un 60 o 70 por ciento de su tamaño original.
Piensa en esto como un cesto de ropa lleno de ropa limpia. Si están todas amontonadas, ocupan mucho espacio.
Sin embargo, cuando las doblas, se comprimen. Y puedes colocarlas fácilmente en los cajones de tu cómoda.
Eso es exactamente lo que debes hacer con tus imágenes. Se verán igual en la pantalla,
pero se cargarán más rápido para tus visitantes.
Entonces, ¿cómo lo haces?
Si utilizas WordPress, hay diversos plugins para eso.
Uno de mis favoritos es el Smush Image Compression and Optimization.
Es uno de los mejores plugins que puedes utilizar para que tu sitio redimensione, optimice y comprima las imágenes automáticamente, de forma gratuita.
Es fácil de instalar desde el panel de WordPress. Una vez que esté instalado, puedes empezar a usarlo de inmediato.
Cada vez que subas una imagen, «aplástala».
También puedes comprimir hasta 50 imágenes a la vez con la función «Bulk Smush»:
Y una de mis funciones favoritas es la automatización.
Si navegas a la configuración del plugin, puedes elegir aplastar automáticamente las imágenes al subirlas:
Incluso puedes cambiar automáticamente el tamaño de las imágenes originales a un tamaño específico:
Si eliges utilizar este plugin, también puedes usar la función que te permite saltar el proceso de aplastar cada imagen.
En realidad, el plugin escaneará tu biblioteca de imágenes y detectará las imágenes que necesitan ser comprimidas:
WP Smush es una herramienta gratuita que debería ser uno de tus mejores y más utilizados plugins si utilizas la plataforma WordPress.
Pero si no utilizas WordPress, hay algunas otras opciones para ti.
Una buena opción para empezar es Compressor.io.
Esta herramienta es de uso gratuito y soporta cuatro tipos diferentes de archivos para la compresión. También utiliza una tecnología que te permite preservar la calidad al tiempo que reduce el tamaño del archivo:
Para empezar, simplemente presiona «Pruébalo» y sube tu foto para comprimirla.
Por ejemplo, mira esta foto de prueba que comprimí:
Esta herramienta fue capaz de proporcionar una reducción de un 78% del tamaño, con casi ninguna diferencia notable en la calidad.
Redujo el tamaño de la imagen de 7,57 MB a 1,67 MB. Ese tipo de reducción puede ser fundamental cuando se trata de tu sitio web.
Otra buena herramienta de compresión es Compress JPEG:
Esta herramienta es genial porque puedes subir 20 imágenes a la vez en formato PNG, JPEG y PDF.
Luego, puedes descargar las imágenes comprimidas en un archivo ZIP para abrir y compartir fácilmente.
Para empezar a comprimir, sube o arrastra tus archivos de imagen al programa:
Por el bien de las herramientas de prueba A/B, subí la misma imagen, y los resultados fueron exactamente los mismos de Compressor.io:
Una reducción de un 78% en el tamaño.
Una cosa que me encanta de esta herramienta es que puedes inspeccionar la imagen en una vista de primer plano y de lado a lado, para ver si la calidad es demasiado baja para tu gusto:
La imagen a la izquierda muestra la imagen original, con un tamaño de 7,3 MB.
La imagen de la derecha muestra la versión comprimida a 1.6MB, una reducción de tamaño de un 78%.
La calidad es prácticamente indistinguible.
Para comprimirla aún más, simplemente arrastra la barra lateral hacia abajo para disminuir la calidad.
Otra de mis herramientas de compresión favoritas es TinyJPG, o TinyPNG, dependiendo del tipo de tu archivo:
Con esta herramienta gratuita, también puedes comprimir hasta 20 imágenes a la vez.
Probé una imagen de 3 MB en esta herramienta y obtuve una enorme reducción en el tamaño de la imagen:
Pude comprimirla en un 74%, a casi 500 KB.
Esa es una reducción bastante increíble, y el sitio incluso te proporciona una idea exacta de cuál será probablemente el tamaño de tu imagen, antes de que la comprimas.
Por lo tanto, debes intentar comprimir imágenes grandes tanto como sea posible.
Comprimir incluso imágenes pequeñas te ayudará a ahorrar mucho espacio a largo plazo.
Si tienes un sitio con páginas basadas en imágenes, la compresión debería ser tu principal estrategia para optimizar tu sitio web.
Si simplemente subes fotos de 5 MB, tendrás un sitio lento que prácticamente obliga a los clientes a rebotar.
La compresión puede arreglar la mayoría de tus problemas técnicos de SEO en lo que respecta a la velocidad de página, y no reducirá la calidad de tus imágenes.
Conclusión
Las imágenes hacen que tu sitio se vea increíble. Si no tienes ninguna imagen, no convertirá a los visitantes.
A las personas les encanta las imágenes porque se conectan con ellas emocionalmente. Las imágenes cuentan una historia.
Pero si tienes demasiadas imágenes, corres el riesgo de tener grandes impactos en la velocidad.
Y honestamente, la velocidad es probablemente el factor más crítico cuando se trata del tráfico del sitio.
Si tu página tarda más de 10 segundos en cargarse, seguro los usuarios volverán a Google buscando el próximo sitio para resolver su problema.
Las personas no quieren esperar 10-20 segundos para obtener el contenido que necesitan en aquel momento.
Incluso si tu sitio está optimizado para la conversión, si no puedes lograr que las personas lleguen a tu contenido de hecho, no se convertirán.
Y de acuerdo con Google, la mayoría de nosotros tiene este problema.
Los pocos sitios que no lo tienen, simplemente sacan provecho de nuestros errores.
Entonces, ¿por qué pasa esto?
Porque un 99% del diseño de tu sitio y el tamaño de la página están dominados por grandes imágenes.
Las hermosas fotos de los productos, los videos explicativos y páginas de características ocupan demasiado espacio.
Hacen que tus páginas se ralenticen y alejen las conversiones.
Pero, si sigues los pasos que hablamos, ¡no es demasiado difícil de arreglarlo!
Empieza diagnosticando tus problemas con las herramientas gratuitas de Google.
Esto te puede ayudar a ver qué está causando la lentitud de tu sitio.
Luego, comprime tus imágenes.
Este es el principal error que las personas cometen en el diseño del sitio web.
Subir imágenes con muchos megabytes de tamaño hará que tu sitio funcione más lentamente.
Intenta usar varios plugins en WordPress o usa herramientas gratuitas para sitios web, para comprimir tus imágenes en solo unos minutos.
Arreglar tu sitio y el tamaño de las páginas te puede ayudar a generar incontables más visitas y conversiones rápidamente.
¿Cómo has ajustado y arreglado el diseño de tu sitio web para aumentar la velocidad?
