縦書きをデザインする

Posted by dab | 2011年8月1日 月曜日 6:00:55 < コンピュータ >

さすがにウインドウの高さいっぱいに縦書きすると読みづらいと思う。
A4を縦にして、縦書きするようなものだろうし。

文庫本なら40〜45字で改行、20行前後で1ページとなってる模様。
height: 45emくらいで、左右スクロールってことにすればいいんだろうか。

横書き、フォントサイズ14〜16pxで、幅800px程度の文書の場合、どうやら40〜50字で改行されるらしい。
やっぱり40字前後というに、何か読みやすい物があるのかな。

自炊した本をiPhoneで読んでみると、iPhoneを縦にしたときはページ全体が表示されるけど、もじがちょっと小さい。
横にして2ページの見開きでは、文字が小さすぎるか。。。
挿絵なんかはいいかも。

縦にして20字ほど表示できるようにすると、文字の大きさが5mm程度っぽいし、
横にした場合でも3.5mmくらいかな。

ならば。

PC用は1行の文字数を基準にしてheight: 45em、
iPhone用は文字の大きさを基準にして、height: 20em、これがiPhoneの画面にあわせられるように、<meta name=”viewport” content=”height: device-height”>を指定。
でどうかなあ。。。

しかし、iOS Safariは縦書きに対応していないのであった orz

Androidは持ってないもーん。(´・ω・`)

しかしまあ、(日本語の)縦書きにした場合のスクロールって、右から左にスクロールが基本なわけで。
にもかかわらず、ページを開いたときに左上が表示された状態で止まるのはちょっとなあ。
やっぱり文書の最初、右上が表示されるようになってほしいけど、そこまでブラウザに期待するのは無茶なんだろうか。

TrackBack URI : https://home.wi-wi.jp/blog/wp-trackback.php?p=539

Leave a comment

:mrgreen: :neutral: :twisted: :shock: :smile: :???: :cool: :evil: :grin: :oops: :razz: :roll: :wink: :cry: :eek: :lol: :mad: :sad: