【初心者向けブログカスタマイズ】忘れないで！！スマホサイト表示の落とし穴【レスポンシブデザインへの変更】

はじめに

はてなブログを始めたばかりで、スマホでも読んでもらいやすいようにレスポンシブデザインのテーマを選ばれる方も多いのではないでしょうか。

復習ですが、レスポンシブデザインとは、アクセスした人のデバイス（PC、スマホ、タブレット）の画面サイズに合わせて、表示が最適化されるデザインのことを指します。

最近はブログをスマホで読む人も多いこともあり、はてなブログの人気テーマの多くはレスポンシブデザインになっています。レスポンシブデザインに対応したテーマを選べばあとは勝手に見る人のデバイスによって勝手に対応してくれてるわけではありません。最後に一手順踏まないといけないのですがご存知でしょうか。この記事ではその説明をします。

ブログのブログカスタマイズとして吹き出しや、蛍光ペン風マーカー、トップへ戻るボタンなど利用されてる方もおられると思います。最後の一手順を踏まないと、このようなカスタマイズが反映されない場合があります。反映されないため、ただの黒文字の文章だけの非常に読みにくいブログになってしまっていました。

管理人は作成時にPCサイトのプレビュー画面だけしか見ていなかったため、妻に言われるまで気づきませんでした。

みなさん、そうならないように、忘れずに最後の一手順を踏んで、スマホで見てくれる人にも見やす記事にしましょう。

ブログをレスポンシブデザイン対応にする手順

手順は簡単で、デザインからレスポンシブデザインにチェックを入れるだけです。

1. デザインを選ぶ
2. スマーとフォンを選ぶ
3. 一番下までスクロールし「詳細設定」を選ぶ
4. レスポンシブデザインにチェックをつける
5. 「変更を保存する」をクリック

これでスマホで見たときにも同じように表示されるようになりました。

メニューバーやトップに戻るボタンもちゃんと表示されるようになっているのが確認できますよね。

まとめ

スマホさいとでもレスポンシブデザインに対応する表示にするための設定について説明させていただきました。ブログのテーマ選ぶときにはこういう説明ってしてくれないですよね・・・

手順は簡単ですし、一度設定してしまえばあとは特に何もする必要はありません。忘れずに設定してスマホで見てくれる方にも見やすいブログにしましょう。