Maison_de_chatのブログ

【実体験レポート】ChatGPTで始める副業 – 最先端AI活用で在宅収益化に挑む新たな働き方を更新中！

はてなブログでh1・h2はどう設定する？初心者向けに徹底解説！

お問い合わせはこちらから！

1. はてなブログにおけるh1設定方法

はてなブログでは、記事のタイトルが自動的にh1タグに設定されます。

特別なHTMLの設定は不要で、タイトルを書くだけでOK！

ここで大事なのは、h1は記事全体を表すキーワードになるので、SEOを610～70文字内外で簡潔に、しかも読者が興味を持てるような文章を意識しましょう。

スマホ検索で表示される場合、タイトルの見やすさも重要です。

例えば「はてなブログ h1 h2 設定方法を全解説！」といったように、標的なキーワードを含めつつキャッチーを強化するタイトル作りがポイントです。

はてなブログにおけるh1設定方法



2. メタディスクリプション（記事概要）の設定方法

検索結果に表示される説明文、それがメタディスクリプションです。

設定は簡単！記事編集画面で「編集オプション」を開き、「記事概要」に入力するだけ。

めやすくまとめるコツは、

  • 80文字～120文字程度

  • 記事内容の要約を明確に

  • キーワードも自然に含める

これを意識するだけで、検索結果のクリック率が大きく変わります！

はてなブログにおけるh1設定方法



 

3. 大見出しにしたのにh2じゃない問題が発覚

はてなブログで大見出しを使っても、HTMLを見るとh2ではなくh3で表示されていました。

これは、はてなブログの標準仕様によるもので、記事内では大見出しをしてもh3として出力されるようになっています。

これを「正しくない」と反対する人もいますが、大切なのは見出しの階層をしっかり作ること。

h1（タイトル），h3（大見出し）と辞らず、読者にとってわかりやすい構成を意識すれば、SEOにも十分影響します。

大見出しにしたのにh2じゃない問題



 

4. h2が使えない問題に対する3つの対処法

4-1. 対処法１：そのままh3で運用する

そのままh3で使い続けても大きな問題はありません。

大事なのは、見出しの階層を正しく組み立て、読みやすさを確保すること。

SEOでも実際に成績を出しているブログは多いので、運用優先でも問題ないでしょう。

4-2. 対処法２：HTML編集でh2を書く

編集機能を「HTML編集」モードに切り替え、手動でh2タグを書き足す方法もあります！

<h2>見出し文章</h2>

と書けばOK！ 305度でも手間なので、記事数が増えると大変になりがちです。

HTML編集でh2を書く

 

4-3. 対処法３：CSSカスタマイズで見た目をh2風にする

最もスムーズなのがこの方法。h3タグをCSSでh2のように見せることで、読みやすさも向上します。

記事作成を優先したいときには、これが最優先です！

5. CSSカスタマイズで「h2風見出し」を作る手順

実際に行ったCSSカスタマイズの手順を簡単にまとめます！

CSSの追加方法

  1. 管理画面の「デザイン」を開く

  2. 「カスタマイズ」」のタブを開く

    はてなブログでCSSを追加する方法

  3. このCSSを追加

.entry-content h3 {
  font-size: 1.8em;
  font-weight: bold;
  margin-top: 2em;
  margin-bottom: 1em;
  border-left: 5px solid #333;
  padding-left: 0.5em;
}

はてなブログでCSSを追加する方法

これでh3見出しがとても読みやすく、スタイリッシュな見た目に変わります！

もっとオリジナルなデザインにしたい場合は、背景色を付けたり、ボーダーの色を変えたりもできます！

 

 

まとめ

はてなブログでh1とh2を正しく使い分けることは、読みやすい記事を作るためにもSEO対策にも必要です。

はてなブログでは標準でh1はタイトル、大見出しは一時h3となりますが、CSSカスタマイズやHTML編集を馴染すれば自分でデザインを調整できます。

大事なのは、結果として「読む人が分かりやすい」記事を作ること。

最初は小さな試行錯誤の組み合わせでいいので、思い切って体験を経験に変えていきましょう！

h1とh2を理解し、読みやすい記事構成を作れるようになったら、次は記事全体のデザインセンスを見直してみましょう！

次回の記事では、「ブログの全体デザインをスタイリッシュに見せる」ための簡単CSSカスタマイズ術をご紹介します！

たとえば、見出しのデザインを統一感のあるカラーにしたり，全体のフォントを変えていららしくするなど，記事を読む人が気持ちよくなるような工夫を詳細に説明していきます！

最近は、ただ情報を伝えるだけでなく「デザイン性も評価される時代」。 次の記事も、ぜひ楽しみにしていてください！

はてなブログでh1・h2はどう設定する？初心者向けに徹底解説！のまとめ

今回はここで終わりにしたいと思います！

最後までお読みいただきありがとうございました！


このブログでは「ChatGPT×副業」をテーマに、AIをフル活用したリアルな副業チャレンジを発信しています🎶

むずかしい話はナシで、「ちょっとやってみたいかも」と思えるような内容を目指しています😁

私は現在、ChatGPTを使ってTシャツのデザインを作って販売したり、

LINEスタンプのキャラ制作に挑戦したりしています👍

デザインの知識ゼロでも、AIの画像生成機能を使えばかなりいい感じになりますよ！

ブログの内容やSEO対策も、ぜんぶChatGPTに相談しながら書いています。

アイデアが出ないときも、相棒みたいに助けてくれます🎶

さらに、楽天ルームのレビュー文章もChatGPTと一緒に考えたり、

X（旧Twitter）の投稿や運用方法も提案してもらったりと、あらゆる場面でAIに頼っています。😅

「AIって便利そうだけど、自分にも使えるのかな？」

と思っている人には、ぜひ読んでほしいです。

このブログは、AI初心者でも副業が始められるように、

体験ベースでわかりやすく書いています。

私の成功も失敗もまるごとシェアしていくので、よかったら気軽に読んでいってくださいね。

Xでも日々の活動をゆるっと更新しているので、ぜひのぞいてみてください！

明日のあなたがより豊かになりますように😌

それでは、おやすみなさい😴