はてなブログPro のオプションに「ヘッダとフッタ」の非表示というものがあります。
これですね。はてなユーザにはあると便利ですが、ユーザでなければジャマなものです。
で、自作テーマをレスポンシブで作ろうとしていましたら、モバイルの詳細設定の「レスポンシブデザイン」にチェックするしない、との関係が分かりにくいですね。
01「レスポンシブデザイン」チェックボックス
- チェックなし
UserAgent を読んで（詳しく調べていませんので多分）、スマートフォンの場合は、はてなオリジナルモバイルテーマに固定されます。必ずヘッダ&フッタがつきます。
PC や UserAgent 指定のないタブレットなどは、指定テーマが有効になり、「ヘッダ&フッタ」オプションも有効になります。 - チェックあり
すべてのデバイスで指定テーマが有効になり、「ヘッダ&フッタ」オプションも有効になります。
テーマに「 /* Responsive: yes */ 」のコメントを入れると、
<meta name=”viewport” content=”width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no” / > が挿入され、デバイスの横幅に応じた表示になります。
ということのようです。
02スマートフォン用ヘッダ&フッタ
スマートフォン用にアイコン化されたヘッダがあるようです。
オリジナルモバイルテーマの場合は当然ですが、「レスポンシブデザイン」にチェックした場合でもスマートフォン用になります。
上が実機のキャプチャで、下がエミュレーターです。UserAgent を読んでいるということですね。
