9ウェブサイトのデザインアイデア+インスピレーションを得るためのサイト

ウェブサイトのデザインのアイデア優れたウェブサイトのデザインを思いつくのは難しい場合があります.


クリエイティブジュースをオンデマンドで流すことができない場合、行き詰まりを感じてイライラするのは簡単です.

それがあなたが今(または時々)感じていることなら、この投稿はあなたを助けるためにここにあります.

以下では、デザイナーの問題を解決するための実用的な方法を提供します ブロック アイデアが流れていないとき.

準備はいい?始めましょう…

行き詰まったときの9つのWebデザインのヒント

あなたが良いアイデアを思い付くのを助けるために、私たちはあなたが取り組んでいるものを改善するためにすぐに使えるウェブデザインのヒントから始めます.

1. Pinterestムードボードを使用する

Pinterestは素晴らしいツールです ムードボード. プロジェクトで役立つと思われる、または指示を与えると思われる視覚的な資料を収集できます。これらは、画像、配色、レイアウト、既存のWebサイトなどです。.

Pinterestムードボード

ムードボードは、デザインのインスピレーションの中心的なハブとして機能します。また、クライアントや共同編集者と共有して、自分の資料に貢献することもできます.

2.ステップバイステップの計画を作成する

計画を立てるあなたは彼らが言うことを知っています:計画に失敗すると失敗する計画です。これは、Webデザインにも当てはまります。ウェブサイトのデザインのアイデアがうまくいかない場合、それはおそらく基本的なことをまだ扱っていないためです。基本が整っている場合にのみ、創造的なタッチを上に置くことができます。計画は次のようになります。

  1. ウェブサイトの目標を定義する —サイトが実際に達成することになっていることを知る必要があります。そうでない場合、一体何を目指しているのですか?良い目標はスマートです: S特別な, M簡単に, テイナブル, R有効な、そして Timely。それについてもっと ここに.
  2. 購入者のジャーニーをスケッチする —全体的な目標に加えて、訪問者にどのような道を歩んでほしいかを把握する必要もあります。彼らがあなたのサイトに到達したときから、あなたが考えているどんな目的に至るまで。そうすれば、途中でそれらを導くための構造を作成できます。 Hubspotには 素晴らしい記事 その上で.
  3. スタイルガイドを思いつく —スタイルガイドを作成すると、設計の一貫性を保つのに役立ちます。フォント、色、その他のデザイン要素を定義します。 1つを使用すると、特に他のユーザーと作業するときに均一性が促進されます. グーグル 良い例です.
  4. SEOを計画する — SEOにとって計画も重要です。訪問者と検索エンジンの両方の情報を構造化する方法を理解するためにWebサイトマップを作成する.

3.最初に構造に焦点を合わせる

計画を立てるのと同じように、最初にウェブサイトの構造に集中することで、プロセスから離れ、鳥瞰図をより多く得ることができます。.

お使いのコンピュータとは異なるメディアで作業すると役立ちます。たとえば、1本のペンで紙にスケッチを作成することで、今のところ、色やその他の詳細を忘れることができます。フリップチャートまたはホワイトボードを使用している場合は、全体を共同作業することもできます.

また、付箋にWebサイトを描画することもできます。これはあなたに必需品に固執することを強制します。これのバリエーションは、最初にグレーのシェードでデザインを作成し、後でのみカラーを追加することです。この方法では、色に依存せずに視覚的な階層を確立する必要があります.

グレースケールから始める
ローラ・エリザベス/スマッシング・マガジン

コンピューターを使って設計することに熱中している場合は、「スクイントテスト」を使用できます。これは、画面から離れて目を細めることを意味します。ぼやけた画像は、あなたのサイトで最も明白なものと、初めての訪問者が最初に気づく可能性が高いことを示します.

4. Web標準に固執する

クリエイティブになりたいのはデザイナーの本質です。それは一般的に良いことです。クリエイティブになるための境界を設定する必要があることに注意してください.

たとえば、Webデザインには、確立された標準がいくつかあります。訪問者は、特定のデザインの比喩とウェブサイトの要素に慣れています。これらのルールに違反しすぎると、混乱してオフになる可能性があります.

これらの確立された標準には次のものがあります。

  • すべてのページでのブランディングとデザインの一貫性
  • 左上にウェブサイトのロゴ
  • 右上または中央の連絡先情報
  • 画面上部のメインナビゲーション
  • メインの見出し/価値提案と行動を促すフレーズ
  • ヘッダーの検索機能
  • ウェブサイトのフッターにあるソーシャルメディアのアイコン

熱心なインターネットユーザーとして、ウェブサイトが準拠しているより多くの標準をすでにご存じでしょう。そうでなければ、あなたはそれらのより多くを見つけることができます ここに.

5.ミニマリズムとCTAボタンに焦点を合わせる

サイトとページの目的がわかっている場合は、その目的を果たせないものをすべて取り除くこともできます。これによりデザインが合理化され、見やすくなります.

繰り返しますが、これを裏付ける研究があります。上記と同じ調査で、Googleは視覚的な複雑さがウェブサイトの魅力と負の相関があることを発見しました。つまり、人々は圧倒されたくないのです!設計を簡素化することは、ウェブサイトの速度など、他の機能に適しています.

安全に削除できるいくつかの点を次に示します。

  • メニューアイテム —もちろん、あなたは他の人にあなたのサイトをもっと探検して欲しいです。ただし、オーバーロードされたメニューは非常に混乱しやすく、悪影響を与える可能性があります。再び–必需品にこだわる!
  • サイドバー —サイドバーを段階的に廃止するWebサイトが増えています。サイドバーには何がありますか?それは本当に重要ですか?
  • 泥だらけの専門用語 —ストック写真と同じことが言語にも当てはまります。使いすぎたフレーズ、決まり文句、中途半端な言葉は、人々に気を配らせます。それらの使用をやめ、あなたの文章に個性を注入し、いくつかを学びます パワーワード そして コピーライトを学ぶ.

6.モバイルから始める

モバイルデバイスは世界を席巻しています。今では、デスクトップコンピュータよりも電話やタブレットを介してWebサーフィンをする人が増えています。.

さらに, Googleが発表 彼らは彼らの新しいモバイルファーストのインデックスを展開していること。つまり、完全に有効な場合、検索エンジンはモバイルプレゼンス上のすべてのWebサイトを最初に判断します。適切に機能していない場合は、検索ランキングでヒットします.

そのため、ウェブサイトをデザインするときは、まずモバイルプレゼンスから始めるのが良いでしょう。今後は、モバイルユーザーが主な顧客になります。したがって、あなたは彼らが仕出していると感じることをよりよく確認するべきです.

同時に、ウェブサイトのデザインのアイデアを思いつくことは良い習慣です。繰り返しになりますが、モバイルから始めると、必需品に集中し、デザインの目的をよく考えなければなりません。画面サイズが大きくなるにつれて、さらに展開して要素を追加できます.

7.コンテンツのフォーマットに注意を払う

コンテンツのフォーマットは、Webデザイナーにとって過小評価されているツールです。コンテンツは、ブログ投稿やセールスコピーの形式であっても、サイトの最も重要な要素です。最後に、それはあなたが訪問者に消費してほしいものです。あなたのデザインの目的は、彼らがするような方法でそれを提示することです.

残念ながら、今では人々が飽和状態になっていて、ページのすべてを読む人はほとんどいません。代わりに、ほとんどの訪問者がスキャンします。さらに、彼らはする傾向があります F字パターンで行う.

つまり、コンテンツを消費習慣に合わせて、よりインパクトのあるものにする必要があります。.

その方法は次のとおりです。

  • 見出しを含める —見出しはコンテンツを分割する優れた方法です。多くの読者は、これらをスキャンのアンカーポイントとして使用し、見出しの下にある興味深い部分を読み取り専用にします。したがって、見出しを使用し、それらを説明的にするようにしてください.
  • 段落とリストを使用する —だれも1つの大きなテキストの塊を読みたくない。段落はコンテンツを小さなチャンクに分割します。新しいポイントを開くたびに新しいものを開きます。リストにも同様の機能があり、情報にアクセスしやすくなっています。それらも使用してください.
  • メディアやビジュアルを無駄にしないでください —視覚情報は、テキストよりも人間の脳にとってはるかに親しみやすいです。そのため、画像やその他のメディアを使用して、コピーで作成されたポイントに下線を引くことをお勧めします。また、長いテキストを分割するのに最適な方法でもあります.
  • フォントを最適化する —フォントの使用も読みやすさに大きく影響します。ここで使用する最も重要なツールは、サイズと行の高さです。をやる 少なくとも16px 使用しているフォントが小さいほど、行の高さを増やしてください.

この記事を調査すると、上記のすべてが有効であることがわかります。.

8. 1ページのデザインを試す

当時、ウェブサイトのデザインはすべてでした 折り目. 重要なものはすべて、ユーザーがスクロールを開始する制限を超える必要がありました。それはまだどこにあるので、それについてまだ言われるべきことがある ユーザーはほとんどの時間を費やしています.

訪問者の閲覧時間-折りたたみ

これは、折りたたみがページのすべてであり、すべてであるという意味ではありません。人々は確かにスクロールします。実際、理由を説明すると、ページ全体が下にスクロールされます。.

クレイジーエッグはこれを試しました 元の販売ページを置き換えた 20倍長いもので.

1ページのデザイン

結果: コンバージョン率が30%上昇しました。現在の購入者の行動が複数のページにわたる場合は、それらをすべて1つの場所に統合することを検討してください。これは、すべての違いを生むウェブサイトのデザインアイデアの1つかもしれません.

スライドショー/カルーセルまたはタブ/アコーディオンにコンテンツを埋め込まないでください、それらは機能しません!

9. A / Bテストを採用する

さまざまなウェブサイトのデザインアイデアを評価するとき、どちらが正しい方法であるかを判断するのが難しい場合があります。あなたは前後に考え、微調整をしますが、あなたの決定に確信が持てません。ある時点で、思考はもはやそれを切りません。ユーザーが決定できるようにする必要があります.

A / Bテストは、ウェブサイトの改善点を確認するのに最適な方法です。これは、デザインの異なるバージョンを訪問者にランダムに提供し、それらの反応を確認することを意味します。結果に基づいて決定を下すことができます.

ほとんど何でもテストできます。ページ全体のデザインから、色の変更、行動を促すフレーズ、画像、記事のタイトル、フォントまで。これらはすべて、ページのパフォーマンスに大きな違いをもたらす可能性があります。しかし、それをテストしないと、決してわかりません。!

これらのツール そして プラグイン テストを行うのに役立ちます.

新しいWebサイトデザインのアイデアを生み出す6つの刺激的なWebサイト

この時点でまだ行き詰まっている場合は、この最後の部分で、ウェブデザインのインスピレーションに満ちた多数のウェブサイトについて説明します.

1. Awwwards.com

ぎこちない

このWebサイトは、世界中のWebデザイナー、開発者、代理店に賞を与えます。彼らはウェブデザイン例の巨大で検索可能なアーカイブを持っています。さらに、 ブログ 彼らがデザインを詳細に紹介する場所とあなたができるセクション 今月の候補者のサイトに投票する. すべてが高品質で本当に刺激的です!

2. WebDesign-Inspiration.com

ウェブサイトのデザインのインスピレーション

完成したウェブデザインプロジェクトのギャラリーです。業種、タイプ、カラーパレット、スタイルなど、さまざまな方法でフィルタリングして、探しているものを見つけることができます。彼らのアーカイブは非常に大きいため、多くの場合、独自のウェブサイトのデザインのアイデアを思い付く必要がある唯一のページです。.

3. SiteInspire.com

siteInspire

このウェブサイトはウェブとインタラクティブデザインの両方を紹介しています。前の例と同様に、スタイル、タイプ、件名、さらにはプラットフォームなど、さまざまな方法でエントリをフィルタリングできます。アカウントを作成すると、お気に入りのデザインのコレクションを設定することもできます.

4. OnePageLove.com

1ページの愛

この例は、1ページのデザイン専用に作成されたWebデザインのインスピレーションサイトです。このアイデアについては、記事の前半で触れました。ギャラリーを閲覧したり、具体的に探しているものを検索したりできます。独自の1ページのサイトを構築するときは、必ずスイングしてください.

5. Dribbble.com

ウェブサイトのデザインのアイデアのインスピレーションのためのドリブル

ドリブルでは、デザイナーが作品を披露します。これはアプリからアイコン、イラスト、その他の例まで何でもかまいません。一般的なインスピレーションとして使用するか、 タグ あなたが最も興味のあるものを見つけるために ウェブデザイン.

6. Behance.net

振る舞う

このウェブサイトはドリブルによく似ています。また、デザイナーがポートフォリオを接続して自慢するための場所でもあります。ウェブデザインの例が豊富にあり、検索機能を使用してそれらを探すことができます。.

まとめ

Webデザインのアイデアは木に育ちません。良いものを思いつくために、少し助けが必要な場合があります。ありがたいことに、あなたが軌道に戻るのを助けるためにこれらのような投稿があります!

うまくいけば、上記の投稿で言及されたWebデザインのヒント、ツール、およびリソースによって、あなたは創造性の世界へと戻ってきました。明らかに、もっと便利なものがたくさんあるので、私たちはあなたから聞きたいのです!

Webデザインのアイデアを生み出すための追加のヒント、ツール、またはインスピレーションを知っていますか?もしそうなら、以下のコメントセクションでそれを共有してください!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map