【デザインを見る】knot | 福島県浜通りで暮らす、普通の人々のWEBメディア
mimi | webデザイン勉強中（https://note.com/webdesign_mi0026）さんの投稿を見て、私もwebデザインを見る勉強をしてみる
本日私が見るサイトはこちら
knot | 福島県浜通りで暮らす、普通の人々のWEBメディア
( https://knot-to-knot.co.jp/ )
これをmimiさんの見ていたものになぞらえて私も見ていこうと思う。
1 最初の印象→どこからその印象を受けたのか
2 いいなと思ったポイント→レイアウト、余白、配色、文字組み(フォントサイズ、行間、文字間)、あしらい
3 レイアウト・余白を分析する→機能面(配置や視線誘導)
4 フォントの分析→サイズ、行間、文字間
5 色味の分析→フォント、全体
6 あしらい→印象を左右したり、視線誘導を行う、ブランドの刷り込み
7 アニメーション→動きの向き、スピード
1
落ち着いたややアーティスティックな印象。
福島という土地を自然が近くて素朴ながら、行ったら穏やかな気持ちにさせてくれそうな雰囲気が伝わってくる。
サイトの目的------住んでいる人には改めて福島の良さを、住んでない人には福島の良さ、落ち着いた心地よさを知ってもらう？
2
・富岡町の色々なところを切り取った風景の写真が多く、富岡町がどんなところか想像しやすい。
・写真が多い分、使う色を少なめにして写真が引き立つようにしている。
・画面をスクロールすると、写真もそのスクロールに合わせて動くので写真や文字などが多くあってもにより写真に興味がひかれやすい？
・あしらいがシンプルでありながらも角が丸く可愛らしい印象を出している
3
・メニューのところの項目の文字の大きさはあまり大きく違わないが、太字にしたり、余白を大きくとることで大きな項目のメニューが一つ一つ目立つようになっている。各項目の文字の大きさの差を大きくしていないことで素朴さが出ている。
4
font-size:4.27vw;
line-height:1.6;
font-family:"YakuHanJP_Noto","Zen Kaku Gothic New","Yu Gothic",YuGothic,"Hiragino Sans","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
YakuHanJP_Noto ---- 鉤括弧などの余白が入っている文字が入っているので、そのような文字で文章の出だしなどがずれないようにされてある？
( https://note.com/m_dot73/n/nc8efc3f488f6?sub_rt=share_pw より )
Zen Kaku Gothic New ---- 少し丸っこく、親しみやすさが出ている
5
・青・白をメインで使うことで海がある印象をつけるようにしている？
・文字・あいらいの色をシンプル、彩度を落とすことで写真が引き立つようにしている。
6
・丸く柔らかい細い線でシンプルながら、可愛らしさが出ている。
・あまりあしらいも華美にしないことで、写真を引き立てたり素朴さ「普通さ」を醸し出している。
・所々映る水彩の絵の具のあしらいも、海の印象もつける役割もあるのか？
7
・ファーストビューで写真を先に表示することで、まちの雰囲気を強く伝えている。
