ナレッジ
Webデザインの参考になる! 代表的なギャラリーサイト11選を紹介
Webデザインの参考になる! 代表的なギャラリーサイト11選を紹介

自社でWebサイトを立ち上げるにあたって、デザインのイメージや、制作の依頼先に悩むことは少なくありません。そこでまずは、Webデザインの参考となるサイトを探すことが重要です。
本記事ではWebデザインの探し方や、国内外のギャラリーサイト、制作を依頼する流れについて紹介します。ぜひWebサイトの制作にお役立てください。

日本テレビアート サービス概要資料

日本テレビアート サービス概要資料

日本テレビアートが培ったノウハウとそこから生まれたサービスの概要、手掛けたデザイン事例を資料にまとめました。ぜひご覧ください。

Webデザインの参考になるサイトを探す重要性

Webサイトの制作を外部に委託する場合でも、デザインの方向性は自社で考える必要があります。しかし、具体的なイメージが湧かずに悩んでしまうこともあるでしょう。

このような状況を打破するには、既存のWebサイトを参考にすることが有効です。さまざまなWebサイトのデザインを観察することで、イメージの方向性を考えるのに役立ちます。さらに、社内だけでは生まれなかった新しいアイデアの発見にもつながります。

参考となるサイトを事前にいくつか選定し、それをもとにデザイナーに具体的な説明を行えば、イメージを的確に伝えることができます。デザイナーと具体的なイメージを共有することで、修正ややり直しの可能性が低くなり、スムーズに制作を進めることができます。

さまざまなWebデザインを探す方法

以下に、参考になるデザインを探す方法をお伝えします。

競合や同業他社のサイトから探す

まず参考にしやすいのは、自社と同じ業界、業種、業態などの他社のWebサイトです。一社に限らず、自社と関係性がある中から複数のサイトを確認します。これにより、業種などの共通する要素から、デザインの傾向を見ることができます。
この際、検索結果の上位に出てくるサイトを重点的にチェックしていきましょう。上位に出てくるサイトは、その業界、業種、業態でのビジネスで成功していると考えられます。そうしたサイトのデザインや方向性は、見る人にとって受け入れやすく、好ましいものであると考えられます。上位のサイトでは、トップページの印象やコンテンツへの導線といった観点からも、自社で応用できるポイントを知ることができます。

なお、業種などのデザインの傾向を知っておくことは、あえてそれに沿わず独自の方向性を打ち出す戦術にも活かせます。その際には、自社のサービスの特徴、マーケティング戦略なども十分に考慮する必要があります。

ギャラリーサイトから探す

ギャラリーサイトは、さまざまなWebサイトのデザインをまとめたサイトです。Webデザインの閲覧に特化しており、短時間で数多くのデザインに触れることができ、効率よくデザインを比較できます。
ギャラリーサイトには便利な機能もあり、膨大な数のサイトから形状や色、あるいは業種といった項目を指定して検索できます。
なお、ギャラリーサイトによって優れたデザインのWebサイトを集めたもの、LP(ランディングページ)だけを集めたものなど、サイト自体の方向性はさまざまです。おすすめのギャラリーサイトについては、詳しく後述します。

Webデザインの参考になるサイトを探す時のポイント

Webデザインの参考とするために重要なのは、自社のターゲット・コンセプトに近いものであるかという点です。
デザインを探す前に、まずは自社のWebサイトが訴求したい客層、年齢層、職業などのターゲットや、販促、会社案内、求人などのうち何を目的とするかのコンセプトを明確にしておきましょう。これにより、Webサイトに必要な内容、項目が明らかになれば、それに沿って参考として有効なサイトを見つけられる可能性が高まります。

なお、Webサイトを構築する技術は年々進歩しており、デザインにも流行があります。更新が少ないギャラリーサイトでは、ひと昔前のデザインが多く残ったままとなっていて、参考にならないかもしれません。最新のデザインや見せ方の流行をしっかり押さえたいのであれば、更新頻度にも注目して利用するサイトを選びましょう。

さらに、有用なサイトを見つけたら、それらのデザインやコンテンツをピックアップし、制作するデザイン、方向性の立案に活かせるようにします。自社イメージに近いか、見やすさ、色やあしらい、フォント、イラスト・写真、コンテンツといった点を整理し、デザインを定めましょう。

【国内】Webデザインの参考になる! ギャラリーサイト7選

ここからは、おすすめの国内ギャラリーサイトを7つ紹介します。

I/O3000

老舗のギャラリーサイトのひとつで、国内外の企業やブランドの高品質なサイトが見られます。カテゴリ別、タグ別、色別、掲載年別など、細かい検索ができるのが特徴です。タグ別の検索では、カルーセル表示(コンテンツがスライドして切り替わる方式)を含むデザインの検索が可能であり、また、掲載年別の検索によって流行の流れを知ることができます。さらに、テキストを入力して検索する機能も備わっており、利便性が高いです。

I/O 3000 | Webデザインギャラリー

MUUUUU.ORG

こちらも老舗ギャラリーサイトで、国内外のサイトを豊富に掲載しています。サイト表示の大きさは適度に小さめで、数多く見たい時に便利です。業種別でカテゴリ分けされているほか、デザインでも細かく分けられていて、「ファブリック調」「グリッド」「手書き風・ハンドメイド」といったものがあります。ほかにも、サイトのタイプ別、色別に分けて見ることができ、イメージに近い雰囲気や形が見つけやすいのが特徴です。

MUUUUU.ORG

SANKOU!

国内のおしゃれなサイトを厳選したギャラリーサイトです。カテゴリが細かく分けられていて、Webサイト、LPなどのページの種別や、企業サイト、ブランドサイトなどの種類、ユニーク、印象的・細やかな動き、3D表現・3Dイラストを使用などの特徴、業種、テイスト・あしらい、色・配色、ステキポイント、動き・ギミック、レイアウトなどから探せます。このように、サイトのイメージを探す方向性の豊富さが特徴です。ほかにも気に入ったサイトの登録ができるお気に入り機能や、スマホ特化サイトだけが見られる一覧機能もあります。

SANKOU!

Web Design Clip

Webサイト制作に役立つ流行を押さえた、クリエイティブでおしゃれなサイトが数多く集められています。検索機能はユニークかつ細かく分けられていて、カテゴリ(業種)、色、レイアウト、テイスト・スタイル、デザイン・エレメント、インテグレーション・テクノロジー、キーワードなど、さまざまな方向から探せるのが特徴です。トップページで、国内、国外、LP、スマホ向けをタブで切り替えられて、手軽で便利に役立つサイトを探すことができます。

Web Design Clip

WebGL 総本山

ここはここまでご紹介したサイトとは少し違ったユニークなサイトです。優れたデザインのWebサイトを数多く掲載するのはもちろんですが、そのサイトについて記事形式の詳細な解説がつけられています。サイトを見るだけでなく、特徴や評価を読めるので、自社の方向性やターゲットにあわせて細かく検討できます。デザインだけではなく技術的な要素も紹介されており、Webエンジニアの中でも人気のあるサイトです。
なお、絞り込みは大まかにタグで分けられているのみで、テキスト検索から見つける必要があります。更新は月に20件程度と高い頻度で行われています。

WebGL 総本山

Web Design Garden

情報が毎日更新され、鮮度の高いWebサイトをいつでも見られるのが特徴です。表示がコンパクトで、一度に数多くのサイトを確認できます。
検索は、サイト種別、業種・業界、機能・要素、印象・レイアウト、色で分かれており、それぞれがさらに細分化されていて、さまざまな方向性からデザインを探せます。手軽で効率よく使える、利用しやすいサイトです。

Web Design Garden

日本テレビアート

日本テレビアートは、日本テレビの番組における美術制作で培ったデザイン力を基盤に、Webやグラフィックなどさまざまなクリエイティブを制作しています。日本テレビアートの以下のサイトでは、Webサイト制作の実績を一覧で見ることができます。

Web Design | 実績

また、サイト内の「ナレッジ」というカテゴリでは、Webサイト制作の基本知識やコツなどの情報をブログ記事として発信しています。デザインを参考にできるだけでなく、制作の知識を得られるので、Webサイトの構築に役立てられます。

【海外】Webデザインの参考になる! ギャラリーサイト4選

ここまでは国内のサイトをご紹介してきましたが、海外サイトもデザインの参考にできます。以下のサイトも、ぜひ見てみてください。

AWWWARDS

老舗かつ権威のあるギャラリーサイトであり、Webサイトに対するさまざまな賞を認定しています。サイトに応募し、掲載されているサイトは、厳選された審査員とユーザーによって、デザインをはじめとした計4つの基準から評価されます。
各サイトの評価を見られるので、流行をとらえるのに役立ち、デザインの参考にする際の目安としても有効です。検索はテキスト入力のほかに、細分化された項目から選ぶこともできるので、目的に応じた利用ができます。

AWWWARDS

CSS Design Awards

こちらも同様に、厳選された審査員の投票で、デザインを評価する有名サイトです。世界中の優れたデザインのWebサイトが見られます。
評価は「UIデザイン」「UXデザイン」「革新」の3項目でスコア表示されます。「ブログ」では月ごとのベストサイトが掲載されていて、流行をとらえるのにも役立ちます。サイトの検索はテキスト入力のほかに、アニメーション・タイポグラフィ・グリッドなどの「特徴」や「業界」「色」などの項目に分かれていて、目的に応じてサイトが探せます。

CSS Design Awards

FWA

このサイトはイギリス発で、2000年創業の老舗です。こちらも世界中の優れたWebデザインを評価つきで見られます。Webデザインの開発における革新性が評価対象のひとつとされ、世界中の審査員がデザインを評価した結果がポイントで表示されます。また、Webサイトに限らず、アプリやVR、ARコンテンツといったあらゆるデジタル媒体を審査の対象としています。

The FWA

CSS Winner

こちらも優れたWebサイトを表彰することで、革新的なWebデザインの開発を促進することを目的としたサイトです。評価項目はデザイン性、機能性、使いやすさなどがあります。質が高くオリジナリティがあるWebサイトを数多く紹介しており、デザイン立案の参考に役立ちます。

CSS Winner

Webデザイナーにホームページ制作を依頼する方法

さまざまなデザインを参考に、実際に依頼するWebサイトのイメージが浮かんできたら、デザイナーに依頼する段階に入ります。ここでは、Webサイト制作の大まかな流れをご紹介します。

目的の明確化

まずすべきことはWebサイトを制作する目的の明確化です。
デザインを発注する前に、Webサイトによって達成したいことは何なのか、なぜ外注するのか、といった制作のねらいや概要を明らかにすることで、のちの進行がスムーズになります。
前述のように、Webサイトを作りたいという漠然とした思いだけでは、デザイナーもどう作ればよいのかイメージできません。この時点でデザインのイメージをはっきりさせておくと、依頼先の候補も絞りやすくなります。さらに、制作を依頼する範囲を決めておくことも必要です。なお、この段階でサイトのターゲット層について分析をしておくと、デザイナーとの打ち合わせが円滑になります。

デザイン依頼先の検討・契約

制作の目的、Webサイトのイメージ、依頼範囲が決まったら、デザインの依頼先を検討します。
制作会社やデザイナーによって、得意とするジャンルや制作できるレベルが異なります。ポートフォリオなどを見て実績を確かめ、目的やイメージに合う依頼先を決定しましょう。
円滑な制作の進行とイメージしたデザインが完成するかは、どこへ依頼するかにかかってくるので依頼先決定は安易に行わず、さまざまな要素からふさわしい制作者を選びましょう。
デザイナーを選んで契約したら、打ち合わせに入ります。ここで大切なのが、はじめの打ち合わせでの制作目的やイメージのすり合わせです。ここをおろそかにしてしまうと、イメージが制作者にしっかり伝わらず、進行に支障をきたす原因になります。

Webページ制作

制作段階に入ったあとは基本的に待つだけですが、発注側として方向性のずれが出ないよう、こまめに制作者とイメージをすり合わせることが大切です。なお、サイトに掲載する画像や文章といった素材の一部は、自社で用意する必要があります。デザイナーと円滑なコミュニケーションを図り、相互に要求を伝えあってクオリティの向上を目指しましょう。

テスト/公開

Webサイトができあがったら、テストを行ったうえで公開します。テスト内容は、コンテンツの正しい表示、バナーのリンク、誤字脱字や文章内容のチェック、動作確認などがあります。発注者側もテストに参加して、問題点を洗い出し解消します。
公開後はWebサイトが本来の目的を達成できているかを確認します。Web解析ツールを使ってアクセスするユーザーのデータ分析をし、問題の発見と解消を繰り返してサイトを改善していきます。

Webサイト制作の依頼先によっては、公開後のマーケティングといったサイト運営まで依頼できるケースもあります。不安がある場合は、運用も含めて依頼を検討しましょう。

まとめ

Webサイトの制作を依頼するにあたっては、事前になるべく具体的なデザインや方向性を固めておくことが大切です。同業他社のサイトやギャラリーサイトを確認することは、そうした方向性の決定に役立ちます。

なお、制作会社やデザイナーによって得意なジャンルや扱える技術などのレベルには違いがあるため、依頼先も慎重に選ぶ必要があります。クオリティの高いWebサイトを制作するには、実績が豊富なWeb制作会社を選びましょう。

日本テレビアート サービス概要資料

日本テレビアート サービス概要資料

日本テレビアートが培ったノウハウとそこから生まれたサービスの概要、手掛けたデザイン事例を資料にまとめました。ぜひご覧ください。

カテゴリーから記事を探す

もっとみる