menu

【デザインのツボ】フォントサイズに下限あり

2019年3月14日

コーダーの輿水です。
【デザインのツボ】第7回!
今回は基本中の基本な要素、フォントサイズについてお送りします。

■今回のテーマ

皆さんはフォントサイズをどのように決めているでしょうか?
個人的にはPCで14px、スマートフォンでは12px程度を基準に作成したデザインが多いように感じています。もちろん見出しなどには大きな文字を使いますし、コピーライトなどには小さな文字を使いますよね。
しかし、スマートフォンでは基準が12pxだから、注釈が10px、じゃあコピーライトは8pxぐらいで・・・なんてフォントサイズがどんどん小さくなっていくと、“ブラウザの最低フォントサイズに引っかかってしまう”ことがあるんです!

■どういうこと?

実はブラウザによってはフォントサイズに最低値を設けている場合があるんです!
文字が小さすぎると読みにくくなってしまいますし、潰れた文字を表示しても閲覧者にとっては意味がありません。そこで、各ブラウザはフォントサイズに最低値を設定し「これなら読めるだろう」という文字の大きさを担保しているわけです。
例えばGoogle Chromeでは最低値は10px。フォントサイズをそれ以下に設定しても、10pxより小さく表示させることはできないんです。

■何が困るの?

繰り返しになりますが、フォントサイズが最低値より小さいと、例え設定していても最低値の大きさでしか表示されません。
当然デザインとは異なり、場合によっては表示崩れの原因になることも・・・。
特にスマートフォン用のデザインでは、限られた表示領域に綺麗に詰め込もうとして小さいフォントサイズが使われていることがあります。しかし閲覧者にしっかり情報を伝えるためにも、あまり小さい文字は使わず、最低値以上のフォントサイズを使ってデザインしてくださいね!

CPTIMES

   

投稿一覧

初めてのお客様はこちらからどうぞ

お見積りはこちらから

資料請求はこちらから

wordpress実装 初期費用0円 ワードプレス構築

下層ページデザインサービス

Coding Pack News Letter

コーディングパックのメールマガジン

お得な情報満載!

バックナンバーはこちら

最新納品実績

  • コーディング

    2P

    2018.05.07

    服飾メーカー

  • コーディング

    1P

    2018.05.01

    不動産

  • コーディング

    1P

    2018.04.30

    専門学校

  • コーディング

    5P

    2018.04.27

    インテリアメーカー

  • コーディング

    1P

    2018.04.27

    美容メーカー

more

pagetop