Меня зовут Максим, я веб-разработчик. И я хочу рассказать о теме, которая в мировом веб-сообществе обсуждается уже несколько лет, но в России до сих пор почти никому не известна — экологичность сайтов. Да, сайты загрязняют окружающую среду. Каждая загрузка страницы — это электричество на серверах, в сетевой инфраструктуре и на устройствах пользователей. И масштаб этого воздействия больше, чем кажется.

По различным оценкам, интернет в целом генерирует порядка 3,7–4% глобальных выбросов CO₂ — это сопоставимо с авиационной отраслью. Один средний сайт при 10 000 просмотров в месяц выбрасывает от 200 до 600 кг CO₂ в год — как перелёт из Москвы в Стамбул.

Можно ли делать сайты легче, быстрее и при этом экологичнее? Да. И бонус в том, что экологичный сайт — это почти всегда быстрый сайт. А быстрый сайт — это лучшие позиции в Яндексе и более высокая конверсия.

Откуда берётся углеродный след сайта

Чтобы понять, как уменьшить след, нужно понять, откуда он берётся. Три основных источника:

Дата-центры (серверы)

Каждый раз, когда пользователь открывает вашу страницу, сервер обрабатывает запрос и отдаёт данные. Серверы потребляют электричество непрерывно — и на вычисления, и на охлаждение. Чем тяжелее ваш сайт, тем больше ресурсов сервера требуется, тем больше электричества расходуется.

Передача данных (сеть)

Данные передаются через сетевую инфраструктуру: маршрутизаторы, коммутаторы, базовые станции, подводные кабели. Чем больше данных передаётся — тем больше энергии тратится на передачу. Страница весом 5 МБ потребляет в 10 раз больше сетевой энергии, чем страница весом 500 КБ.

Устройства пользователей

Смартфон пользователя тратит батарею на загрузку и рендеринг страницы. Тяжёлые скрипты, анимации, видео — всё это разряжает батарею и нагревает процессор. Для одного пользователя разница незаметна. Но умножьте на миллионы просмотров — и масштаб становится ощутимым.

Как измерить углеродный след сайта

Существуют инструменты для оценки:

Website Carbon Calculator (websitecarbon.com) — вводите URL, получаете оценку CO₂ на одну загрузку страницы и рейтинг «чище, чем X% сайтов».

Ecograder (ecograder.com) — более детальный анализ: производительность, UX, зелёный хостинг, объём данных.

Google Lighthouse — хоть и не измеряет CO₂ напрямую, но показывает размер страницы, количество запросов, скорость загрузки — все параметры, которые напрямую влияют на углеродный след.

Средний сайт в 2026 году весит около 2,5 МБ на одну загрузку. Экологичный сайт — 500 КБ и менее. Разница — в пять раз.

Практические шаги к экологичному сайту

Вот что я делаю в проектах, когда клиенту важна экологичность (или когда я просто хочу сделать быстрый и лёгкий сайт — а это, по сути, одно и то же).

Оптимизация изображений

Изображения — главный «загрязнитель». На среднем сайте они составляют 50–70% веса страницы.

Что делаю:

  • Формат AVIF/WebP вместо JPEG и PNG. AVIF даёт сжатие на 30–50% лучше, чем WebP, и на 50–70% лучше, чем JPEG — при том же визуальном качестве.
  • Адаптивные изображения — через srcset и sizes. На мобильном отдаём картинку 400px, а не 2000px. Зачем грузить 2 МБ, если экран 6 дюймов?
  • Ленивая загрузка — изображения ниже видимой области загружаются только когда пользователь до них доскроллит. Атрибут loading="lazy" — одна строчка, а экономия трафика — до 40%.
  • SVG вместо растра для иконок, логотипов, иллюстраций. SVG весит десятки байт, а не десятки килобайт.

Минимизация JavaScript

JavaScript — второй по значимости «загрязнитель». Не только из-за размера файлов, но и из-за нагрузки на процессор: скрипты нужно скачать, распарсить, выполнить.

Мой подход:

  • Критичный минимум. Каждый скрипт должен оправдывать своё присутствие. Аналитика — нужна. Анимация при скролле — оценить, нужна ли она. Виджет чата, который никто не использует — убрать.
  • Tree shaking и code splitting. Современные сборщики (Webpack, Rollup, Turbopack) убирают неиспользуемый код и загружают только то, что нужно для текущей страницы.
  • Отказ от тяжёлых библиотек. jQuery (90 КБ) ради одного слайдера? Нет. Нативный JavaScript или лёгкая альтернатива.

Эффективный CSS

  • Удаление неиспользуемых стилей. На среднем сайте используется только 10–30% загруженного CSS. PurgeCSS или аналоги убирают мёртвый код.
  • CSS вместо JavaScript для анимаций. CSS-анимации обрабатываются GPU и потребляют меньше энергии, чем JavaScript-анимации.
  • Системные шрифты вместо кастомных (или минимум кастомных шрифтов). Каждый кастомный шрифт — это 50–200 КБ дополнительного трафика. Системные шрифты — ноль трафика. Если кастомный шрифт важен для бренда — подгружайте только нужные начертания и символы (subsetting).

Кеширование

Правильно настроенное кеширование означает, что при повторном визите пользователь загружает минимум данных — большая часть берётся из локального кеша.

  • Cache-Control headers с длительным сроком для статических ресурсов (изображения, шрифты, CSS, JS).
  • Service Worker для офлайн-кеширования ключевых страниц.
  • CDN — данные отдаются с ближайшего к пользователю сервера. Меньше расстояние = меньше энергии на передачу.

Серверная оптимизация

  • SSG (Static Site Generation) где возможно. Статические страницы не требуют серверных вычислений при каждом запросе — они отдаются из кеша. Это идеально для блогов, лендингов, каталогов, которые обновляются нечасто.
  • Правильный хостинг. Выбирайте провайдера с современным оборудованием и эффективным охлаждением. Некоторые дата-центры используют возобновляемую энергию (солнечные панели, ветрогенераторы) — в России таких пока мало, но тренд развивается.
  • Отключение неиспользуемых сервисов. Если на сервере крутятся процессы, которые не нужны — они тратят электричество впустую.

Видео

Видео — самый тяжёлый формат. Одна минута видео в Full HD — 10–15 МБ.

  • Не автовоспроизведение. Видео запускается только по клику пользователя. Это экономит трафик тем, кто не хочет смотреть.
  • Оптимизированные превью. Вместо загрузки видео показываем статичный кадр (poster). Видео загружается только при нажатии Play.
  • Адаптивный битрейт. На мобильном — 720p, на десктопе — 1080p. Нет смысла грузить 4K на экран 6 дюймов.
  • Отказ от фонового видео. Красивый фоновый ролик на главной странице — 5–15 МБ трафика, который большинство пользователей даже не замечает.

Выгода для бизнеса

Экологичный сайт — это не только про идеологию. Это конкретные бизнес-выгоды:

Скорость. Лёгкий сайт = быстрый сайт. А быстрый сайт = лучшие позиции в Яндексе и более высокая конверсия. По данным различных исследований, каждая дополнительная секунда загрузки снижает конверсию на 4–7%.

Экономия на хостинге. Меньше данных = меньше нагрузка на сервер = дешевле хостинг. Для сайтов с большим трафиком разница может быть ощутимой.

Доступность. Лёгкий сайт лучше работает на медленных соединениях и слабых устройствах. А в российских регионах это актуально — не везде есть стабильный 4G.

Репутация. Для некоторых аудиторий (ESG-ориентированные компании, международные партнёры, eco-conscious потребители) экологичность сайта — плюс к имиджу. Бейдж «Green Website» в футере — не просто украшение.

Подготовка к регулированию. В ЕС уже обсуждаются стандарты энергоэффективности цифровых продуктов. Если ваш бизнес работает с европейскими клиентами — лучше подготовиться заранее.

Сколько стоит «озеленить» сайт

Аудит и оптимизация существующего сайта (анализ, оптимизация изображений, минификация кода, настройка кеширования) — от 30 000 до 100 000 рублей. Срок — 1–2 недели.

Разработка нового сайта с принципами green web — стоит столько же, сколько обычный сайт. Экологичность не добавляет стоимости — она добавляется через дисциплину разработки: оптимизация по умолчанию, а не как «потом как-нибудь».

Green web — это не отдельная технология и не дорогостоящая надстройка. Это набор хороших практик, которые делают сайт быстрее, дешевле в обслуживании и — да — менее вредным для планеты. Три результата ценой одних усилий.