メンバーブログ

上場企業225社のレスポンシブWebデザイン採用率とレイアウトパターン

2021年07月06日

• シャッチョー

2012年のGoogleによるレスポンシブWebデザイン（以下、RWD）推奨 ^[1] から10年近く経ちました。
今後の提案活動の参考とすべく、あらためて国内企業公式サイトでのRWD採用率やレイアウトパターンについて調査をすることとしました。

調査概要

調査期間

2021年6月28日（月）～2021年6月30日（水）

調査対象

日経225銘柄企業 ^[2] の公式サイト

調査方法

企業概要（基本情報）ページ ^[3] をフルHDモニタのPC上で確認

調査結果

結果①：RWD採用率

企業公式サイトでのRWD採用率は87.1%となり、RWDはWebサイトデザインのデファクトスタンダードになったと言えるでしょう。
一方、非RWDとしてカウントした中には、消費者・顧客向けのサービスサイトのみRWD、あるいはホーム（総合トップ）のみRWDというケースがありました。予算やリソースの関係で企業情報系ページのRWD化が後回しになっていると推測されます。 ^[4]

RWD採用率
RWD 196サイト（87.1％）、非RWD 29サイト（12.9％）
構成比は小数点以下第2位を四捨五入

結果②：RWD企業サイトでのレイアウトパターン

RWD企業サイトでのレイアウトパターンはシングルカラムが52.6%と優勢 ^[5] のようです。
一方で、左右いずれかにローカルメニューを配置するマルチカラムレイアウトも42.3%と、まだ根強く支持されている印象。企業情報系カテゴリでは階層構造が深くなりがちなため、ローカルメニューの設計・配置に工夫が必要です。パッと見での分かりやすさでは、従来型のローカルメニューにも分がありといったところでしょうか。
個人的に興味深かったのは、フルHD以上のワイドモニタにも対応した、フルリキッドでのマルチカラムレイアウトが数社で採用されていたことです。このフロントエンドエンジニア泣かせのレイアウトが、どこまで広まるか注目！です。

レイアウトパターン
シングルカラム 103サイト（52.6％）、マルチカラム 83サイト（42.3%）、フルリキッドマルチカラム 10サイト（5.1％）
構成比は小数点以下第2位を四捨五入

結果③：RWD企業サイトでのヘッダー/フッターエリアのナビゲーション

RWD+シングルカラムではオミットされがちなローカルメニューを代替/補足するナビゲーションについて追加で調べてみました。ヘッダーエリアでは「メガドロップダウン」、フッターエリアでは「フッターサイトマップ」の採用が多いようです。
後者に関してはドロワー式やアコーディオン式の場合もあり、レイアウトバランスを踏まえて工夫が凝らされているのが印象的でした。

1.  ^ Recommendations for building smartphone-optimized websites Google Developers 2012年6月6日
2.  ^ できれば全上場企業を対象としたかったのですが、日本を代表する企業として日経225銘柄企業をひとまず対象に。
   グローバルサイトやマルチサイトとして構成されている場合は、ドメスティックのコーポレートサイトのみで判断。
3.  ^ 消費者や顧客の目につきやすいページのみをRWD化しているケースが間々あるため、「どの企業でも必ず掲載している」が「後回しにされやすい」企業概要（基本情報）ページを対象に。
4.  ^ 本調査の主旨からは外れますが、AOSSL化されていない企業サイトが2件あり。うち1件はSSL証明書がインストールされているにも関わらず、適切なリダイレクト設定がされていないため、Google検索結果上では平文URLでインデックスされた「もったいない」ケース。ぜひ気づいて欲しいです……。
5.  ^ 数年前の記事ですが。1カラムレイアウトはもはや王道! Webサイトデザインの基本を解説 Web担当者フォーラム 2018年3月28日