Dev.to WebDev 🛠 Dev 👁 0 📖 6 min read

Cómo calcular la huella de carbono de una web (paso a paso, con fórmula y código)

Cada vez que alguien abre una página, un servidor envía bytes, la red los transporta y un dispositivo los procesa. Todo eso consume electricidad, y esa electricidad tiene una huella de carbono que se puede estimar en cin

Cada vez que alguien abre una página, un servidor envía bytes, la red los transporta y un dispositivo los procesa. Todo eso consume electricidad, y esa electricidad tiene una huella de carbono que se puede estimar en cinco minutos con datos que ya tienes a mano.

En este artículo te explico el método completo: qué se mide, de dónde salen las constantes, cómo hacer el cálculo a mano (con un ejemplo resuelto y una función en JavaScript) y cómo interpretar el resultado sin caer en el greenwashing.

Si prefieres saltarte las cuentas, he publicado una calculadora de huella de carbono web gratuita que aplica exactamente este método en tu navegador, sin registro y sin enviar datos a ningún servidor.

Qué mide (y qué no mide) la huella de carbono de una web

Antes de calcular nada, conviene acotar el alcance. Según el GHG Protocol, la estimación de emisiones por visita cubre:

  • Scope 2 indirecto: la electricidad que consume el servidor que aloja tu web.
  • Scope 3, categoría 11: el uso de tu producto digital (red y dispositivos de quien te visita).

Y no cubre:

  • Scope 1 (emisiones directas de tu organización).
  • La fabricación del hardware (Scope 3 cat. 2), el fin de vida de los equipos ni la fabricación de los dispositivos de tus usuarios.

Esto importa: si alguien te vende una "web neutra en carbono" sin explicarte el alcance, está mezclando cosas distintas.

El modelo: Sustainable Web Design v3

El estándar de facto para este cálculo es el modelo Sustainable Web Design (SWD) v3, publicado por la Green Web Foundation. Parte de una idea sencilla: la energía consumida es proporcional a los datos transferidos.

Las constantes del modelo son:

Constante Valor
Energía por GB transferido 0,81 kWh/GB
Reparto: datacenter 15 %
Reparto: red 14 %
Reparto: dispositivo del usuario 52 %
Reparto: producción 19 %

Fíjate en el dato del dispositivo: más de la mitad de la energía se consume en el lado del usuario. Por eso el peso de la página (y el JavaScript que obliga a ejecutar) es la palanca principal, más incluso que el hosting.

Paso 1: mide el peso real de la página

  1. Abre la página en Chrome o Firefox y pulsa F12.
  2. Ve a la pestaña Red / Network y marca Desactivar caché (Disable cache), para medir una primera visita.
  3. Recarga la página (Ctrl + R).
  4. Lee en la barra inferior el valor transferred (por ejemplo, 1.0 MB transferred).

Dos consejos para que el dato sea útil:

  • No midas solo la home. Mide las 3–5 páginas con más tráfico y haz una media ponderada por visitas.
  • Usa el valor transferred (lo que viaja por la red, ya comprimido), no resources (lo que ocupa descomprimido).

Paso 2: convierte bytes en energía

energía (kWh) = peso (GB) × 0,81

Para una página de 1 MB (0,001 GB):

0,001 GB × 0,81 kWh/GB = 0,00081 kWh por visita

Paso 3: elige la intensidad de carbono de la red eléctrica

No es lo mismo un kWh en Francia (mucha nuclear) que en Estados Unidos o la media mundial. La intensidad se expresa en gramos de CO₂ por kWh:

País del servidor gCO₂/kWh Fuente
España 129 EEA 2024
Francia 43 EEA 2024
Países Bajos 235 EEA 2024
Irlanda 238 EEA 2024
Alemania 298 EEA 2024
Estados Unidos 367 EIA 2023
Media mundial 445 IEA, Electricity 2025 (dato 2024)

Si no sabes dónde está tu servidor, usa la media mundial: es la opción conservadora.

Paso 4: calcula el CO₂ por visita

CO₂ por visita (g) = energía (kWh) × intensidad (gCO₂/kWh)

Con nuestro ejemplo de 1 MB:

Escenario Cálculo Resultado
Servidor en España 0,00081 × 129 ≈ 0,10 g CO₂/visita
Servidor en Francia 0,00081 × 43 ≈ 0,03 g CO₂/visita
Media mundial 0,00081 × 445 ≈ 0,36 g CO₂/visita

Y si quieres ver dónde se reparte ese 0,10 g en España: unos 0,016 g en el datacenter, 0,015 g en la red, 0,054 g en el dispositivo y 0,020 g en producción.

Paso 5: escálalo a tu tráfico mensual

CO₂ mensual (kg) = CO₂ por visita (g) × visitas mensuales / 1000

Con 10.000 visitas al mes y servidor en España:

0,104 g × 10.000 / 1000 ≈ 1,04 kg CO₂eq al mes (≈ 12,5 kg al año)

El cálculo completo en JavaScript

Si quieres integrarlo en tus propios scripts o auditorías, esta función implementa los pasos anteriores sin dependencias:

// Modelo Sustainable Web Design v3 (simplificado: primera visita, sin caché)
const KWH_PER_GB = 0.81;
const SHARES = { datacenter: 0.15, red: 0.14, dispositivo: 0.52, produccion: 0.19 };

const INTENSIDAD = { // gCO2/kWh
  ES: 129, FR: 43, NL: 235, IE: 238, DE: 298, US: 367, MUNDO: 445,
};

function huellaWeb({ pesoKB, visitasMes, pais = 'MUNDO' }) {
  const gb = pesoKB / 1_000_000;          // KB -> GB (decimal)
  const kwh = gb * KWH_PER_GB;
  const intensidad = INTENSIDAD[pais] ?? INTENSIDAD.MUNDO;
  const gPorVisita = kwh * intensidad;

  const desglose = Object.fromEntries(
    Object.entries(SHARES).map(([k, s]) => [k, +(gPorVisita * s).toFixed(4)])
  );

  return {
    gPorVisita: +gPorVisita.toFixed(3),
    kgMes: +((gPorVisita * visitasMes) / 1000).toFixed(2),
    desglose,
  };
}

console.log(huellaWeb({ pesoKB: 1000, visitasMes: 10000, pais: 'ES' }));
// { gPorVisita: 0.104, kgMes: 1.04, desglose: { datacenter: 0.0157, ... } }

Es una versión didáctica: el modelo SWD completo también contempla el efecto de la caché en visitas recurrentes y el hosting renovable, que reducen la cifra final.

¿Es mucho o poco? Cómo interpretar el resultado

Dos referencias útiles para situarte:

  • Media de la web: ~0,50 g CO₂ por visita (percentil 50, HTTP Archive 2024).
  • Top 10 % más limpio: ~0,09 g CO₂ por visita.

El modelo SWD también define un rating de la A a la F por percentiles: una A corresponde a ≤ 0,095 g por visita y una F a más de 0,656 g. Es una forma rápida de comunicar el resultado a alguien que no quiere ver gramos.

Cómo reducir la huella de carbono de tu web

Ordenado de mayor a menor impacto habitual:

  1. Imágenes: sírvelas en AVIF o WebP, al tamaño real en que se muestran (srcset), y con loading="lazy" por debajo del primer pantallazo.
  2. JavaScript: elimina librerías que no usas y scripts de terceros que nadie revisa. Recuerda que el 52 % de la energía se gasta en el dispositivo.
  3. Fuentes: usa una o dos familias, en WOFF2 y con subsetting a los caracteres que necesitas.
  4. Vídeo: nada de autoplay; usa una imagen de póster y carga el reproductor solo al hacer clic.
  5. Caché: configura cabeceras Cache-Control largas para recursos estáticos versionados.
  6. Hosting: elige un proveedor que acredite energía renovable y, si puedes, ubica el servidor en un país con red eléctrica limpia.

Mide antes y después de cada cambio: es la única forma de demostrar la mejora.

Limitaciones que debes declarar

Si vas a usar este cálculo en un informe, sé transparente con lo que no captura:

  • La intensidad de carbono es una media anual: no refleja variaciones horarias ni estacionales.
  • Con CDN o proxy inverso, el país del servidor que ves no es necesariamente el del origen. En ese caso, usa el país del datacenter de origen.
  • Es una estimación con metodología declarada, no un certificado. No sustituye una verificación ISO 14064 ni una auditoría de tercero.

Bien documentada (modelo, constantes, fuentes y alcance), es un dato perfectamente válido para apoyar reporting de sostenibilidad como ESRS E1 o GRI 305. Una frecuencia trimestral basta para ver tendencias, y conviene repetir la medición tras cada optimización relevante.

Calcúlalo sin hacer cuentas

Si quieres aplicar todo esto en un minuto, la Calculadora de Huella de Carbono Web te pide el peso de la página, las visitas mensuales, el tipo de hosting y el país del servidor, y te devuelve el CO₂ por visita y al mes, el rating A–F, la comparativa con la media web y un resumen descargable con la metodología y las fuentes. Funciona entera en el navegador y no guarda ningún dato.

¿Ya has medido tu web? Cuéntame en los comentarios qué resultado te ha dado y qué cambio te ha bajado más la cifra.

📰 Read the original article on Dev.to WebDev

Originally published by Dev.to WebDev. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.