なぜ「正しいHTML」を書くだけでSEOが強くなるのか?
Webライティングにおいて、文章の面白さと同じくらい重要なのが「正しいHTMLタグを使うこと」です。
多くのCMS(入稿ツール)では、Wordのように文字を打つだけで記事が作れますが、その裏側でどのようなHTMLコードが生成されているか意識していますか? 不適切なタグの使い方は、検索エンジンに記事の内容を誤解させ、SEO評価を下げてしまう原因になりかねません。
Googleは「見た目」ではなく「タグ」で記事を理解する
Googleのクローラー(検索ロボット)は、私たち人間のように画面のデザインを見て「ここは見出しだな」「ここは大事なポイントだな」と判断しているわけではありません。 ソースコード上のHTMLタグを見て、文書の構造を判断しています。
- 文字が大きくても、タグが
<p>ならただの「段落」 - 文字が小さくても、タグが
<h2>なら重要な「見出し」
つまり、正しいHTMLタグを使うことは、Googleに対して「この記事はこういう構成で書かれていますよ」と説明書を渡すようなものなのです。
ユーザー体験(UX)とアクセシビリティの向上
正しいHTMLは、音声読み上げソフト(スクリーンリーダー)を利用する視覚障がいのあるユーザーにとっても重要です。 見出しやリストが正しくマークアップされていれば、音声でも「ここからが新しい章です」「3つのポイントがあります」と構造が伝わります。 アクセシビリティへの配慮は、近年SEOの評価指標としても重要度を増しています。
1. 記事の骨格を作る「構造」のタグ
まずは記事全体の設計図となる、基本のタグです。
見出し(h1〜h6):階層構造の命綱
本のような「章・節・項」を作るタグです。h1が最大で、数字が大きくなるほど下の階層になります。
<h1>:記事タイトル(通常は1ページに1回のみ)<h2>:大見出し(記事のメインテーマ)<h3>:中見出し(h2をさらに細分化したもの)<h4>〜<h6>:小見出し
NG例: 文字サイズを調整するために <h2> の直下に <h4> を使うなど、階層を飛ばすのはSEO的にNGです。必ず h2 → h3 → h4 の順で使いましょう。
段落(p)と改行(br):使い分けの鉄則
初心者の方が最も混同しやすいのがこの2つです。
<p>(Paragraph):段落を変える。意味のまとまりが変わる時に使う。<br>(Break):改行する。同じ段落内で見た目上の行を変えたい時に使う。
文章の間隔を空けるために <br><br><br> と連打するのは推奨されません。文章が終わったら必ず <p> で区切るのが正しい作法です。
2. 読みやすさを生む「リスト・整理」のタグ
記事の中に箇条書きを入れる際、キーボードで「・」や「1.」と手打ちしていませんか? これはただの文字として認識されてしまいます。必ず以下の「リストタグ」を使いましょう。
順序なしリスト(ul / li):箇条書きの基本
順序に関係なく項目を並べる場合に使います。
<ul>
<li>りんご</li>
<li>みかん</li>
<li>バナナ</li>
</ul>
<ul>(Unordered List):リスト全体の囲い<li>(List Item):個々の項目
順序ありリスト(ol / li):手順やランキングに
「手順」や「ランキング」など、順番に意味がある場合に使います。自動的に 1, 2, 3... と番号が振られます。
HTML
<ol>
<li>会員登録ボタンを押す</li>
<li>メールアドレスを入力する</li>
<li>認証URLをクリックする</li>
</ol>
<ol>(Ordered List):順序付きリストの囲い
表組み(table / tr / th / td):スペック比較に必須
料金表やスペック比較など、情報を整理して見せる際に使います。
<table>:表全体<tr>(Table Row):表の「行」(横のライン)<th>(Table Header):見出しセル(太字・中央寄せになることが多い)<td>(Table Data):データセル(通常の中身)
3. 信頼性と強調を表す「意味づけ」のタグ
ただテキストを表示するだけでなく、「ここには特別な意味がある」と伝えるタグです。
引用(blockquote):著作権を守るための必須マナー
他サイトや書籍から文章を引用する場合は、必ず <blockquote> タグで囲みます。 これを使わずにコピペすると、Googleから「コピーコンテンツ(パクリ記事)」とみなされ、ペナルティを受けるリスクがあります。
HTML
<blockquote>
<p>引用する文章をここに書きます。</p>
<cite>出典:<a href="URL">サイト名</a></cite>
</blockquote>
強調(strong):Googleに「ここが重要」と伝える
太字にするタグには <b> と <strong> の2種類がありますが、意味が異なります。
<b>:見た目を太くするだけ(意味はない)<strong>:意味的に重要であることを示す
SEOを意識するなら、キーワードを含んだ重要な箇所には <strong> を使いましょう。ただし、多用しすぎると「どれが重要かわからない」と判断されるため、1見出しにつき1〜2箇所程度に留めるのがコツです。
リンク(a)と画像(img):回遊率とalt属性
<a>:リンクを設定します。target="_blank"をつけると別タブで開きます。内部リンクを適切に貼ることで、サイト内の回遊率が高まります。<img>:画像を貼ります。必ずalt="画像の説明"を入れましょう。画像が表示されない時の代わりになるほか、画像検索からの流入も期待できます。
まとめ:HTMLはWebライティングの一部である
今回紹介したHTMLタグは、デザインのためではなく、「情報を正しく伝えるため」のものです。
- 見出しで構造を作る
- リストで見やすく整理する
- 引用タグで情報の出処を明確にする
これらを意識するだけで、あなたの書く記事はGoogleにとって「理解しやすく、評価に値するコンテンツ」へと進化します。 今日からCMSのエディタ画面だけでなく、ぜひ「HTMLソース」も意識して入稿してみてください。

