HYPER STUDIO

Ecología Digital

Se nos dijo que Internet "desmaterializaría" la sociedad y disminuiría el consumo de energía. Sin embargo, se ha convertido en un gran consumidor de energía en rápido crecimiento. ¿Cómo podemos crear sitios web sostenibles, con bajas emisiones de carbono?

Se nos dijo que Internet "desmaterializaría" la sociedad y disminuiría el consumo de energía. Sin embargo, se ha convertido en un gran consumidor de energía en rápido crecimiento. En 2023 hay unos 1.13 billones de sitios web en Internet, con un peso medio de 2.205 kilobytes cada uno.

En 2019 recibimos el encargo del estudio de arquitectura y diseño MADC de crear su página web siguiendo su lema: "El diseño sin sostenibilidad ya no es diseño". Para ello llevamos a cabo un proyecto de investigación con el fin de construir la web con la menor huella de carbono posible.

Sin fuentes ni logotipo

Todos los recursos cargados en una web, incluidos tipografía y logotipos, son peticiones al servidor, lo que requiere espacio de almacenamiento y uso de energía. Por lo tanto, esta web no carga ningún tipo de letra personalizado eliminando la declaración font-family, lo que significa que los visitantes verán los tipos de letra por defecto de su navegador, una sans-serif y una serif.

También evitamos el uso de Google Fonts (que recopila tus datos personales y los comparte con terceros cuando visitamos una web con su fuente implementada), reduciendo las peticiones innecesarias al servidor y la cantidad de datos generados, lo que al final se traduce en una reducción del consumo de energía.

Utilizamos un enfoque similar para el logotipo. En lugar de diseñar un elemento gráfico, que requeriría la producción y distribución de tipografías e imágenes personalizadas, la nueva identidad de MADC consiste en un único estilo tipográfico: el tachado en los espacios en blanco entre letras para crear una cadena. El logotipo es por tanto generativo, con infinitas configuraciones posibles tanto en su versión lineal como en la cuadrada.

Compresión de imagenes

El principal reto era reducir el tamaño de las páginas sin restar atractivo a la web. Como las imágenes ocupan la mayor parte del ancho de banda, sería fácil obtener tamaños de página muy pequeños y un menor consumo de energía eliminando imágenes, reduciendo su número o haciéndolas mucho más pequeñas. Sin embargo, los elementos visuales son una parte importante del trabajo de MADC, y la web no sería la misma sin ellas.

En su lugar, optamos por aplicar una técnica de compresión de imágenes "obsoleta" llamada "dithering". Gracias al dithering, podemos hacer que las imágenes consuman diez veces menos recursos, aunque se muestren bastante grandes. El número de colores de una imagen, combinado con su formato de archivo y resolución, contribuye a su tamaño. Así, en lugar de utilizar imágenes de alta resolución a todo color, optamos por convertir todas las imágenes a blanco y negro.

Sólo pulsando el botón HD el visitante podrá acceder a la versión a todo color de alta resolución de cada imagen. De este modo, cada visitante decide qué imágenes quiere descargar y ver.

Imagen original, 1,900 KB

Imagen "dithered" a color, 556 KB

Imagen "dithered" en blanco y negro, 158 KB

Imagen "dithered" en blanco y negro (detalle), 158 KB

Modo oscuro

Se ha negado ampliamente que una pantalla con fondo negro consuma menos energía que con fondo blanco. Sin embargo, esto está empezando a cambiar con las nuevas pantallas OLED, en las que un píxel negro significa que está apagado y, por tanto, no consume energía.

Además, si nos encontramos en un entorno oscuro, es mucho más cómodo leer un texto blanco sobre un fondo negro, requiriendo menos brillo de los dispositivos, y por tanto reduciendo el consumo de energía; mientras que si nos encontramos en un entorno luminoso, es mucho mejor lo contrario.

Teniendo en cuenta todas estas premisas, decidimos crear una web que respondiera a la hora del día en que la visitas. Si visitas la web durante el día, la verás con fondo blanco y texto negro, pero si la visitas durante la noche, la verás invertida. Como esto es sólo una mera aproximación y no un indicador exacto de si nos encontramos en un entorno claro u oscuro, colocamos un sencillo conmutador en la esquina superior derecha de la pantalla para que cada usuario pueda alternar entre estos dos modos de color.

Proveedor de alojamiento ecológico

El principal recurso de un proveedor de alojamiento es la electricidad. Si ese recurso procediera de una fuente de energía 100% limpia, no contaminaría ni generaría emisiones de CO2 a la atmósfera, y nuestra huella residual en el mundo sería mínima. Por eso elegimos una empresa de alojamiento cuya política se centra en la energía verde a todos los niveles. Además, la ubicación física del centro de datos donde se aloja su sitio web es bastante relevante. En este caso, como MADC es una empresa con sede en Madrid y la mayor parte de su tráfico es nacional, elegimos un centro de datos situado en España para optimizar el flujo de datos entre los usuarios y la fuente.

Si tu web se alimenta de carbono, considera la posibilidad de cambiar. Puedes buscar proveedores de alojamiento ecológico en el directorio de la Green Web Foundation.

CLIENTE

MADC Architects

REFERENCIAS

How to Build a Low-tech Website?

Digital Ecology, Adaversum

Green Web Foundation

AÑO

2019