今回は、BtoB企業のサイトをデザインする上での、7つのポイントをご紹介します。 このポイントを押さえることで効率的かつスピーディーに制作し、運用時もデザインの崩れを防ぐことができます。更にはリニューアル時のブランドイメージを維持するために役立つ、必ず押さえておきたいポイントをお伝えします。
※この記事は旧ブログ「INBOUND marketing blog」から移行したものです。
【目次】
- デザインコンセプトが明確になっているか
- キービジュアル（メインのイメージ画像）で事業内容を分かりやすく伝えているか
- 情報の優先順位を考慮したレイアウトになっているか
- 配色の計画をしっかりたてているか
- 文字が読みやすくなっているか
- 実際の操作性を考慮しているか
- 分かりやすい説明図、グラフになっているか
1. デザインコンセプトが明確になっているか
デザインを考える上でまず大事なのは、デザインコンセプトです。デザインコンセプトが明らかでないサイトは魅力が半減します。
- ヒアリングからデザインの課題を明確する
- デザインの方向性を決める
- コンセプトを短い言葉で簡単に説明する
ヒアリングで明確になった課題を解決するために、最終的に分かりやすく伝えやすいデザインコンセプトを決めましょう。
2. キービジュアル（メインのイメージ画像）で事業内容を分かりやすく伝えているか
次に、サイトの印象を決定づける顔ともいうべき存在がキービジュアルです。ユーザーが見て、すぐに事業内容を理解できるキービジュアルを目指しましょう。
- 事業内容が分かりやすい
- キャッチコピーが分かりやすい
- 覚えやすく他人に伝えやすい
- インパクトがある
- 視認性を確保する
- ブランドイメージに表現を合わせる
サービスや製品が多いと伝えたいことが多くなってしまいますが、出来る限り絞って、的確な言葉と画像で分かりやすく表現することがキービジュアルの条件です。
3. 情報の優先順位を考慮したレイアウトになっているか
ユーザーが重要な情報を簡単に得られるかどうかがサイトの印象を左右します。情報の優先順位を細部の設計まで落とし込んだレイアウトが成功の鍵です。
- サイトの幅を環境に最適化する
- ファースビューで表示したい範囲を決める
- 情報の優先順位を決める
- マージンの設定をきめる
- 問い合わせ用のボタンが分かりやすい位置にある
情報に優先順位をつけて配置することで、ユーザーが得たい情報を簡単に得られる様なレイアウトにしましょう。
4. 配色の計画をしっかりたてているか
配色はデザインを考える上で最重要ポイントの一つです。デザインコンセプトやレイアウトと調和した、一貫性のある配色を考える必要があります。
- コンセプトと配色を合わせる
- 配色のルールを決める
- 色数を決める
- コントラストを適正にする
- ガイドラインにまとめる
色数をおさえ、情報の重要度に差をつけ、ユーザーが色に惑わされない配色にしましょう。
5. 文字が読みやすくなっているか
フォントの種類やサイズ、またそれらの統一感といった文字の読みやすさに関するデザインも大切です。
- 使用するフォントの種類を決める（日本語フォントと英語フォント）
- H1からH5くらいまで必要な見出しのデザインを決めているか
- フォントサイズのルールを決める
- 文字詰めをする
- 校正する（印刷して確認）
フォントの種類や、サイズなどをサイト内での使い方を統一。見出しのジャンプ率を高くすることで、読みやすさが格段に向上します。
※ ジャンプ率・・・本文のサイズに対するタイトルや見出しサイズの比率のことです。
6. 実際の操作性を考慮しているか
これまでに挙げてきた要素を総合して、実際に操作するユーザーの目線に立って分かりやすさ・使いやすさを検証しましょう。
- リンクである事が分かりやすくする
- クリックしやすいサイズにする
- 役割が分かりやすいデザインにする
リンクかどうかを判別しやすく、また機能性を分かりやすく表現するためには、アイコンや色のルールの設定が大切です。
7. 分かりやすい説明図、グラフになっているか
サイトの中で使用する図やグラフは、見落としがちですがサイトの印象を決める要素になります。細かくチェックしておきましょう。
- 画像サイズを決める
- 図やグラフの中の配色のルールを決める
- 図やグラフの中の文字に関するルールを決める
- 図中の線の太さのルールを決める
- 図中の矢印などの記号、番号の振り方を統一する
サイトの中に出てくる写真や図、グラフなどに関しても一貫性のあるデザインルールにすることで、統一感のあるデザインになり、完成度が高くなります。
＜執筆者：久保田 善博＞
ガイアックスではお問い合わせ中心の効率的な営業を実現するBtoBに特化したWeb制作・運用支援をご提供しています。見込み顧客を獲得するWebサイト制作・リニューアルについてお気軽にお問い合わせください。