fbpx

As Best Creative, Do Everything For a Goal…

Blog 社員ブログ

BLOG

社員ブログ

Web制作
Webデザインはまとめサイトを見て学べ!参考7サイトをご紹介
2019/08/08


Webサイトの目的や意義にあわせてデザインを変えていくときには、参考となるサイトを見て優れたWebデザインを学んでいくことが重要です。
読み込みの速さや検索・カテゴリの使い勝手など、ユーザーの視点に立ってデザインを考えていくことも意識しておきましょう。
また、サムネイルの見やすいデザインであれば、ユーザーの関心を惹きつけることに役立てられます。
今回は、Webデザインを考える際に参考にしたいまとめサイトについて見ていきましょう。

目次

タイプやカテゴリから選べる「siteInspire」

「siteInspire」はロンドンのデジタルスタジオが運営しており、世界中から優れたデザインのWebサイトを集めているまとめサイトです。
siteInspireのスタッフ自ら掲載するWebサイトを厳選しており、すべてのサイトがレスポンシブデザインとなっています。
タイプ・スタイル・サブジェクトといったカテゴリ検索も可能であり、目的に合ったWebサイトを見つけやすい仕様です。
また、タグの種類が豊富であり、「ナビゲーションが凝っているサイト」や「背景に動画素材を用いている」といった指定で検索することができます。

海外のまとめサイトであるため英語での利用が求められるものの、キーワードでの検索ができるので特に問題はないでしょう。
掲載されているWebサイトの種類としては、法人サイトやショップサイト、ポートフォリオなどがメインとなっています。
詳細ページを開くと関連するWebサイトがアップされるので、イメージに合ったサイトを探すのに役立ちます。

投票によって掲載サイトが決まる「AWWWARDS」

「AWWWARDS」は海外において有名なWebデザインのまとめサイトであり、アメリカ・フランス・イギリス・日本などからWebサイトが選ばれています。
さまざまな立場の人と審査員からの投票によって掲載されるWebサイトが決まるのが特徴です。
投票は、デザイン(40%)・ユーザビリティ(30%)・クリエイティビティ(20%)・コンテンツ(10%)の4つの評価軸に対し、10点満点で行われます。

「Site of the Day」という賞が設けられており、注目されているWebサイトをユーザー視点で確認することが可能です。
月・年単位でもさまざまな賞が授与されているため、受賞しているWebサイトを調べてみるだけでもデザインを生かすことができるでしょう。
客観的に高い評価を得ているWebデザインを知りたい人にとって、メリットが大きいまとめサイトです。

最新のトレンドを意識することは、Webデザインにおいて重要な点でもあります。
日本国内だけではなく、海外のWebサイトが豊富に比較できるAWWWARDSを活用して、ユーザーを引きつけるデザインを探してみましょう。

保存やチェックが簡単にできる「81-web.com」

「81-web.com」では、日本の優れたWebデザインとまとめサイトを取り上げています。
サイト画面で「+」のボタンを押すとお気に入りとして保存することができるなど、操作性に優れているのが特徴です。
ログインをしなくても保存できるので、いったん保存をして後からチェックし直すといった使い方ができます。
そして、画面に表示されているアイコンを押すと、Webサイトのレイアウトを全体的に確認できるのです。
ページにアクセスしなくてもWebサイトをチェックできるので、イメージに合ったものを探すときに重宝する仕様となっています。

PCとスマホの表示を比べながら選べる「bookma! v3」

「bookma! v3」は、レスポンシブデザインを比較するのに向いているWebデザインのまとめサイトです。
PCとスマホでの表示画面が並んで掲載されているので、一目でイメージを確認することができます。
また、サイト画面の上部にあるアイコンを押すとPCもしくはスマホの表示に絞って閲覧できるため、作りたいWebサイトのデザインを膨らませることに役立てられるでしょう。
bookma! v3の仕様はシンプルで、キーワード検索も可能です。
さまざまなWebサイトを視覚的にチェックできるため、比較検討する際に活用できます。

ランダムにWebページが表示できる「I/O 3000」

「I/O 3000」は、日本国内だけでなく海外のWebサイトも掲載されているため、豊富な種類のWebデザインを比較することができます。
カラー・タグ・カテゴリから検索することが可能なので、思いついたキーワードでどんどん検索できるでしょう。
また、アーカイブも確認できるため、特定の時期のトレンドを探ることにも役立てられます。
I/O 3000では、オートスクロール機能が備わっているので、一覧ページを下方向にスクロールしていくと続きが自動的に読み込まれる仕様となっています。

また、「シャッフルボタン」を押すことによって、掲載されているサイトのなかからランダムで表示することもできます。
デザインの考案に行き詰まってしまったときや、インスピレーションを得たいときに活用できるでしょう。
これまでの発想にとらわれずにデザインを見つけたいときに利用すれば、思いがけないWebデザインを発見できる可能性もあります。

クリエイティブの高さが特徴的な「WebDesignClip」

「WebDesignClip」はサイトの読み込みが速いため、ストレスを感じることなくWebデザインを探すことができます。
サムネイルも大きめに表示されるため、視覚的に利用しやすいサイトだと言えるでしょう。
日本国内のデザインと海外のデザインが分けられているので、目的にあわせて利用することができます。
また、ほかのまとめサイトに見られない特徴としては、LP(ランディングページ)だけでの閲覧も可能となっていることが挙げられます。
スマホ版のWebページの絞り込みもできるため、モバイル端末を重視したWebデザインを考えるときに活用できるでしょう。

カラー・レイアウト・カテゴリ・タグといったさまざまな方法で検索でき、マイクリップに追加をするとログインしなくても気に入ったWebサイトを保存できます。
サブカラーでもカラー検索ができるのが特徴で、メインカラーに合わせる色を探すときに便利だと言えます。
配色を変えるだけでも、Webサイト全体のイメージが変わる場合があるので、いろいろなパターンを試してみましょう。

WordPressでのサイトデザインの参考になる「WeLoveWP」

「WeLoveWP」は、WordPressで作成されたサイトがメインとなっています。
そのため、個人のブログやポートフォリオなどが中心に掲載されているのが特徴です。
Webデザインを考える目的だけでなく、WordPressのテーマ探しにも活用できます。
一見してWordPressで作られたものだとはわからないものもあり、WordPressをメインプラットフォームとしデザインを考えるときには参考にしやすいサイトです。
WordPressには初めからテンプレートが備わっているものの、いまひとつデザインが気に入らないという場合には、WeLoveWPを活用してみましょう。

Webデザインのまとめサイトをチェックするときの注意点

Webデザインに関する数多くのまとめサイトがあるため、どのサイトを参考にすべきか迷ってしまうこともあるでしょう。
まず、基本的に押さえておきたい点として、更新頻度が高いまとめサイトを参考にすべきだと言えます。
Webデザインのトレンドは固定化されたものではなく、常に変化しているものです。
現在はトレンドとなっているWebデザインであっても、1年後には適さないものになっている可能性もあります。
1つのデザインにこだわるのではなく、トレンドに合わせて柔軟にデザインを変更していくことも大切です。
そのため、できるだけ更新頻度の高いまとめサイトを選ぶようにしましょう。
定期的に更新が行われているサイトであれば、最新のWebデザインのトレンドが反映されている可能性も高いと言えます。

そして、Webデザインを比較するときには、同じ業種か関連のある業種のものを参考にしてみましょう。
競合する企業や個人がどのようなデザインを採用しているのかをチェックすることは、全体の傾向を把握するためにも大切です。
Webデザインといっても、業種ごとに好まれるものは違ってくるため、できるだけ近い業種のものを参考にするほうが無難でしょう。
ただ、あえて斬新なアイデアを求める場合には、異なる業種のWebデザインも取り入れてみるのも良いです。

参考にするWebデザインが見つかったら、カラーや画像の位置、フォントなどにも目を向けてみることが重要です。
メインカラーとサブカラーをいろいろな組み合わせで比較できるサイトもあるので、どのカラーが一番イメージに近いのかを考えてみましょう。
また、画像の位置やフォントの種類・大きさによっても、Webサイトの印象は違ってきます。
まとめサイトを活用するメリットは、さまざまな事例を実際に見ながら学ぶことができる点にあるでしょう。
自分のイメージにあわせてカスタマイズすることによって、魅力的なサイト作りを進めていくことが大切です。

特にWebデザインを初めて学ぶ人は、公開する気のないWebページを1から作ろうとしても、途中で挫折してしまうこともあります。
まとめサイトに掲載されているWebデザインを参考にしつつ、実際にWebサイトを立ち上げてみるとデザインに関するスキルを磨くことができます。
Wordpressであれば、基本的なレイアウトはテンプレートとして備わっているので、自分なりにアレンジを加えてWebサイトを構築してみましょう。
一度自分でWebサイトを作成してみると、まとめサイトを見たときにどのデザインを参考にすべきか判断しやすくなるはずです。

さらに、Webデザインのスキルを磨いていくためには、SEOやアクセス解析についても学んでみましょう。
Webに関する知識は常に変化しているので、コツコツと身につけていく必要があります。
Webデザインを変更したときには、アクセス状況などを見てユーザーの反応をチェックしてみましょう。
Webデザインを有効に活用するためには、単に多くの事例に触れるだけではなく、オリジナリティやユーザビリティを意識しておく必要があります。
どのようなデザインが支持されているのかを踏まえたうえで考えることが大切です。

トレンドとオリジナリティを意識しよう!

デザインは流行や最新の技術などによって日々変化していくため、普段から意識を向けておくことが大切です。
日ごろから気になるまとめサイトをチェックしておけば、Webデザインを変更する際にもヒントが得られるでしょう。
気になるデザインを基礎として、自分ならどのように構築のかを考えると、いろいろと学びが得られるものです。
トレンドを押さえつつも、オリジナリティを持たせたWebデザインを念頭に置いて、サイト制作を進めてみましょう。

SHARE

PLEASE CONTACT US

Web制作、SEO、各種デザイン制作など、集客についてお困りのことがあれば、
いつでも下記のボタンからお問い合わせください。

Go to TOP
Go to TOP