スマホの余白｜間延びと窮屈のあいだ

PCで気持ちよく見えていた広い余白は、スマホではただの長いスクロールになります。逆に詰めすぎると窮屈で読みにくくなります。目安を持っておくと迷いません。

幅ごとの余白の目安

数値は絶対ではありませんが、スマホではおおむね6〜7割に詰めるという感覚を持っておくと大きく外しません。

左右の余白は絶対に確保する

スマホでは指が画面端にかかるため、文字が端まで来ていると読みにくいだけでなく操作の邪魔にもなります。最低でも16px、できれば20px前後は確保してください。

余白の値をそろえる

セクションごとに余白がバラバラだと、まとまりのないページに見えます。スマホ用の値も、PCと同じく数種類に絞って使い回してください。

次はスマホでの画像の見せ方です。