これまでプチメタはパソコンやタブレットで見た場合と
スマートフォンで見た場合とで
デザインやレイアウトが大きく異なっていました。
旧プチメタをパソコンから見た場合:
旧プチメタをスマホから見た場合:
これははてなブログのもともとの仕様で、
スマホで見やすいレイアウトには変わるものの
本来のデザインがまったく反映されないので
閲覧する端末によって雰囲気が違うという問題がありました。
そこで同一のデザインを流用しつつ、
その端末の解像度に合わせてレイアウトが変わる
「レスポンシブデザイン」に載せ替えることにしました。
単に設定ファイルを置き換えるだけでは済まず、
これまでのブログの雰囲気と同じになるよう
いろいろと手を加える部分に苦労しました。
実質的に「プチメタ3.1」といったところでしょうか。
新プチメタをパソコンから見た場合:
新プチメタをスマホから見た場合:
横幅の狭いスマホやタブレットから閲覧した場合は
サイドバーがブログ下部に移動し、
記事本文が狭く表示されないようになっています。
同じタブレットでも画面を横向きにして広くすると
サイドバーも含めて完全に表示されます。
今やWebサイトでのレスポンシブ対応は珍しくないのですが、
2年前にブログを作ったときに選んだデザインが
レスポンシブに非対応のものだったので、
なかなか置き換える踏ん切りがつきませんでした。
レブログの方も同様に変更しています。
もう少し違和感がなくなるよう、
今後も細かい変更を加えていくつもりです。