【2023年1月13日更新】キャプチャ画像や情報を最新の状態に更新しました。
こんにちは、編集長のカワウソです!
ホームぺージを作るにも、完成後のイメージが何もない状態だと、なかなか前に進まないですよね。
とくに初心者の方であれば、「どんなページが必要か分からない」「どんなデザインがよいか分からない」と困ることも多いはず。
そんなときは、他社のホーぺージを参考にするのがおすすめです。
そこで今回は、他社のホームぺージをまとめて閲覧できる「ギャラリーサイト」を12個紹介します。
カワウソ
この記事は次のような人におすすめ!
- 初めてホームページを作る人
- ホームぺージの構成やデザインで迷っている人
- 参考になるホームページを探している人
この記事を読めば、これから作るホームぺージについて具体的なイメージが持てるため、プロジェクトを円滑に進められるようになります。
「すぐにギャラリーサイトを見たい」という方は、以下のリンクをクリックしてください。
それではどうぞ!
目次
他社のホームぺージを参考にするメリット3つ
他社のホームぺージを参考にするメリットは、以下のとおりです。
どんなページが必要かわかる
必要なページが分からなければ、ホームぺージ制作が前に進みません。
そもそもホームぺージは、会社の目的を達成するために作ります。
まず、目的を達成するためにどんなページが必要か、他社のホームぺージを参考に考えてみましょう。
「ホームぺージの目的が定まっていない」という方は、以下の記事を参考にしてください。

以下の記事では、ホームぺージの種類別に目的を解説しています。

デザインの方向性が定まる
「ホームぺージのデザイン」と一口にいっても、さまざまな要素から構成されています。
「どんなレイアウトにすれば見やすくなるのか」、「どんなカラーにすれば自社のイメージと合うのか」など、考えることは多いです。
また、⼀つひとつの要素をゼロから組み立てたとしても、全体のバランスが悪ければ目的を達成するホームぺージは作れません。
他社のホームページは「すでに完成した状態」であるため、それなりにバランスが整っています。
まずはイメージと近いホームぺージをいくつか探し出し、どんな要素があるのか抽出してみましょう。
※「ホームぺージのレイアウトって何?」という方は、以下の記事を参考にしてください。

イメージを明確に伝えられる
なかには、ホームぺージ制作をフリーランスやWeb制作会社に依頼しようと考えている方もいるのではないでしょうか。
「プロに頼めば理想のホームぺージが作れる!」、そう思いたいところではあるものの、現実は少し違います。
お互いの意思疎通が上手くとれず、失敗するケースは珍しくありません。
言葉でホームぺージの理想像を相手に伝えたとしても、お互いが同じイメージを共有できていなければ、失敗してしまいます。

あくまでもホームぺージは閲覧するもの。であれば、言葉ではなくビジュアルとして参考のホームぺージを提示するほうが、同じイメージを共有しやすいです。
ホームぺージデザインの参考になるギャラリーサイト12選
この記事では、以下4つの特性ごとにギャラリーサイトを分類し、紹介していきます。
以下、ギャラリーサイトの一覧表です。
※ギャラリーサイト名をクリックすると、該当の見出しにジャンプできます。
ギャラリー サイト名 |
分類 | 特徴 | 掲載数※ | 対象 サイト |
現代デザイン | 業種カテゴリが 豊富 |
トップページと下層ページを一度に確認できる | 約3,000 | 国内 |
MUUUUU.ORG | 業種カテゴリが 豊富 |
縦長デザインのホームページを厳選している | 4,680 | 国内/海外 |
81-web.com | 業種カテゴリが 豊富 |
フォントからホームページを探せる | 約6,000 | 国内 |
I/O 3000 | 便利な機能がある | 各ホームページをスライドショーで確認できる | 約7,000 | 国内/海外 |
S5-Style | 便利な機能がある | 「AND検索」や「OR検索」ができる | 8,599 | 国内 |
Parts. | 便利な機能がある | サービスサイトをパーツ単位で参考にできる | – | 国内 |
1GUU | 便利な機能がある | 一覧ページでアニメーションを確認できる | – | 国内/海外 |
SANKOU! | スマホサイトを 閲覧できる |
パソコンサイトとスマホサイトの表示を切り替えられる | 3,115 | 国内 |
bookma! | スマホサイトを 閲覧できる |
パソコンサイトとスマホサイトが横並びで見れる | – | 国内 |
Responsive Web Design JP |
スマホサイトを 閲覧できる |
スマホ、タブレット、パソコンが横並びで一覧表示される | 約3,500 | 国内 |
Web Design Clip |
WordPressサイトを探せる | さまざまな検索軸からホームページを探せる | 4,338 | 国内/海外 |
cms design | WordPressサイトを探せる | CMSで構築されたサイトを扱っている | 約1,500 | 国内 |
※2023年1月11日時点の掲載数です。
業種カテゴリが豊富なギャラリーサイト
参考になるホームぺージを探すなら、まず「業種」から検索してみてください。
業種が変わるだけで、ホームぺージのデザインはガラッと変わります。
たとえば、「建築」と「美容」ではイメージが大きく異なりますよね。
自社と同じ、もしくは近い業種であれば、参考になるホームページが早く見つけられます。
- 現代デザイン:トップページと下層ページを一度に確認できる
- MUUUUU.ORG:縦長デザインのホームページを厳選している
- 81-web.com:フォントからホームページを探せる
現代デザイン

▲出典:現代デザイン
対象 | 国内 |
業種カテゴリ数 | 35種類 |
掲載数 | 約3,000 |
キーワードから探す | 〇 |
カラーから探す | – |
レイアウトから探す | – |
『現代デザイン』は、トップぺージと下層ページの両方を一度に確認できるギャラリーサイトです。
多くのギャラリーサイトは、トップぺージのファーストビュー(アクセスして最初に表示される領域)のキャプチャーのみ掲載しています。
しかし、『現代デザイン』はトップぺージと下層ページの両方を掲載しているため、ギャラリーサイト上でホームぺージ全体の雰囲気を掴めますよ。
その他、「ブックマーク」機能が使用可能。お気に入りのホームぺージを見失う心配がないため便利です。
MUUUUU.ORG

▲出典:MUUUUU.ORG
対象 | 国内/海外 |
業種カテゴリ数 | 29種類 |
掲載数 | 4,680 |
キーワードから探す | – |
カラーから探す | ◯ |
レイアウトから探す | – |
『MUUUUU.ORG』は、縦長デザインのホームぺージを厳選して紹介しているギャラリーサイトです。
近年、スマホでインターネットを利用するユーザーは多いですよね。
縦長デザインはスマホで閲覧しやすいため、多くの企業ホームページでも採用されるようになりました。
キーワード検索こそできないものの、業種、デザイン、カラー、ホームぺージの種類など、さまざまなカテゴリから探せます。
海外サイトもヒットするため、『MUUUUU.ORG』はデザイン性の高いホームぺージを作りたい方におすすめです。
81-web.com

▲出典:81-web.com
対象 | 国内 |
業種カテゴリ数 | 25種類 |
掲載数 | 約6,000 |
キーワードから探す | – |
カラーから探す | ◯ |
レイアウトから探す | – |
『81-web.com』は、業種はもちろん、フォントから探せるギャラリーサイトです。
今回紹介するギャラリーサイトのうち、フォントから探せるのは『81-web.com』のみ。
「フォントの違いによる印象の変化」を確認できるため、ホームページの細かい部分を追い込むときに重宝します。
海外サイトは掲載されていません。逆に国内サイトに絞り込んで確認したい方にとっては見やすいでしょう。
便利な機能があるギャラリーサイト
便利な機能があり、参考になるホームページを探しやすいギャラリーサイトを紹介します。
I/O 3000

▲出典:I/O 3000
対象 | 国内/海外 |
機能 | スライドショー |
掲載数 | 約7,000 |
キーワードから探す | ◯ |
カラーから探す | ◯ |
レイアウトから探す | – |
『I/O 3000』は、各ホームぺージを「スライドショー」で見れるギャラリーサイトです。
画面右下のボタンをクリックすると、スライドショーが起動しますよ。
マウスで操作しなくても、次々に参考サイトが自動で表示されます。パッと見て直観的に参考になりそうなサイトを選びたい方におすすめです。
また、一つひとつ大きく表示されるため、会議などの複数名で閲覧するときにも便利。その他、キーワード検索できるのも嬉しいポイントです。
S5-Style

▲出典:S5-Style
対象 | 国内 |
機能 | AND・OR検索 |
掲載数 | 8,599 |
キーワードから探す | – |
カラーから探す | ◯ |
レイアウトから探す | – |
『S5-Style』は、絞り込み条件で「AND検索」や「OR検索」ができるギャラリーサイトです。
たとえば、カテゴリの「Creative」をイラスト、「Color」をイエローでAND検索すると、黄色のイラストが用いられたホームぺージのみヒットします。
ホームぺージをいくつか見て、だんだんと欲しい要素が絞り込めてきた方におすすめです。よりイメージに近いホームぺージを探し出せます。
また、今回紹介するギャラリーサイトのなかでは、「8,593サイト(※2023年1月4日時点)」と一番掲載数が多いです。
Parts.

▲出典:Parts.
対象 | 国内 |
機能 | パーツから探せる |
掲載数 | – |
キーワードから探す | – |
カラーから探す | – |
レイアウトから探す | – |
『Parts.』は、SaaS(サース)のサービスサイトをパーツ単位で参考にできるギャラリーサイトです。
「ヘッダー」「メインビジュアル」といった基本パーツはもちろん、「悩み・課題解決」「導入事例」など、サービスサイト特有のパーツから、参考のホームぺージを探せますよ。
また、「サービスの申し込み数を増やす」ための導線を参考にできます。
たとえば、「お問い合わせ」のパーツから探すと、各社の「問い合わせフォーム」を確認可能です。
ユーザーがストレスを感じて問い合わせフォームから離脱しないように、必須項目を分かりやすく表示したり、入力例を表示したりなど、各社それぞれの工夫を参考にできます。
サービスサイトやBtoBサイトを作る方は、ぜひ参考にしてください。

1GUU

▲出典:1GUU
対象 | 国内/海外 |
機能 | アニメーションを確認できる |
掲載数 | – |
キーワードから探す | – |
カラーから探す | 〇 |
レイアウトから探す | – |
『1GUU』は、一覧ページでホームページのアニメーションを確認できるギャラリーサイトです。
近ごろは、アニメーション付きのホームページが増えてきましたよね。
そういったホームページは、静止画ではなく、実際にアニメーションを確認しないと、デザインの印象が掴めません。
『1GUU』の場合、わざわざホームページにアクセスせずとも、アニメーションを確認できるため便利です。
また、計61ヵ国もの海外サイトが掲載されている点も特徴的。国内だけでなく、海外サイトからもインスピレーションを得たい方におすすめです。
スマホサイトを閲覧できるギャラリーサイト
スマホサイト(ホームぺージをスマホで閲覧した状態)で確認できるギャラリーサイトを紹介します。
- SANKOU!:パソコンサイトとスマホサイトの表示を切り替えられる
- bookma!:パソコンサイトとスマホサイトが横並びで見れる
- Responsive Web Design JP:スマホ、タブレット、パソコンが横並びで表示される
SANKOU!

▲出典:SANKOU!
対象 | 国内 |
表示 | パソコンサイト/スマホサイト(切替表示) |
掲載数 | 3,115 |
キーワードから探す | – |
カラーから探す | 〇 |
レイアウトから探す | 〇 |
『SANKOU!』は、パソコンサイト(画面)とスマホサイト(画面)の切替ができるギャラリーサイトです。
デフォルトはパソコンサイトであるものの、画面右上の「スマホ版」を押せば、スマホサイトの一覧に切り替わります。
本来スマホサイトを確認するには、スマホでアクセスするか、パソコンでアクセスしたのち、ブラウザの開発者用ツールを用いなければなりません。
しかし、『SANKOU!』なら手間をかけずに、ギャラリーサイト上でスマホサイトが確認できます。
その他、1カラム、2カラム、グリッドレイアウトなどの「レイアウト」から探せるのも特徴の一つです。
bookma!

▲出典:bookma!
対象 | 国内 |
表示 | パソコンサイト/スマホサイト(同時or切替表示) |
掲載数 | – |
キーワードから探す | 〇 |
カラーから探す | – |
レイアウトから探す | – |
『bookma!』は、パソコンサイトとスマホサイトが横並びで見れるギャラリーサイト。レスポンシブサイトを作る前に、パソコンとスマホでどのように表示が切り替わるのか実例を見たい方におすすめです。
ユーザーのデバイスに応じ、ホームページの表示サイズを自動で変えるデザイン。作るホームぺージは一つでも、パソコン、スマホ、タブレットなど、ありとあらゆるデバイスに最適化したぺージを表示できます。
画面上部の「スマホアイコン」をクリックすれば、スマホサイトだけを一覧にすることもできますよ。
1サイトごとに大きく表示されるため、見やすいです。
※レスポンシブサイト(スマホ対応のホームページ)の作り方については、以下で解説しています。

Responsive Web Design JP

対象 | 国内 |
表示 | パソコン/スマホ/タブレット(同時表示) |
掲載数 | 約3,500 |
キーワードから探す | ◯ |
カラーから探す | ◯ |
レイアウトから探す | – |
『Responsive Web Design JP』は、スマホ、タブレット、パソコンが横並びで一覧表示されるギャラリーサイトです。
『bookma!』同様にレスポンシブサイトを作る方におすすめ。デバイス(画面の横幅)が変化した場合に、どのようにメニューやコンテンツの配置が変化するのか確認しやすいです。
WordPressサイトを探せるギャラリーサイト
ホームぺージ制作の手段として「WordPress(ワードプレス)」を使う予定の方も多いのではないでしょうか。
そこで、「WordPressでどんなホームぺージが作れるのか、いまいちイメージが湧かない」という方に、おすすめのギャラリーサイトを紹介します。
※WordPressについては、以下で詳しく解説しています。

- Web Design Clip:さまざまな検索軸からホームページを探せる
- cms design:CMSで構築されたサイトを扱っている
Web Design Clip

▲出典:Web Design Clip
対象 | 国内/海外 |
特徴 | カテゴリタグに「WordPress」がある |
掲載数 | 4,338 |
キーワードから探す | ◯ |
カラーから探す | ◯ |
レイアウトから探す | ◯ |
『Web Design Clip』は、さまざまな検索軸から参考サイトを探せるギャラリーサイト。国内サイトやスマホサイトに絞ったり、業種やカラーから探せたりと便利です。
WordPressで制作されたサイトを絞り込むためには、画面右上のハンバーガーメニュー(三本線マーク)のなかにある「Tag(タグ)」を使いましょう。
カワウソ
『Responsive Web Design JP』も「TECHNIQUE(テクニック)」というカテゴリからWordPressサイトが探せます。
cms design

▲出典:cms design
対象 | 国内 |
特徴 | CMSで構築されたサイトを扱っている |
掲載数 | 約1,500 |
キーワードから探す | – |
カラーから探す | ◯ |
レイアウトから探す | – |
『cms design』は、CMS(シー・エム・エス)で構築されたホームページを扱うギャラリーサイトです。
「Contents Management System:コンテンツ・マネジメント・システム」の略で、HTMLやCSSなどのWeb制作スキルがなくても、簡単にホームページの制作や更新ができるシステムのこと。代表的なものに、「WordPress(ワードプレス)」があります。
一覧ページで「detail」をクリックすると、そのホームページで使われているCMSの種類が分かりますよ。

▲出典:cms design
WordPressでどんなホームページが作れるのか、イメージしやすくなるでしょう。
まとめ
今回は、ホームぺージデザインの参考になるギャラリーサイトを12個紹介しました。
- 他社のホームぺージを参考にするメリットは主に3つある
- 「ギャラリーサイト」を使えば、他社のホームぺージが一覧で見られる
- ホームぺージは自社と同じ、もしくは近い「業種」だと参考にしやすい
ホームページのデザインは、開設後の大きな変更が難しいです。
後悔しないためには、参考になるホームぺージをいくつか収集したのち、使い勝手について社内で議論することをおすすめします。
それでは素敵なホームぺージの完成を祈っております。
以上、最後まで読んでいただきありがとうございました!
ホームページの開設を検討している方へ
エックスサーバーは高速かつ高い安定性を誇る高性能レンタルサーバーです。
国内シェアNo.1※のレンタルサーバーであり、18万社の導入実績があります。
10月2日12時まで利用料金最大30%OFFキャンペーンを開催中です!
.comや.netなど大人気ドメインも永久無料と過去最大級にお得です。
さらに2023年9月29日12時まで、20周年記念プレゼントキャンペーンも開催中です!
PlayStation®5や星野リゾート宿泊ギフト券5万円分が当たるビッグチャンスです。
ぜひこのお得な機会にホームページ開設をご検討ください!
※ 2023年5月時点、hostadvice.com調べ。
法人向けレンタルサーバー「Xserverビジネス」なら、
「ホームページ無料制作サービス」が付いているため、
申し込むだけで2日でホームページが完成します!
Xserverビジネスだと「.com」以外にも「.co.jp」や「jp」などのドメインも無料になります。
当メディア「初心者のための会社ホームページ作り方講座」では、初心者の方にわかりやすく会社のホームページを始められる方法を紹介しています!
これから始める方はこちらのホームページの作り方をぜひご覧ください!

ホームページの始め方・立ち上げに関する、ご質問・ご相談はツイッターDM( @kawauso_xsv )までお気軽にどうぞ!