Optimización web para un uso eficiente de la energía.

Los sitios web consumen electricidad — y mucha. En concreto, 416,2 TWh al año. Para ponerlo en perspectiva, eso supone alrededor del 2 % de todas las emisiones de CO2 del mundo, o una cantidad aproximadamente comparable a la de toda la industria de la aviación.

Es difícil entender que algo tan "normal" como navegar por Internet pueda emitir carbono. Al fin y al cabo, existe en la "nube", ¿no? La verdad es un poco más complicada.

La huella de carbono de cada acción individual que realizamos en Internet es pequeña. Pero, con más de la mitad de la población mundial (4.900 millones de personas) con acceso a Internet, el efecto global es enorme. 

¿Cómo consumen electricidad los sitios web?

Calcular la cantidad exacta de carbono emitida por cada clic puede variar significativamente dependiendo de factores como el dispositivo que se utiliza, el centro de datos al que se accede, la arquitectura del sitio web que se visita y lo más importante, de dónde procede la electricidad que alimenta el sitio web.

Podemos resumir diciendo que los sitios web consumen energía de tres maneras: 

1. El centro de datos en el que almacenamos nuestra información.
2. La transferencia de datos desde los servidores al equipo.
3. Directamente, en función del tiempo que un usuario pasa en una pantalla.

¿Cómo podemos hacer que los sitios web sean más eficientes desde el punto de vista energético?

Hay tres áreas en las que podemos trabajar para optimizar el uso energético de nuestra experiencia web: 

• Diseño y contenido: Cuando hablamos del consumo energético de un sitio web, es fácil achacarlo todo a la tecnología. Sin embargo, la eficiencia energética puede mejorarse si también nos centramos en áreas como el SEO, la redacción, la experiencia de usuario, la selección de fuentes y la reducción del uso de fotos/videos. 

• Desarrollo: Las áreas de mejora en las normas de desarrollo son enormes. Escribir código limpio, utilizar menos JavaScript, optimizar imágenes, fuentes y crear páginas web estáticas son algunos de los puntos en los que hay que centrarse. 

• Alojamiento web: Como hemos explicado antes, es importante seleccionar el mejor centro de datos para optimizar la velocidad y la eficiencia energética del sitio web. Hay que centrarse en el uso de la captura de servidores, elegir un host con un alto índice de eficacia en el uso de la energía y utilizar centros de datos cercanos a los usuarios. 

Para ayudar a las empresas en su camino hacia la sostenibilidad, PALO IT ha desarrollado su propia herramienta para medir la huella de carbono de distintos tipos de productos digitales. Somos pioneros en el tema de la reducción del consumo de energía de los sitios web, pero es importante hacer las cosas bien y no sólo hablar por hablar. 

Por ello, decidimos autoevaluar nuestro propio sitio web. Lo que descubrimos es que el volumen de transferencia de datos estaba muy por encima de la media. Uh oh 😮

Tras una evaluación más exhaustiva, medimos y nos dimos cuenta de que algunas de las imágenes pesaban demasiado, lo que afectaba a la velocidad de carga y transferencia de datos. Esto hacía que los usuarios pasaran más tiempo en pantalla antes de encontrar lo que buscaban, lo que aumentaba considerablemente el consumo de energía.

Al profundizar en este problema, nos dimos cuenta de que había varios problemas con los elementos visuales de nuestro sitio web:

1. Falta de actualización: Las imágenes se subieron a la web hace tiempo, cuando no se conocían bien los efectos de los distintos tipos de formatos en el consumo de energía.
2. Formato: El formato de las imágenes no tenía la compresión adecuada, por aquel entonces no había compatibilidad de los navegadores con los últimos formatos de imagen, como WebP. 
3. Tamaño: La mayoría de las imágenes eran demasiado grandes, superando la resolución de la gran mayoría de las pantallas.
4. Conocimiento:  En su momento, cuando las imágenes se subían a la web, el equipo encargado de hacerlo no tenía los conocimientos suficientes para diferenciar entre imágenes para web e imágenes destinadas a impresión.

Tras rastrear los datos pertinentes y detectar los problemas, pudimos sentar las bases para introducir mejoras.

Mejorando la eficiencia energética de palo-it.com

Una vez que identificamos la causa de nuestro consumo excesivo de energía, pasamos a la acción y nos centramos en dos aspectos: 

Optimización de imágenes 

Como primer paso, generamos y descargamos un archivo .csv con todos los títulos de las imágenes, su tamaño y las URLs. Algunas de las imágenes resultaron ser enormes. El problema es que, con más de 200 imágenes en total, descargar y optimizar cada una de ellas a mano habría sido bastante problemático e ineficaz. Además, la mayoría de las imágenes no eran realmente un problema, así que tuvimos que fijar un límite para centrarnos en las que realmente necesitaban ajustes. Establecimos un límite de 5 mb en formato WebP. 

Con la ayuda de nuestro equipo técnico, pudimos diseñar un script personalizado para seguir este proceso: 

1. Descargar todas las imágenes seleccionadas.
2. Optimizar el tamaño y reducir la resolución alta convirtiéndolas a WebP.
3. Cargar la imagen en la misma ubicación. 

Ejecutamos el script y, tras comprobar los distintos tamaños de pantalla, todo parecía correcto. Pero las apariencias engañan. Volvimos a nuestra herramienta interna de sostenibilidad para comprobar y comparar con más precisión.

De hecho, se redujo considerablemente el consumo de energía, aligerando el sitio web en un 40% y ahorrando 6Kgs de CO2 por cada 1.000 visitas. Esto se traduce en: 

Nos alegramos del éxito. Pero el trabajo hecho a mano jamás es el mejor camino. En lugar de descubrir este mismo problema en algunos meses o años después, nos preparamos desde hoy para el futuro... 

Guía para la carga de imágenes en el futuro

Para que nuestra solución fuera sostenible, también elaboramos una serie de instrucciones para la carga de imágenes que sirven de referencia a nuestros equipos de marketing.

¿Te interesa el contenido? Aquí tienes una muestra:  

1. Piénsalo: ¿Es necesario subir esta imagen/animación? ¿Hay alguna otra forma de transmitir esta idea o concepto? Si no, pasa al punto 2...
2. ¿Está la imagen optimizada para pantallas? Comprueba cuidadosamente las dimensiones de la imagen para ver si estás añadiendo una imagen con la resolución adecuada. 

3. ¿Está en el formato adecuado? A partir de ahora, nos comprometemos con WebP, que es el estándar reciente de la industria. Las imágenes WebP sin pérdidas son un 26% más pequeñas que las PNG y entre un 25 y un 34% más pequeñas que las imágenes JPEG comparables con una estructura equivalente. 

4. ¿Es excesivo este tamaño? Nuestro límite es de 5 mb por imagen/animación. Si lo supera, justifica una mayor compresión. 

Siguiendo estos puntos, nos hemos asegurado de mantener al mínimo el consumo de energía de nuestro sitio web.

Puede parecer poca cosa, pero a largo plazo, optimizar un sitio web de esta forma es crucial para el medio ambiente, la experiencia del usuario y la imagen de marca. A nadie le gusta una página web lenta y que se ralentiza al cargar, y a nadie le gusta propagar emisiones de carbono innecesarias, por lo que abordar esta cuestión es matar dos pájaros de un tiro. 

Este tipo de acción es un microcosmos de los proyectos que abordamos en PALO IT—  conciliando la rentabilidad con la sostenibilidad.

¿Estás pensando en optimizar la eficiencia energética de tu sitio web o de tu empresa? Contacta con nuestro equipo, nos encantará saber más sobre tu situación y lo que podemos conseguir juntos.