Webデザインを勉強するのに参考になるようなサイトってある?
こんにちは!のざきち( @nozakichicken )です。
そんな時は、Webデザイナーがデザインする際に参考にする「ギャラリーサイト」があるよ!
そこで今回は、わたしが日頃参考にしている素敵なギャラリーサイトを、Webサイト・レスポンシブ・LP(ランディングページ)・パーツ別・バナー別の5カテゴリーにまとめてみました。
今回紹介する参考サイト自体は、最新デザイン・見やすいサイト・探しやすいサイトを厳選しました。デザイントレンドをチェックする際にぜひご活用ください!
※サムネイルをクリックしてもリンクに飛びます。
WEBサイト
まずはWebサイト全体の参考になるサイトです。
素敵なサイトばかり掲載されており、見ているだけでも楽しくなってきますよ!
SANKOU!
Webデザイン制作の参考になる国内のステキなサイト集。
Webデザインのギャラリーサイトといればこれ、というくらいメジャーなサイトです。
業種別・目的別・色別など、いろいろな角度から検索できます。
気に入ったものをお気に入りに登録して後から見ることもできます。
Webサイトのほか、LP(ランディングページ)、コンテンツページなども検索することができます。
I/O 3000
Webデザインに関わる人のためのWebデザインギャラリーサイト。
更新頻度が高く、国内外を問わずWeb制作の参考となるサイトをセレクトされています。
カテゴリー・タグ・カラーなどのいろんな角度から探すことができ、フリーワードでも検索することができます。
シャッフル機能もあるので、なんとなく見にきた!という場合でも楽しみながら、新しいデザインに触れることができます!
MUUUUU.ORG
クオリティが高い縦に長いサイトを厳選して集めているサイト。
縦に長いサイトに特化しているため、目的に沿った探し方をすることができます。
サイト自体もクオリティーの高いものばかりです。
レスポンシブ
スマホやタブレットでWebサイトを見るのが当たり前になってきています。
PCだけでなく、スマホ・タブレットに特化したギャラリーサイトもありますので、紹介していきます。
Responsive Web Design JP
日本国内の秀逸なレスポンシブWebデザインを集めたギャラリーサイト。
スマホ ・タブレット ・ パソコンの表示を一覧表示で見られます。
それぞれのデバイスでの表示を一目でチェックできて、とても便利です。
カテゴリー・カラー・タイプのほか、技術面からでも検索することができます。
sps collection
スマートフォンサイトのデザインリンク集。
スマートフォンサイトに特化したギャラリーサイトです。
カテゴリー・カラー・アーカイブから検索することができます。
詳細をクリックすると、それに似たデザインのサイトもあわせて表示してくれるので非常に便利です。
LP(ランディングページ)
ランディングページは成約率などを高めることを目的とするため、どれだけ成約につながるデザインにできたかが重要です。いろんなサイトを参考にして、デザインの引き出しを増やしていきましょう!
LPアーカイブ
LPの最新デザインまとめ参考サイト。
登録LPデザイン数は23,000超えで圧倒的な数です!
カラー・カテゴリー・イメージから検索することができます。
ファーストビューのキャッチコピーが大切なLPにおいて、「キャッチコピー一覧」からも探すことができるのもとってもユニークです。
LPadvance
LP制作・Web広告に参考になるLPデザインまとめリンク集。
カテゴリー・タイプ・色・メインビジュアルを指定して検索できます。
サムネイルをクリックすると、サイト内でLPの全体を確認できるのが便利です。
スクロールや動画などのような効果・エフェクトからも探すことができ、幅広いLP制作で参考になります。
パーツ別デザイン
ここのパーツのみ参考にしたい!となった時ありませんか?
ヘッダーやフッターなど、パーツやセクションごとのデザインを部分ごとに一覧にしている便利なサイトもあります!
Parts.
SaaS/LPのパーツ別Webデザイン集。
メインビジュアルやヘッダー・フッターだけではありません!
パンくずや404、会社概要やお知らせなどまでもが、さまざまパーツごとにデザインが見れちゃいます。
下層ページなどの部分的なデザインのみ参考にしたい場合にとっても便利です!
バナー
バリエーションやサイズの違いでたくさん作ることが多いバナー制作。
バナートレースの際にも参考になるので、勉強中の方にとっても欠かせないサイトを紹介していきます。
retrobanner
バナーデザイン専門ギャラリーサイト
バナーに特化したサイトで、いろいろなバナーデザインが見つけられます。
サイズ・色・業種・テイストから検索することができます。
バナーをクリックすると色やテイストなど基本情報が書かれており、とても参考になります。
Bannnner.com
バナーデザインの参考になるバナーを一覧でまとめ
こちらもバナーに特化したサイトで、サイズ・業種・テイストから検索することができます。
とにかくおしゃれなものが多く掲載されています。
テキストのみ・写真メイン・切り抜きのようなバナーの特徴からも検索でき、バナートレースする際にも勉強になります。
+α おまけ
バナーだけではなく、さまざまなデザインが検索できるサイトです。
「バナー」と検索するだけでも関連するものが無限と出てきますので、ワードを絞ってどんどん検索していきましょう。
会員登録が必要ですが、デザイナーであれば登録しておいて間違いないです。見ているだけでも勉強になりますし、気になるデザインを見つけたら、保存しておく機能もあります。
さいごに
Webサイト・レスポンシブ・LP・パーツ別・バナー別の参考になるギャラリーサイトをご紹介しました。
Webデザインでは、クライアントの要望を満たしつつも、ユーザーにとっていかに見やすいページを作るかが重要です。そのためには、自分で最適な目的を設定し、適切にデザインするスキルを身につける必要があります。ギャラリーサイトを参考にすると、どんな目的においてどのようなデザインがされているかを学べます。
自分の目的に合ったギャラリーサイトを参考にして、デザインの引き出しを増やしていきましょう!
気に入ったサイトはぜひブックマークして、いつでもみれる環境を作ってみてくださいね!
コメント