ブログをスマホに最適化し始める

このブログは自分がパソコンで見るために書いていたので、表示確認もずっとパソコンからしかやっていませんでした。

でも直近数か月のOSごとのアクセス割合を見ると、

  • iOS: 37.4%
  • Android: 24.7%
  • Windows: 26.4%
  • macOS: 8.0%
  • Linux: 3.5%

こんな感じ。6割以上がモバイルOSからのアクセスになっています。

たまに自分も出先からスマホでブログ検索をすることがあるんですが、ちょっと見づらいです。ということで、スマホでも見やすくなるように少し前からいろいろと改造を始めました。

文中改行をやめる

一行を何文字で改行させるかというのは、これまで自分で文中に改行を入れて決めていました。単語の途中で改行されたりしないように。

でもパソコンより1行の幅のせまいスマホで見ると、自動折り返しのあと1〜2文字で改行が入る行があったりしてちょっと気持ち悪い。

ということで、文中に自分で改行を入れるのはやめて、スマホだけでなくパソコンでも自動折り返しに任せることにしました。
(パソコンでは、Flickrの埋め込み画像幅と同じ640pxで文字が折り返されるような設定にしました。)

過去の日記については、今年5月の中南米以降のものは文中改行がないように書き換えています。

Googleマップ埋め込みのサイズ調整

Flickrでの画像埋め込みは、最近はずっと「Medium (640 x 680)」のサイズでやっているんですが、スマホのブラウザだと自動的に画面に合うサイズに縮小されて表示されています。

でもそうならないのがGoogleマップの埋め込み。ここ数年は、共有機能の「中」サイズ(600 x 450)で主に埋め込んでいたんですが、これだとスマホでめっちゃはみ出ます。「小」サイズ(400 x 300)でもまだはみ出ます。

それでOPPO Reno7 AとRakuten Hand 5GのChromeとFirefoxで検証してみたんですが、

IMG20231213105856
スマホでの埋め込み画像の自動縮小と同じサイズで表示されるのが幅312px。パソコンで見るとちょっと小さいんですが、詳しく見たければ[拡大地図を表示]をクリックすればいいかと思ったので、いったんこのサイズを標準とすることにしました。

過去の日記も、ニッチなお役立ち系でよくアクセスがあるものはぼちぼち修正していっています。
(ChromebookのLinux環境のシェルスクリプトで一括置換。)

「次の」と「前の」の表記

これはスマホだけの話ではないんですが、FC2ブログの標準テンプレートには「次の記事」や「前の記事」のようなリンクがあって、この挙動に違和感がありました。

「次の記事」は、投稿順でいうと1つ古い記事のことで、
「前の記事」は、投稿順でいうと1つ新しい記事のことです。
(こういう文中改行はありかな。)

どんどん過去にさかのぼって読んでいる人目線でそう呼んでいるんだと思いますが、書いてる側からすると印象が逆。ある記事の次に書いたのは、1つ新しい方の記事なので。

アクセスログを見ても、ときどき意味を逆にとらえてクリックされているような様子も見受けられます。

ということで、少々ださくても誤解のない表記にしたかったので、

「次の」→「1つ古い」
「前の」→「1つ新しい」

とテンプレートを無理やり書き換えました。リンクの位置も、古い方を左にして新しい方を右に入れ替え。数直線のイメージです。

コメント

読み込み中...