ホーム > コラム > WEB担当者が最低限知っておきたい5つのデザイン基礎テクニック

コラム

WEB担当者が最低限知っておきたい5つのデザイン基礎テクニック

WEB担当者が最低限知っておきたい5つのデザイン基礎テクニック

企業のWeb担当者に指名されたら、サイト運営のノウハウやWebの最新技術など、抑えておきたい知識がたくさんあるため、外注するにせよ内製するにせよ、デザイン関連の知識はデザイナー任せになっている方が多いと思います。もちろん、「餅は餅屋」ですから、本格的な知識を持つ必要はありません。しかし、最低限のデザイン知識を持っていないと、「こうしたほうがいい」などの感覚で判断し、デザイナーへの指示が曖昧なものになってしまいかねません。
そこで今回は、Web担当者が知っておきたいデザインの基礎テクニックをご紹介します。

同じ内容をまとめる「近接」
関係性のあるものを「まとめ」て、関係性のないものを「離せ」ば、各グループに意味があることを見る人に伝えられます。
例えば、名刺を思い出してください。名刺は「会社名」や「ロゴ」などの会社に関係するグループ、「所属」や「肩書き」「名前」などの本人に関係するグループ、「住所」「電話」「FAX」「メールアドレス」など、連絡先に関係するグループにまとまり、各グループは離れて配置されていると思います。もちろん、中にはこのルールが守られていない名刺もありますが、単純にデザインの基本を知らない素人がソフトウエアを使い、自分でデザインしただけかもしれません。
位置をそろえる「整列」
近接を使ってまとめたところで、位置がバラバラではデザインとはいえません。そこで、各テキストを「左揃え」「中央揃え」「右揃え」「左右均等割り」などにまとめる「整列」というテクニックを使います。
これは、見た目がきれいになる効果もありますが、より各グループが別々であることを意識させてくれます。
先ほどの名刺の例でいえば、「会社に関係するグループ」を「左揃え」に、「本人に関係するグループ」を「中央揃え」に、連絡先に関係するグループを「右揃え」にするといったものです。そして配置も、「左上」「中央」「右下」のように整列されているものが多いでしょう。
同じルールを繰り返す「反復」
次は「反復」というテクニックです。
これは、テキストや画像などを等間隔で並べることにより、リズムが生まれ視覚的に整った印象になるというものです。近接や整列を、より意識させることができます。
優劣を決める「対比」
これまでの3つの手法を使えば、どういう分け方をしているのかはわかります。ですが、何が重要なのかは、わかりにくいものになってしまう可能性があります。そこで、「何が重要なのか」を見る人に理解してもらうために、「対比」を使います。これは、サイズ変えることで、項目のプライオリティを認識させることができるテクニックです。
名刺の例でいえば、主役である名前を1番大きくするのが一般的です。電話、FAX、メールアドレスといった連絡先のうちメールアドレスを1番大きくデザインすれば、見る人によっては「連絡はメールでしてほしいのかも?」と感じてくれるでしょう。このような意味を持たせることが、デザインの基本であり意味なのです。
ユーザーを意識した「可読性」
これまで紹介したテクニックを見てもらえればわかるように、デザインの基本は「見た目のきれいさ」ではなく「ユーザーにきちん情報を伝える」ことです。
デザイナーから「空白スペースの多いデザイン」が上がってきても、上記の法則に照らし合わせて考えれば、意味があるデザインかどうか判断することができます。制作をお願いするデザイナーに一目置かれるためにも、最低限この5つのテクニックは理解しておきましょう。
デザインが求めるものとは?
これまで紹介したテクニックを見てもらえればわかるように、デザインの基本は「見た目のきれいさ」ではなく「ユーザーにきちん情報を伝える」ことです。
デザイナーから「空白スペースの多いデザイン」が上がってきても、上記の法則に照らし合わせて考えれば、意味があるデザインかどうか判断することができます。制作をお願いするデザイナーに一目置かれるためにも、最低限この5つのテクニックは理解しておきましょう。

→ コラム一覧に戻る

  • ホームページ、SEOについてコンサルタントに相談する 03-5210-2565
  • 東京・大阪・名古屋エリアへご訪問します
  • SEOに強いホームページ作成
  • 女性向けホームページ制作
  • SEO対策
  • 制作実績
  • ウェブステージについて Web戦略の専門家が多数在籍。最高の制作チームでサポートします。
ベストベンチャー100
業種別プラン

多彩な業種別プランを
ご用意しています

他にも様々な業種に対応しています

建築業系/不動産業/製造業/士業・コンサルティング/医療法人・福祉/美容・ファッション業/情報通信業/BtoC小売業/運輸業/フード産業/サービス業/リクルート系/教育/金融保険業/鉱業/農林水産業/財団、団体/その他