雅之Webサイトのデザインを習得するにはどうすればいいのでしょうか?描画力や美的センスがないとデザインができないと思っている方も多いと思います。良いデザインを作ることができる*+という点です。+*20%のキーポイントをマスターしたら、80%の結果を出すことができる、*+ということがテーマです結果を出す為には、すべてのスキルや知識を身につける必要はありません。20%のスキルや知識でも、立派なサイトやサービスを作ることができると思います。デザインの原理原則をまとめましたので参照してください。デザインの原則をマスターしようWebデザインもデザインの一つであり、デザインの原理原則が適用されます。Webデザインを行う際に最も重要である5つの原則を紹介します。グルーピング(近接の原則)まずはグルーピングです。関係の薄いものは離して配置する*+このように似たような情報を近づけることを近接の原則と言います。近接の原則の適用が必要なのでしょうか?下の例を見てください。左はどの写真がどの文字と関連しているかが解りにくいですよね。一方で右は写真と文字が近接していてわかりやすいですねWebサイトは”わかりやすさ”が命です。サイトの訪問者は訪問したページが少しでも判りにくかったら直ぐに離脱してしまいます。グルーピングをしていないとコンテンツがわかりにくくなりページの離脱率は高まってしまいます。揃える(整列の原則)ページ要素は揃えて配置する必要があります。これを整列の原則と言います。下のレイアウトのイメージを見てください。何か統一感がない印象を受けますね。箱の大きさや、間のスペースが統一されておりすっきりとした印象を受けますね。整然としたレイアウトに情報を入れると情報が組織化されてサイトが分かりやすくなります。結果として、サイトの離脱率が下がるでしょう。WEBユーザビリティ研究者ニールセン博士の研究によると、サイト内の文章は、平均で全文章量の28%しか読まれていない。人はボディコンテンツの文章を一字一句読むのではなく全体を流し読みしようとする。視線の先が混乱せずに流し読みをすることができまね。結果として、離脱率が下がります。情報の濃淡をつけて、コンテンツを読みやすくすることです。*+下のイメージを見てください。何か単調な感じで、読みにくいですよね。一方で下のコンテンツは色分けとヘッダーサイズを大きくしていて読みやすくなっています。コントラストをつけると強調する部分とそうでない部分をわけることができ、+*サイトの可読性が高まります。*+結果として離脱率が下がります。(反復の原則)情報が整理されていないとサイトの可読性(読みやすさ)が下がるということを上で述べました。情報がまとまっている感じがしません。3つ、4つ、5つと繰り返して行くとルールがはっきりしてきます。デザインの中の視覚的な特徴のある何かを繰り返すことで、ページ全体が整理され、”まとまり感”がでてきます。同じレベルの要素が並んでおり、まとまり感がありますね。以上のデザインの原則をふまえた上で、Webデザイン独特のレイアウトの原則に関して紹介したいと思います。黄金比を活用しよう整然として読みやすいウェブデザインは黄金比を活用していると言われています。黄金比とは自然界でもっとも安定した美しい比率と言われているものです。ピラミッドやパルテノンなどが黄金比を活用しています。その比率は1:1.618、整数に直すと5:8とされています。上のイメージはTwitterのレイアウトです。画像を見てわかる通り、意識するとはっきりと1:1.618が使われていることがわかる設計です。設計しましょう*+いかがでしたでしょうか。必要最低限な20%のスキル・知識を網羅しました。この20%の知識を実際に自分のスキルにするには実践をやるしかありません。スキルハブの実践講座を受講してWebデザインをマスターしよう!我々が提供する教育サービススキルハブでも、これらの必須スキル20%にフォーカスを置いた実践的なレッスンを提供しています。最短距離でWebスキルを身につけたい人は是非受講してみてください。Railsなどがなんと無料。募集人数には制限があります。サインアップはお早めに。100名(残りわずか)今すぐ14講座を受講する(無料)夢をかなえよう!プロのスキルを身につけて夢をかなえましょう。support@skillhub.jp■お問い合わせ■スキルハブの受託開発サービス※開発のご依頼はここからお願いします。