中小企業のビジネスサイトに効果を与える5つのデザイントレンド

Post on:2010年8月12日

はじめに

中小企業のウェブサイトでは、ユーザーの注意を取り込みブラウジングをうながし、あなたのプロダクトあるいはサービスにおける利害関係を起こして、販売へと結びつける必要があります。

限られた時間と予算の中で、少しでも多くの可能性のあるユーザーに興味をもってもらうにはデザインは必須な要素です。
ここに中小企業のウェブサイトに大きな効果を与える5つのデザイントレンドがあります。

1. ミニマリスト

ミニマリストのデザインは、ユーザーがコンテンツを直接的に集中するのに非常に効果的なデザインです。もしページ内に多くのエレメント持っているなら、そのエレメント達が注目を得ようと競っている状態になり、ユーザーはどこに焦点を合わせるべきが戸惑うでしょう。

先日、Googleの検索エンジンでページの重さがランクに影響を与えることになりました。まさに今が、あなたのウェブデザインをスリム化するタイミングです。
ミニマリストのデザインをする上で従うべきいくつかの法則があります。

あなたのサイトを見直してみてください。そして、目的を果たしていない不要なエレメントを削除してください。
デザインの異なるエレメントの間にホワイトスペースを配置してください。ホワイトスペースを効果的に配置すると、サイトのスキャナビリティが高まります。
正しいカラーパレット、アクセントカラーを選択することは重要です。カラーが大きな重要性と意味を持つように、使用するカラーがどのように相互に影響するかテストすることは非常に良いことです。
あまりに多くのインフォメーション、紛らわしかったり不快なエレメント、中途半端な「呼びかけボタン」などがあるかをユーザーの目線になって、あなたのサイトをチェックしてください。

ミニマリストのデザインはさっぱりしてたり、つまらない感じにする必要はありません。デザインのディテールをつくりこむことで、モダンで、フレッシュで、優雅であり、洗練されたものになります。

2. 独自の写真

Brooklyn Fare

「二人の男性が握手をしている写真」「笑っているスーツを着た人々の写真」「コールセンターの女性の写真」これらは何千というビジネスサイトに使用されている陳腐な画像です。これらの画像は会社に対するインフォメーションやサイトのキャラクターを伝え損ね、本質的には無意味なものです。

使用する写真は可能であれば、オリジナルの写真を発注して使用することを勧めます。しかし、中小企業のオーナーは時間と予算が限られていることもあります。その場合は比較的安価な有料の写真素材サイトを利用することを勧めます。
有料の写真素材サイトを利用する際は下記を念頭においてください。

あなたの会社の競合サイトを研究して、使用している画像をメモしてください。それにより、あなたのプロダクトやサービスを表現するユニークな方法を見つけ出すことができます。
抽象的な構図のものはしばしばドラマティックで忘れがたい印象を与えますが、そういった画像は文字通り避けてください。
ピクセルが荒いとデザインの質を落とすので、低い解像度の画像を選ばないでください。
当たり障りのない画像やありきたりな画像からは離れてください。殻を破ってください。

想像力が豊かな画像はブランドメッセージを強化し、あなたのウェブサイトにより大きな特長を加えるでしょう。
有料の写真素材サイトを使用する際は注意を払い、あなたのプロダクトあるいはサービスの本質を伝えるものを時間かけてみつけてください。

3. 大胆なタイポグラフィ

Radio - The New York Moon

ウェブデザインの核となるコミュニケーションにおいて、タイポグラフィは重要なコンポーネントです。素晴らしいタイポグラフィはインフォメーションを的確に伝え、ユーザーを引き込むでしょう。

最近のトレンドではユーザーの注意力をつかむために、他のテキストとの間にコントラストを作る大胆なタイポグラフィが使用されています。特大のテキストは階層をつくることに役立ち、ユーザーにメッセージを明確に伝えることができるでしょう。
大胆なタイポグラフィを使用する際は下記を念頭においてください。

あまりに多くのメッセージはユーザーが迷うため、最も重要である一つのメッセージを決定してください。メッセージの本質を理解し、その本質を伝えるフォントを探してください。
あなたのビジネスの特長にあったフォントを選択してください。明朝体やゴシック体、古風なフォントなどです。
タイポグラフィの配置は、ホワイトスペースを気前よく使用し、目立つポジションに配置してください。これは強調に加え、より注目を与えることになるでしょう。
JavaScriptによる埋め込みフォントを試してみてください。これはあなたのサイトで美しいフォントを利用できるものです。

慎重にフォントを選択し、タイポグラフィを使用することはあなたのデザインの品質に大いなる相違を生むことになるでしょう。

4. アクションの呼びかけボタン

Squarespace

中小企業のオーナーとしてあなたはサイトに訪れたユーザーが、あるタスクを完了することを望むでしょう。それはダウンロードや資料請求で、これらのユーザーのアクションを呼びかけるボタンはウェブサイトで最も重要な（そして見落とされる）エレメントの一つです。

あなたはユーザーの注意をつかむことを望み、ユーザーがアクションを起こすように駆り立てているでしょう。明確で簡明なアクションの呼びかけボタンを作り上げることは不可欠です。
アクションの呼びかけボタン、あるいは広告を設計する際に念頭におくべきことがあります。

文言

言葉遣いは短くし、動詞から始めるようにします（※英語の場合）。そして、ユーザーがとるアクションのあとに、その価値について説明してください。「無料」「今だけ」などといった言葉は誘因になります。
配置

呼びかけボタンはサイトのすべてのページに対して一貫したポジションに配置するべきです。例えば、すべてのページの最上部に大きいボタンを配置し、すべてのページの最下部にすこし小さいボタンを配置します。
カラー

カラーはデザインのほかの箇所より際立たせるべきです。
小さいボタンは、より明るくし、よりコントラストをつけたものにします。大きいボタンは他のエレメントとバランスをとり、あまり目立たないカラー（背景よりは目立たせる）がよいでしょう。
サイズ

呼びかけボタンはページ上のいかなるボタンと比較しても、最も大きいサイズにするべきです。ページ内の他のエレメントを圧倒しない程度に際立たせるのがよいです。

アクションの呼びかけボタンは異なるものでA/B テストし、それがどのような影響を与えるか確かめることは重要なことです。それが全体的なデザインの中で適切であったことを確認することは最も大切です。

5. A/B テスト

Verify

サイトのパフォーマンスを測定し、そして改善することは非常に重要です。あなたのウェブデザインを最適化する最も重要な方法の一つがA/B テストです。

A/B テストではランディングページの有効性を調べることができます。二つの異なるバージョンを用意し、どちらが良い結果を生むかランダムにユーザーに表示します。あなたはそれぞれのパフォーマンスを評価し、そして最も良いバージョンを使用します。テストするものは、レイアウト、コピー、グラフィック、フォント、ヘッドライン、アイコン、カラーなどさまざまな要素があります。
A/B テストを行うためにいくつかの助言があります。

テストを始める前に、ゴールを設定してください。例えばゴールがサインアップであれば、フォームの項目、フォームの長さ、プライバシーポリシーの見せ方などでテストを行います。
目的を達成するために必要最小限のことのために、最も大きい影響を与えるエレメントからテストを始めてください。
独立したA/B テストは行わないでください。その代わりに、ユーザーの行動の詳細な解析を得るために、フィードバックなどを利用してください。

A/B テストは悪いデザインを素晴らしくするものではありません。ウェブサイトの有用性を最適化し、効果的な手助けをするものです。