いままで気がついていなかったんだけど、わたしのブログをスマホで表示したときにピンチアウトで拡大するようになっていたようだ。
気にするほどではないけど気持ち悪いのでピンチが出来ないようにしました。
ソースは1行なのでカンタンです。
metaタグで以下のとおり記載します。
<head> 〜ここに記載〜 </head>
具体的にはヘッダー内に記載したいところなので「はてなブログ」の場合は、
「設定」→「詳細設定」→「headに要素を追加」
から以下のソースを記載しましょう。
超簡単ですね。
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
これでピンチアウトしても拡大しないようになりました。
これにて一件落着。
デザイン修正つづく
見やすく読みやすいブログにするためデザインやレイアウトについてシンプルかつミニマムなデザインを心がけています。
記事の上下に掲載していたSNSへのシェアボタンもAddthisに統一。PCはサイド、スマホは常にボトムにfloatで表示するようにしました。
Addthisを使ったシェアボタンの設置はレイアウトを崩さなくてよいので便利です。
また画面上部のスライダーやバナー広告もなくして記事がすぐ読めるようにスッキリとさせました。
記事を見に来たひとがすぐに本文が読めるようにするべきですしね。
Adsenseの広告のクリックも画面上部より本文以降の画面下部のほうがコンバージョン率が高いです。
タイトルもあいかわらず「けいおんフォント」ですがスッキリした太さに変更しました。
わずかな変更ですが少し洗練されたイメージになったかな。
気分は新鮮ですね。運営者にとっては新鮮な気持ちになれるのは飽きずにブログを続けられる素になるので効果は大きいです。
まだまだ修正の旅はこれからもつづきます。