Webサイト、アプリ、資料などの品質を上げたいと思っているかたに向けた、余白(スペーシング)の基礎についての資料です。
関連記事:8の倍数ルールでデザインする理由とメリット・デメリット
https://yuyakinoshita.com/blog/2019/02/10/design-by-multiple-of-8/
以下、2020年8月24日に追記しました。
この資料を見ていただいた方、コメントをくださった方、ありがとうございます。「目がチカチカする」、「なぜ正方形の余白だと整った印象になるのか?」などのアドバイスや質問をいただけました。いただいたアドバイスを元に以下の点をアップデートしました。
- 資料全体のコントラストを下げました。以前より目の負担が軽減されるように背景色を調整しました。
- 余白の大きさ指定に正方形を使う理由を追記しました。余白の大きさを指定する際に正方形の余白を使うことでタテとヨコの余白が統一されますが、そもそもなぜタテとヨコの余白を統一すると良いのかの深堀りはしていませんでした。今回いただいた質問を元に仮説を立てて、その内容を資料に追記しました。
あらためて気付きの機会をいただけたことに感謝しております。
Website: https://yuyakinoshita.com
Twitter: https://twitter.com/yuyaink