クエスト4：ボックスで要点を一目で伝えよう
jinlab
JIN:Rクエスト
クエスト2：見出しの基本とデザイン変更のやり方
jinlab
記事内に商品プロモーションを含む場合があります
記事を読みやすく、おしゃれに仕上げるために欠かせないのが「見出し」。
でも、「どうやって見出しを使えばいいの？」「デザインってどこで変えるの？」と悩む初心者さんも多いはず。
この記事では、JIN:Rを使ってブログを始めたばかりのあなたに向けて、見出しの基本的な使い方と、カスタマイズで見た目を整える方法をわかりやすく解説します。
見出しを味方につけて、読まれる記事作りを始めましょう！
目次
今日のゴール
今回のクエストで目指すのは、この3つです。
今日のクエストの目的は？
- 見出しのデザインをカスタマイズしてみること
- 見出しブロックの使い方を覚えること
- 読みやすい構成を意識して記事を組み立てること
これができれば、あなたの記事は“ただ書いただけ”から“伝わる記事”にレベルアップ！
いきなり完璧を目指す必要はありません。
まずは、「見出しを使って記事を整理する」感覚をつかんでいきましょう。
見出しをカスタマイズする方法
見出しは、記事全体の印象を大きく左右する重要な要素です。
JIN:Rでは、デザインをカスタマイズできるので、自分のブログに合ったデザインに整えておきましょう。
ここでは、初心者の方でも迷わずできるように、4つのステップでやさしく解説します。
カスタマイズを開こう
左メニュー「外観」＞「カスタマイズ」をクリックする。
見出しデザインの設定画面を開く
カスタマイズ内の「見出し」をクリックする。
見出しスタイルを選ぶ
プレビューを見ながら、自分のサイトに合うスタイルを選びます。
「公開」ボタンをクリックする
最後に、右上の「公開」をクリックすれば保存完了！
これで見出しデザインがブログ全体に反映されます。
まずは気軽に、好きなデザインを試してみてくださいね！
見出しの使い方を覚えよう！
ブログ記事を書くときに大切なのが、「見出しブロック」。
これを使いこなせるようになると、読みやすく・伝わりやすい記事が書けるようになります！
ブロックを追加
まず、投稿画面を開きましょう。
そこで画面の「＋」ボタンを押します。
「見出しブロック」を選ぼう
メニューから「見出し」を検索する。
ブロック一覧から「見出し」をクリックする。
※よく使うブロックとして上位に出てくることもあります！
テキストを入力してみよう
「見出し」と書かれたエリアに、そのまま文字を入力してみましょう。
見出しの階層を選ぶ（H2〜H4）
入力したあと、画面上部にある「H2」「H3」「H4」などのボタンを確認しましょう。
「段落だけで記事を書く」より、
見出しを入れることで構成が整理され、読者に伝わりやすくなります。
まずは、見出しブロックを使って記事を区切る練習から始めましょう！
読まれる記事にするための「見出し」の工夫
ブログを始めたばかりの頃は、「見出しってどう使えばいいの？」と迷う方も多いはず。
でも、見出しはただの飾りではなく、読みやすく、伝わる記事を作るための大切なパーツです。
この記事では、初心者でもすぐに実践できる
「見出しのルール」と「使い方のコツ」を紹介します！
見出しの基本ルール｜順番を守ろう
ブログの見出しには「階層の順序」があります。
見た目だけで選ばず、内容に合わせて正しい順番で使うことが大切です。
- H2（大見出し）：記事内の大きなテーマ
- H3（中見出し）：H2の具体的な説明や補足
- H4（小見出し）：H3の中でさらに細かく分けたいとき
こんな使い方はNG
H2を飛ばしていきなりH3から始めたり、H3の前にH4を使うのは避けましょう。
読者も検索エンジンも混乱してしまいます。
正しい階層で見出しを使うことが、読みやすく伝わる記事づくりの第一歩です！
読まれる記事にする「見出しの使い方のコツ」
記事を読んでもらうためには、見出しの使い方にも工夫が必要です。
特にH2とH3の関係性を意識するだけで、記事のわかりやすさが大きく変わります。
① 一番伝えたい話題からH2で見せる
読者の目に真っ先に入るのがH2見出し。
だからこそ、最も大切なテーマから順にH2を使っていくのが基本です。
書きたいことをすべて並べるのではなく、
「この順番で読むと伝わりやすい」という構成を考えて並べましょう。
② H3ではH2の中身をくわしく展開する
H3は、直前のH2を補足する役割を持ちます。
つまり、H3では「H2の内容を説明する」「具体例を出す」「答えを示す」など、H2をサポートする情報を書きます。
こんな使い方はNG
関係のない話題をH3に入れると、読者が混乱する原因になります。
よくあるミスと対処法
- いきなりH3から始めてしまう
-
ありがちなパターン
「H2だと目立ちすぎるから…」という理由で、最初からH3を使ってしまうこと。どうする？
H2は記事の大見出し。読者に「ここから新しい話題ですよ」と伝えるための重要な目印です。
見た目ではなく、意味（構造）で見出しを選ぶようにしましょう。
Q
- H3やH4の内容がH2とつながっていない
-
ありがちなパターン
H2の話題と関係ないことをH3で書いてしまう。どうする？
見出しの階層は「親子関係」。
H3は直前のH2の中身を深掘りするものなので、内容がしっかりつながっているか確認しましょう。
Q
まとめ｜今日の成果を振り返ろう！
今回のクエストでは、見出しの基本操作からデザイン調整、構造の考え方まで一通りマスターしました！
成果を振り返ろう！
- JIN:Rで見出しデザインを変更する方法がわかった
- 見出しブロックを使って記事の構造を作れるようになった
- H2・H3・H4の正しい使い分けが理解できた
見出しを意識するだけで、「ただの文章」が「伝わる記事」にレベルアップします。
最初から完璧を目指さなくても大丈夫。まずは1記事、見出しを意識して組み立ててみましょう！
ABOUT ME
デザイン初心者でも、おしゃれなブログやホームページは作れます！
JIN:Rを使ったWeb制作の手順や、見た目を整えるコツを発信中。
難しい操作や専門用語はできるだけかみくだいて解説。
「自分でサイトを作りたい」と思ったあなたの最初の一歩を応援します。
