真奈美(Shikama.net)2012年10月24日更新ツイート閲覧数54,063viewsこのコラムをPDF形式でダウンロードするみんビズには、業種ごとにテンプレートが揃っていますが、運営していくうちに他社と同じデザインで、差別化ができていないもっと自社らしいサイトにしたいなどの不満や要望が出てきていませんか?今回からスタートする新しい章「テンプレートを自分流にカスタマイズ(全10回)」では、一歩進んだ見せ方、使い方をお伝えします。デザインの基本的な考え方」について解説します。Webサイトのデザインを考えるための三大原則Webサイトのデザインを考える上で重要なのは、次の3つです。ターゲットを意識する目線を意識する見やすくわかりやすい設計に以下、詳しく説明します。サイトへ接続する際の環境は?など、できるだけ閲覧者の属性を絞り込んで、明確にしておきましょう。(想定ターゲットを「ペルソナ」と呼ぶこともあります。)ターゲットの絞り込み方このように円を書いて、絞り込んでいきます。デザインに限らず、すべてにおいて戦略を立てやすくなります。目線を意識するウェブサイトの第一印象(ファーストビュー)は、「3秒で決まる」とも言われています。スクロールする前のエリアで、しっかりと閲覧者の心をつかんでおきましょう。一瞬で、何のサイトかわかるのが理想です。閲覧者の視線は「F型」に動いています。Fの部分に、重要な情報を配置します。見やすくわかりやすい設計に「design(デザイン)」という言葉を辞書で引くと「設計」とあります。デザインは、決して「飾りつけること」でも、「アート」でもありません。説明した「目線」を意識しながら、配置を決めましょう。他のサイトを参考にして、方向性を検討しよう想定のターゲットや伝える内容が明確になったら、今度はいろいろなサイトを見て参考にしてみましょう。検索し、いろいろなサイトを見てみましょう。事例紹介サイトから探すみんビズ、bizYouのサイト内に事例が掲載されています。サポート「ユーザー紹介」http://hajimeteweb.jp/user/伝えたい内容やターゲットと合っているウェブサイトを2~3、ピックアップしておきます。メインとなるビジュアルの選び方、使い方レイアウトカラーなどの要素を参考しに、自サイト方向性を考察します。COFFEEhttp://kurumed.jp/トップページの構成図を作ってみよう方向性が固まったら、以下のようにトップページの構成図(ワイヤーフレーム)を作ってみましょう。(もちろん手書きでもOKです)いくつかパターンを作って、検討してみるとよいでしょう。次回、第2回目「背景を変更してみよう」では、実際に背景画像を入れて、雰囲気やテイストの違いを確認してみます。1997年よりWeb制作を始める。ソフトウェア会社のWeb制作部門に5年間勤めた後、2002年4月に独立。システム構築などに従事。講師として、Webマーケティングやデザインのセミナー活動も行っている。今日からはじめるアクセス解析超入門』(技術評論社)。(著)本当は簡単に使えるGoogleアナリティクス!Webサイトを作ったけど、思うように集客できないという悩みを解決するために、訪問者の特性や行動を分析できるGoogleアナリティクスを、初めて使う人にもわかやすくやさしく解説します。初期設定や基本操作から始まり、データの見方や分析、また改善方法まで、これ1冊でわかります。ための経理サポートサイト文具、通信、オフィスのことなら何でもお任せ問い合わせ件数をアップさせるなら!「通話料無料・わかりやすい番号」のフリーコール事務所開設するなら固定電話番号で信頼アップ本コンテンツは、掲載時点の内容となります。「みんなのビジネスオンライン」は「はじめてWEB」にお読み替えいただきますようお願いいたします。Reserved.「はじめてWEB」はKDDIが提供しています。