会社のマニュアルをもう少し見やすく更新したいので、
デザイン的な観点からも少し勉強。
今後WEBデザインも勉強したいと思っているので先取り？勉強
ちなみにこのブログは個人的なアウトプット用で、まとめやすさと自分の見やすさを優先なのでレイアウトなどはあまり気にしてない。
結局資料なども自分でまとめたのが一番自分で見やすいと思うのよね~とは言いつつ
マニュアルは必要なので作りますよ～
■見やすいレイアウトの法則
①視線誘導
・Zの法則
紙面をZの文字のように見ていく法則
左上→右上→左下→右下とZの形に視線が移動するようにレイアウトをすると、
人の視線の流れと同じになり見やすいと感じる
例）店頭ディスプレイ
・Fの法則
画面をFの文字のように見ていく法則
例）WEBサイトなど
② 揃える
端が揃っているだけでも情報が整理されているように感じる
③ 関連情報をまとめる
④ 余白を有効利用する
⑤フォントの系統を決める
【明朝体】【ゴシック体】【丸ゴシック体】など
⑤フォントのウェイト
見出しの階層にあわせて、ウェイトを変化させると
情報の構造を視覚的に理解しやすい
⑥文字間と行間を決める
狭すぎたり、広すぎたりすると読みにくくなってしまう
一般的に組版的な紙面での行間は文字の高さの50％～80％くらいが
読みやすいと言われている
⑦内容をグループとして見せる
必要事項を羅列するのでは無く
・何に対する説明なのか
・その内容はどこまでなのか
一目でわかるようにする
⑧レイアウトについて
レイアウトにおける鉄則は整理整頓。
文字、イラストの配置に関して、ルールを設ける
例）紙面に対して「左に文章、右にイラストを配置」これだけの事でもよい
「まとまり」として認識できることが理想。
・ページ内で必要項目が離れている。
・文字とイラストの配置が統一されていない。
これだけの事でもエンドユーザーにとっては、読みづらい
⑨やすいレイアウトのカラー
カラーバランス比率
70（ベースカラー）：25（メインカラー）：5（アクセントカラー）
6：3：1 とも言われたりする
カラーの選定の順番
・最初にメインカラー・・・一番目に付きやすい所に使う色
・次にベースカラー・・・ベースカラーは全体の70％、基本的に淡い色
（白や薄いブルーなど）
・最後にアクセントカラー・・・目立たせたい所や注目させたい所
メインカラーと真逆の色を使う事でバランスの良いカラーになる
例）クリスマスツリ－
緑がメインで赤が少しだが、一般的なイメージからは赤と緑で認識