痛みは避けられず、痛みは結果として現れる。
ウェブサイトのエコ責任とは、エコデザインと社会的責任を両立させることです。
ロレム・イプサム・コンサクアト・ドローレ。

2024年1月10日
リニューアル前、数年前に作られたscoreddb.frのスコアは以下の通りでした:
websitecarbon.comによると、1回の訪問で1.60グラムのCO2が排出されていました。このサイトはテストされたページの86%よりも多くの汚染を出していました。スコアの理解には「websitecarbon.comでウェブサイトの環境負荷を測る」という記事をご覧ください。
- EcoIndexスコア:F(サイト全体の平均)。ページが重すぎて複雑すぎ、リクエスト数も多い(237件)。
- Google PageSpeed Insightsスコア:モバイルで18%、非常に遅く重いサイトでした。
- すでにエコ対応のホスティングを利用していました。
これらのスコアは、多くのコンテンツや画像、動画を含む古いサイトではよくあるものです。リニューアルはこれらを改善する良い機会となりました。
SCORE DDBクライアントの強い意志:デジタルエコデザインの限界に挑戦
「コミュニケーションエージェンシーとして、新しいサイトで色やビジュアル、動画を削ることは不可能でしたし、低消費モードの切替のような小手先の技を使うのも不自然でした。サイトの体験はできるだけ効果的でありながら、最高の環境パフォーマンススコアを達成し、カーボンフットプリントを削減する必要がありました。」
— SCORE DDBのプロジェクトリーダー、ゴーティエ・リナール氏
最初から大きな制約がありました:ホームページに自動再生される背景動画の存在。これはエコデザインにおける最大の難関です。
SCORE DDBチームと密に連携し、最適化されたデザインとコンテンツを実現
サイトの全機能も見直し、最も重要なものだけを残しました。
当社は静的サイトを開発しました。これはコーポレートサイトに最適な技術であり、エコデザインの基本原則です。サーバーの負担が減り、発熱も抑えられます。ページは一度だけ生成され、訪問者ごとに生成されることはありません。
静的コードはシンプルで軽量なため、ページも軽くなります。画像のフォーマットや圧縮を最適化し、ブラウザ機能を最大限に活用しました。例えばモバイルでは小さい画像サイズを提供し、WebPやSVGを優先的に使用。フォントは可変フォントを使い、JavaScriptは最小限に制限。キャッシュ設定や遅延読み込み(lazy loading)などのベストプラクティスも徹底し、無駄を防ぎました。
最初のバージョンは優れたスコアを獲得
SCORE DDBに最初のバージョンを納品した時点で、Website Carbon、EcoIndex、PageSpeedで優れた結果が出ました。16ページ中、5ページがA、9ページがB、2ページのみCでした。最もコンテンツが多いページです。視覚的にリッチなサイトでこの結果は大変な成果です。Internet 2000の通常の施策も全て投入し、平均よりもはるかにクリーンなサイトとなりました。
しかしクライアントの要求は厳しく、更なる改善を求められました。私たちは再び努力を重ねました。クライアントもとても協力的で、サイトは美しく仕上がりました。各所のページをさらに最適化しました:
- 表示サイズに合わせた画像のピクセル単位調整
- ホームページの動画の動作最適化
- Alex Hoyau CTOが特別に開発したプラグイン「Concat」を使ったスクリプトとスタイルの最適化(オープンソースで公開中)
SCORE DDBリニューアルの結果:エコデザインと美しさの両立
websitecarbon.comによると、最も重いページでも1訪問あたり0.04グラムのCO2排出となり、テストされたページの92%よりも環境負荷が少なく、CO2排出は95%減少しました。
- EcoIndexスコア:A(サイト平均)。軽量でシンプル、リクエスト数も少ない。EcoIndexは初期サイト比でCO2排出46.5%減を示しています。
- Google PageSpeed Insightsスコア:モバイルで96%、78ポイント向上。
- ページ平均サイズは500KBで、現在のウェブページ平均の半分(出典あり)。
これらの高スコアにより、環境負荷が減るだけでなく、モバイルや低速回線でも快適に使えるユーザー体験が向上しました。
SCORE DDBとInternet 2000の協力で、スムーズで閲覧しやすく、環境負荷を抑えたサイトが実現。プロジェクトの満足度は最高評価のAです。

