レスポンシブ化への備えとしてのモバイルファースト

読み物系コンテンツはレスポンシブにしている。

だがCVRがモノをいうアフィリエイトサイトは、今のところレスポンシブにしていない。

それでも、コンテンツをつくっていく上でモバイルファーストを意識することは有効かもしれない。

なぜなら、いざサイトをレスポンシブにした時に、各コンテンツの修正をする手間が省けるからだ。

今から簡単にできることをまとめておく。

画像のサイズは最小限

重い画像はやはり好ましくない。

無意味なアイキャッチ（青空、おねえちゃん…）を600pxなどの大きいサイズで入れることは必要だろうか。iPhoneにあわせて320pxくらいにしても、アイキャッチとしての役割は十分果たしてくれるかもしれない。

図表の工夫

スペック比較などの図表はわかりやすくて便利だが、横長になるとスマホではとても見にくい。内容にも寄るけど3列が限界だろう。

テーブルのレスポンシブ化は奥が深い問題のようだからおいといて、

「そもそも、こんな横長にする必要ってあるんだっけ？」

↓

「テーブルを2つにわけても別にいいんじゃないだろうか」

「この項目ユーザー的にはあんまいらんかも」

「比較の切り口を変えよう」

「リストで十分かも」

みたいな工夫というか問いかけというか、とにかく図表をシンプルにする努力をする癖をつけるといいかもしれない。

価格コムやアットコスメが勉強になる。

文章の区切り方

ふつうは段落区切りだと思うが、句点や文節で改行するパターンもある。たとえばほぼ日刊糸井新聞

適宜短めに切って改行することで文章に呼吸、間が生まれて読みやすい。

文章が横長になり過ぎないのもメリットだ。

でもこれそのままだと、レスポンシブだと読点のところで改行されるので読みにくい。

iPhoneにおさまるところで改行するとさすがにPCでは横幅が短すぎる。手っ取り早く解決するには、文の途中で改行するのをやめて句点や段落で1ブロックにすることだ。

ちなみにほぼ日はスマホで見ると、読点での改行は消えている。CSSなのかURLを振り分けているのかなんなのかわからないけどさすが。

記事中の内部リンク増やす

当たり前か。

デザインをシンプルにする

むだにリッチにしなくていいかもしれない。

ほかにもいろいろできることはありそうだ。