現在、インターネットはすでに経済発展の中核産業の一つになっており、企業情報を宣伝する手段としてウェブサイトを構築することを選択する企業が増えています。世界中の何十億人ものユーザーがインターネットで情報を検索するという背景で、企業のウェブサイトを構築するのはいい選択かもしれません。ウェブサイトでより多くの顧客を引きつけようとすれば、Layout design(レイアウトデザイン)を工夫する必要があります。そこで、今日はいくつかのLayout design(レイアウトデザイン)の事例を紹介いたします。

Layout designに迷わない!4つの事例分析

記事の目次:

1.グーテンベルク・ルール(Gutenberg Rule)

2.Zの法則

3.Fの法則

4.3カラムのLayout design(レイアウトデザイン)

ウェブデザインをする時、どこから始めればいいのかわからない方が多くいるかもしれません。一般的には、優れたウェブデザインにはいくつかの似たようなLayout design(レイアウトデザイン)があるから、これらを通して、ほんの僅かの調整で倍の効果を得ることができます。

1.グーテンベルク・ルール(Gutenberg Rule)

グーテンベルク・ルールとは、多くの人が情報を閲覧する時、左から右、または上から下に向かって情報を見ることを好むことです。 ウェブデザインをする時、こういう法則はLayout design(レイアウトデザイン)のいい参考になるかもしれません。ウェブサイトの基本的な情報の一部を左から右へとデザインして並べることができます。記事の内容を並べる際には、4つのエリアに注意する必要があります:

Primary optical area:このエリアはウェブページの左上にあり、訪問者にとってのメインのナビゲーションエリアです。ここには、会社のロゴやスローガンなどのより重要な情報を配置することができます。

Strong follow area:このエリアはウェブページの右上にあり、副次的なものとして訪問者に読まれるのです。多くの訪問者にとって、これは前のエリアを閲覧した後表示されるエリアであるから、ここにいくつかの画像を追加することができます。

Weak visual area:このエリアはウェブページの左下にあり、読者に無視されやすいので、Layout design(レイアウトデザイン)をする時、あまり重要ではないコンテンツを配置するだけでよいのです。

Terminal area:このエリアはウェブページの右下にあり、ウェブページ全体を閲覧した訪問者が情報を目にする主な場所です。ここにお問い合わせフォームを設置し、もし訪問者があなたのページに興味を持てば、すぐに連絡できるようにすることはおすすめです。

グーテンベルク・ルール

Strikinglyのユーザーのサイトから受けた画像

ここでは、Strikinglyのウェブサイトテンプレートを使うことをお勧めします。Strikinglyの無料ウェブサイトビルダーが提供するテンプレートは、グーテンベルク・ルールに従っており、ウェブサイトを完成させるためにプログラムを組む必要もありません。もちろん、プラットフォームの編集機能を使って、いつでもテンプレートを編集してお好みのデザインにすることができます。

2.Zの法則

この法則の基本的なコンセプトもグーテンベルク・ルールと同様に、左から右に向かっていますが、異なったのは、Zの法則では、訪問者はZの形でウェブページを閲覧すると考えていることです。もしZの法則を活用しLayout design(レイアウトデザイン)をすれば、ウェブページの左上にロゴやその他の重要な情報を配置し、右上にショッピングカートやログインボタン、その他のアウトバウンドリンクを追加してください。ページの真ん中にコアイメージのレイアウトやビデオ情報を追加し、最後にはページの左下にはヘルプ情報を、右下には連絡先のリンクを追加する必要があります。

 Zの法則

Strikinglyのユーザーのサイトから受けた画像

例えば、上にあるこのウェブページでは、Zの法則に従うLayout design(レイアウトデザイン)が採用されています。そのデザインスタイルは、訪問者がウェブページがもっとも伝えたい情報を素早くキャッチできるようになっています。このことから、Zの法則はウェブページのLayout design(レイアウトデザイン)にも適していることがわかるでしょう。

3.Fの法則

この法則は、2006年に著名なウェブデザイナーであるNelson氏によって提案されたものです。そのコンセプトは、訪問者が初めてウェブページを訪問するとき、Fの形で情報を閲覧することです。したがって、Layout design(レイアウトデザイン)をする時、この法則を活用してウェブページの情報を埋めることができます。Fの法則は、ブログサイトやポートフォリオサイト、製品のインターフェイスなど、テキストを多用するページに使用されることが多いです。

Fの法則

Strikinglyのユーザーのサイトから受けた画像

上にあるこのページはFの法則に沿って作られたものです。これによって、閲覧者が欲しい情報を閲覧しやすくなり、ブログのコンバージョン率も向上させます。

4.3カラムのLayout design(レイアウトデザイン)

このLayout design(レイアウトデザイン)は常に有名なECサイトに使われています。その特徴は効果的に商品を顧客に展示できることです。3カラムのLayout design(レイアウトデザイン)により、閲覧者が製品の画像や価格情報をメインページで見ることができるため、製品の詳細を知るためにクリックする可能性が高くなります。 一般的に、3カラムのLayout design(レイアウトデザイン)は3つの部分で構成されています:

タイトル: 通常はウェブページの一番上にあります。インデックスボタンや会社のロゴを設定することで、顧客に会社の情報を知らせたり、インデックスで欲しい商品を見つけさせたりすることができます。

サイドバー:通常はページの左側にあります。顧客はサイドバーで欲しい商品を絞り込めることができます。このことによって、商品がより多くの商品を閲覧でき、マーケティングを促進することもできます。

メインインタフェース:通常はタイトルの下、あるいはサイドバーの右にあります。商品紹介の筋として、メインインタフェースには画像や詳細があり、それによって顧客をひきつけるのです。

3カラム

Strikinglyのユーザーのサイトから受けた画像

Layout design(レイアウトデザイン)についての紹介は以上でした。いかがでしたか?マーケティングに成功には、ブランドデザインプロモーションも非常に重要です。詳しく知りたい方はStrikinglyの公式ブログを見たらいかがでしょうか。

null

Strikinglyの商品から受けた画像

ここをクリックして、今すぐStrikinglyでウェブサイトを構築しましょう!

ご質問などございましたら、support@strikingly.comの方までお問い合わせください。