初心者必見ブログマークアップ構成

お知らせ |ブログ

ブログ記事は、内容の良し悪しだけでなく「マークアップ(HTMLの構造)」によっても、読みやすさや検索エンジンからの評価が変わります。とはいえ難しく考える必要はありません。この記事では、初心者の方がまずおさえておきたいマークアップの基本を、理由とあわせて解説します。

なぜマークアップが大切なのか

マークアップは、文章の「意味」をブラウザや検索エンジンに正しく伝える役割を持っています。見た目を整えるだけでなく、検索エンジンが記事の構造を理解する手がかりになり、音声読み上げなどアクセシビリティの面でも効果を発揮します。正しい構造は、結果的にSEO(検索エンジン最適化)にもつながります。

1. 見出しは階層を守って使う

見出しには h1〜h6 があり、数字が小さいほど上位の見出しです。記事タイトルは h1、大きなまとまりは h2、その中の小見出しは h3……と、順番を飛ばさずに使うのが基本です。

たとえば h2 の次にいきなり h4 を使うと、構造が崩れて内容が伝わりにくくなります。見出しだけを拾い読みしても記事の流れが分かる状態を目指しましょう。

2. 段落とリストで情報を整理する

長い文章は、意味のまとまりごとに段落(p)で区切ります。手順や箇条書きにできる情報はリスト(ul / ol)にすると、視線が流れやすくなり離脱を防げます。

  • ul(順序なしリスト):順番が関係ない項目の列挙に
  • ol(順序ありリスト):手順やランキングなど、順番が意味を持つときに

3. 画像には代替テキスト(alt)を付ける

画像の img タグには alt 属性で内容を簡潔に説明します。画像が表示されないときの代わりになるだけでなく、検索エンジンが画像の内容を理解する助けにもなり、画像検索からの流入も期待できます。

4. 強調は strong / em を正しく使う

本当に重要な語句は strong、ニュアンスを強めたいときは em を使います。見た目のためだけに多用するのではなく、強調したい箇所を絞ることで、かえって伝わりやすさが増します。

まとめ

マークアップの基本は、「意味に合ったタグを、正しい順番で使う」ことに尽きます。難しいテクニックよりも、この基本を守るだけで、読みやすく検索にも強い記事に近づきます。記事構成やサイトの運用にお悩みの際は、YesQueryへお気軽にご相談ください。

Recruit 採用情報

一緒に、よりよい未来を
デザインしませんか。

経験・未経験問わず、やる気のある方を歓迎します。
資格取得支援制度あり。まずはお気軽にご連絡ください。

採用情報を見る

Contact お問い合わせ

ご相談・お見積もりなど、
お気軽にご連絡ください。

WEB制作・印刷物・運用など、
まずはお気軽にご相談ください。24時間受付中。

お問い合わせ・お見積もり