いんたーねっと日記

141文字以上のものを書くところ

文章を読みやすくレイアウトするにはパソコンの画面は横に長すぎる

editor.hatenastaff.com

個人としては、Webに文章を公開するとき、「改行」はせず、あくまで「改段」する派です。しかし「改行(形式改行)」したい気持ちになる人が多いのには、パソコンの画面の横幅が広すぎるせいあるのかな、と思っています。

文章を読みやすくレイアウトしようとすると、どうしても一行あたりの文字数は短めにしたほうが読みやすくなります。一行あたりの文字数が多いと、視線を何度も左右に行ったり来たりさせなければいけなくて、読んでいて気が散るし疲れてしまいます。

f:id:ymrl:20170119013642p:plain

f:id:ymrl:20170119013724p:plain

ところで、世界的に見ると、4分の1以上の人が1366×768pxというサイズの画面を使っているようです。もっと大きな画面を使っている人も多いですが、自分が仕事でWebサービスのUIを作るときにはシェアの大きさから事実上の標準解像度としています。

f:id:ymrl:20170119011714p:plain

標準設定のWindows 10の場合は画面の下側でタスクバーが40pxの幅をとるし、上側ではブラウザのツールバーなどが、Edgeであれば77pxも幅を取ります。Webコンテンツが表示される大きさは、横幅が1366pxあっても、縦幅は650px程度しかありません。横幅の1366pxにあわせて、一行の長さがいい感じになる文字サイズを設定すると、こんどは縦幅が足りなくなってしまいます。経験則として、文章を読みやすくするには、あるていど前後の行も読めたほうが良いというのがあるからです。

そこで現在このブログもそうなのですが、せっかく広めの画面をもったパソコンが増えているのに、文書を目一杯表示するのではなく、あるていどの横幅に絞って表示しているページが多いのだと思います。はてな編集部ブログもそうですし、Mediumnoteのような文章を読ませることを目的としたサービスではその傾向が強いように思われます。

さて、改行の話に戻るのですが、ここではてなブログの編集画面を見てみましょう。

f:id:ymrl:20170119015420p:plain

ブラウザの幅に従って本文の編集欄が大きくなってしまうので、一行がとてもとても長いです。いまこの文章もこういう画面で書いていますが、わざわざこの画面だけ、他のタブのあるウィンドウから切り離してだいぶ幅を狭めて書いています。

こういう、一行あたりの文字数がかなり多い編集欄で、読みやすくすることを意識しながら文章を書くと、読みやすいところで改行したい気持ちになってしまうのが自然なのではないでしょうか。

あるいは、でき上がったブログの見栄えが、やはり一行あたりの文字数が多めだと、読みやすいところで改行を挟んだほうがいいのかしらと思ってしまう人も多いのではないでしょうか。

はてな匿名ダイアリーに投稿される文章が、改行多めの「ポエムっぽい」ものになりがちなのも、横幅を目一杯使うレイアウトが影響しているのかもしれません。もしかしたら、改行多めの文章が普及しつつある一端を担っているのは、はてななのかもしれません。

ここまで書いて改行の多い文章について否定的な感じになってしまいましたが、文章を載せるメディアによって文章を書くうえでの常識が変わってくるというのは面白いことだとも思っています。むかし、ケータイ小説というのが流行りましたが、あれはあれで当時の携帯電話の表示に最適化された文体になっていました。広い画面と狭い画面という真逆の条件下で起きたことが、文章の改行が多くなるという似たような現象だったというのもまた面白いなと思います。

ちなみにMediumの編集画面は投稿後とのギャップが少なく、そのおかげで読みやすくするための改行を挟まなければいけない気持ちにはなりにくそうに思えます。Mediumのユーザー層の影響のほうが大きくありそうですが、形式段落あたりの文字数の少ない「ポエムっぽい」記事をあまり見ないのは、もしかしたらそういう投稿UIデザインの影響も少なからずあるのかもしれません。

本当はUIデザインの話として書こうと思ったのに上手く繋がらなくなってきたので、UIデザインの話はまた次の機会に。