ブログのデザインをしていくよ！テーマカラーが最大の決めて。
こんばんは！
ブログで初めてこんばんはで挨拶をしました、
現在UXデザイナーとして海外渡航を目指してるりゅーやです。
実は仕事でホームページをリリースする本番作業を
今日突然言い渡され、夜勤を命じられてしまいました。
まあ、夜勤はIT業界の宿命ってやつですけどショック。
ネットが使えればいつでも、どこでも働けますから。
(こんな部分でもしっかりと発揮されてます、、)
さて、前回は”文字はデザインの基盤である”
という記事を書きました。
はてさて、そして今回のテーマはとうとう
”色”です！
目次
デザインのテーマカラーは3つ！
配色にはそれぞれ役割があり、
今回はその3つをご紹介します。
・ベースカラー
webサイトの約70%を占める、基本となる色です。
背景色といった最も広い範囲に使用されます。
このベースカラーですが、仮に蛍光色の黄色などが使用されていたらどうですか？
見づらく、目が疲れてしまいますよね？
白やグレー、
メインカラーの明度を上げた色など読み手が読みやすくなり、
サイトの配色に統一感が生まれる色をチョイスしましょう。
・メインカラー
約25%を占める、サイトのテーマを決める色です。
例えば、やさしいイメージを伝えたい場合は暖色、女性が好むかわいらしいサイトにしたいならピンク
という風に表現したい世界観やターゲットが好むと考えられる色を選びましょう。
・アクセントカラー
約5%程度の割合を占め、サイトの中でメリハリをつけるための色です。
そのため、お問い合わせフォームや
”ユーザーが次に遷移してほしい！”と思う
リンクボタンのカラーによく使用されます。
この3つをまとめてテーマカラーといいます。
テーマカラーを使ってブログページをデザイン！
こちらは宣言になってしまうのですが、
一応UXデザイナーなのに、
はてなブログをこのまま使用していくのはいかがな
ものかと、、
そのため、これからちまちま編集していこうと思います！
どこまで編集できるのかはわかりませんが、
テーマは”シンプル”です。
理由としては、
・UXデザイナー、web系に興味がある方
・海外でいつか働きたいと思っている方
にお役に立てればと思い書いており、
カラフルなものよりも、
シンプル目の方が閲覧しやすく
学習のストレスがかからないかなと思ったからです。
ただでさえ、勉強ってしんどいですもんねw
参考にしようと思っているサイトは以下になります。
こちらのサイト雰囲気を参考にしていこうと思っています。
(特に新井リオさんのブログは本当に憧れw)
まとめ
webデザインで主に使用されている配色構成
わかりましたか？
・ベースカラー
一番大きい色の面積を占めるため
可読性が高い白やグレー、
メインカラーの明度を高くした色を使用
・メインカラー
サイトの雰囲気、テーマを決めるため、
ターゲットが好みそう、商品やロゴに会う
色をチョイス。
・アクセントカラー
メリハリをつける色。
そのため使用頻度は一番少ないです。
ユーザーに遷移してほしいリンクや
お問い合わせフォームボタンに使用しましょう。
この3つだけでなく、
他にも色が増えるケースもあります。
その場合でも、
web配色の黄金比
ベースカラー:70%
テーマカラー:25%
アクセントカラー:5%
の比率は守るよう意識することが大切です。
