あまりテレビは見ないのですが、阿部寛さんは好きな俳優です。
テルマエ・ロマエ、TRICK、VIVANTなど名作がありますね。(個人的にはコメディ系の作品が好き)
度々話題になる 阿部寛のホームページ ですが、これがどう凄いのか、改めて見てみたいと思います。
阿部寛のホームページ
現在は以下のURLでアクセスが可能です
見た目からわかりますが、W3C？そんなもん知るかという感じのレガシーなホームページです。
ページのキャラクターセットも今は UTF-8 が標準のような感じですが SHIFT_JIS です。
このホームページがなぜ話題になるのでしょうか。
ページの読み込みが爆速
阿部寛のホームページには非常に高速なページ読み込み速度という特徴があります。
Googleの提供する、PageSpeed Insightsで計測してみます
※阿部寛のホームページはiframeを使用しているためトップページのURLでは計測できません。 http://abehiroshi.la.coocan.jp/top.htm で計測します
First Contentful Paint (FCP) - 0.2秒
FCPは、最初のコンテンツが画面に表示されるまでの時間を示します。0.2秒は非常に速く、ユーザーが即座にコンテンツを確認できることを示しています。
Largest Contentful Paint (LCP) - 0.2秒
LCPは、ページの主要コンテンツ（例えば、大きな画像やテキスト）が表示されるまでの時間を示します。これも0.2秒で、ページの読み込みが非常に速いことを示しています。
Total Blocking Time (TBT) - 0ミリ秒
TBTは、メインスレッドがブロックされている時間を示します。0ミリ秒は、スムーズなインタラクションが可能であることを示します。
外部リソースの読み込みも少なく、スクリプトを全く使用していないため0という結果に。
Cumulative Layout Shift (CLS) - 0
CLSは、ページのレイアウトが予期せずシフトする度合いを示します。0は、レイアウトシフトが全くないことを意味し、ユーザー体験が非常に安定していることを示します。
動的なコンテンツの読み込み等が無い静的ページというのが強いですね。
Speed Index - 0.2秒
Speed Indexは、ページのコンテンツが視覚的に表示される速度を示します。0.2秒は非常に速く、ユーザーにとって待ち時間がほとんどないことを示しています。
Googleと比較
阿部寛のホームページがどのくらい早いのか普段利用している https://www.google.com/ と比較してみます。
| 指標 | 阿部寛のHP | |
|---|---|---|
| First Contentful Paint | 0.2 秒 | 0.4 秒 |
| Largest Contentful Paint | 0.2 秒 | 0.6 秒 |
| Total Blocking Time | 0 ミリ秒 | 50 ミリ秒 |
| Cumulative Layout Shift | 0 | 0 |
| Speed Index | 0.2 秒 | 0.7 秒 |
CLSに関しては共に0ですが、他は全てにおいて 阿部寛のホームページ が勝っています。
静的ページであり、JavaScriptを全く使っていないことが大きい要因でしょう。
阿部寛のホームページは全てが優れているのか
阿部寛のホームページ の全てが優れているのかというとパフォーマンス以外は課題があります。
- httpsでの接続に対応していない
- W3Cに対応できていない
- モバイルフレンドリーではない
阿部寛のホームページの価値
阿部寛のホームページ は、どのような価値があるのでしょうか。
-
シンプルな設計:
現代のウェブサイトは、JavaScriptやCSSフレームワーク、アニメーションなど多くの技術を駆使していますが、阿部寛のホームページは非常にシンプルなHTMLとCSSだけで構成されています。
これにより、ページの読み込みが極めて高速になっています -
最低限のリソース使用:
多くの現代的なウェブサイトは、多数の外部リソースを読み込むため、ネットワーク帯域を大きく消費します。
しかし、阿部寛のホームページは画像やテキストのみで構成されており、外部リソースの読み込みがほとんどありません -
多様なデバイスでの表示確認:
さまざまなデバイスやブラウザで表示できるかを試すための対象となっており、ゲーム機やレトロPCなどでの表示確認のテストベッドとして使われることもあります。
古い技術でもきちんと表示できることが確認できるため、技術者の間で話題になることも多いです -
ノスタルジックなデザイン:
レトロなウェブデザインは、懐かしさを感じさせ、独自の魅力を持っています。
現代のウェブデザインが洗練されていく中で、逆にこのシンプルで懐かしいデザインが新鮮に映ることもあります。
若い世代の人々はどのように感じるのかな・・・
まとめ
阿部寛のホームページ は、そのシンプルさと高速な読み込み速度で多くの人々に愛されており、ネットミームにもなっています。
技術的には現代のウェブ標準には対応していない部分もありますが、そのシンプルさが逆に魅力となっており、阿部寛さん自身の魅力とともに、このホームページもまた、時代を超えて人々の心に残る存在になっているのだと思います。
御本人も気に入っているようなので、是非変わらず運用していってほしいですね。
阿部寛さんと言えば、TRICKでの上田次郎役が印象的ですよね。
あの「なぜベストを尽くさないのか」という台詞、このホームページにも通じるものがあるかもしれません。
超高速な読み込みを実現するこのサイトは、まさに読み込み速度においてベストを尽くした結果と言えるでしょう。