今年1月にiPhone3GSを購入し、iPhoneを使ってテキストを読む機会が増えてきました。
スマートフォン向けのサイトを作る機会もありますが、その際に気をつける必要があるのが、スクリーン上の文字のサイズです。
今回は、iPhoneでテキストを読む際の最適なサイズについて考えたいと思います。
iPhoneの仕様
3GSだと解像度は480px320pxとなり、解像度は163ppiとなります。
iPhone4の場合は960px640pxで、解像度は326ppiです。
画面サイズは変わらず『3.5インチ』ですので、最終的に表示される文字サイズは、3.5インチのディスプレイに何文字入れるかで決まります。
Wikipediaの仕様と文字サイズ
今回は、iPhone上で文章を読むことに耐えられるサイズを算出するに当たり、WikipediaのiPhone向けに最適化されたページが読みやすかったので参考にしました。
Wikipedia for iPhoneは、1行あたり全角で23文字入るような設計になっていました。
また、その際の左右の余白は8〜9pxで構成されていました。
よって、16px+23文字=320px(163ppi)ということになります。
横幅320px - 余白16px = 文字ボックスの幅304px、
文字ボックスの幅304px ÷ 文字数23文字 ≒ 1文字あたりの幅13.2px、
1文字あたりの幅13.2px ≒ 8.2Q
ということで、文字の級数は8.2Q程度であることがわかりました。
実際の紙上だと、キャプションなどに使うほどのごく小さいサイズであることがわかります。
ごく小さい8.2Qというサイズでも、Wikipediaの中程度の長さの文章を読むことができるのは、、iPhoneはバックライトがあり、コントラストが紙上よりはっきりするため、小さい文字でも可読性が高く保持できるのではないかなと考えられます。
結論
個人的にはiPhoneに最適化されたWikipediaの文字は小さく感じており、できればもう少し大きい方が読みやすいと思っています。
1文字当たり15px、約9.3Q程度の大きさで構成し、1行の文字数は20文字程度になるように作るのが良いのではないか、という結論に至りました。
0 件のコメント:
コメントを投稿