htmlタグ｜dfn・dl・dt・dd（定義）｜abbr・acronym（略語）｜用語の定義と略語のSEO

ホームページ（ウェブサイト）制作において、事業に関する専門用語や独自のサービス内容をユーザーへ分かりやすく説明することは、情報の正確性を担保する上で非常に重要です。特定の用語とその意味をセットにして記述し、検索エンジンに対して「ここは用語の定義をしている部分である」と正確に伝えるために使用されるのが、HTMLの「dfn」「dl」「dt」「dd」といったタグです。

文章の中で特定の用語を直接定義する際に使用するのが「dfn（definition）」タグです。例えば、「SEOとは、検索エンジン最適化のことです」という文章がある場合、「SEO」という単語を「dfn」タグで囲むことで、この段落が該当の言葉を定義している文章であることをブラウザや検索エンジンへ明示します。

また、用語集やよくある質問（Q&A）のように、複数の用語とその解説を連続して並べる場面で活躍するのが「dl」「dt」「dd」の組み合わせです。

「dl（description list）」タグは、用語と説明のリスト全体を囲む大枠として機能します。その中に、説明したい用語の名称を示す「dt（description term）」タグと、その具体的な解説文を記述する「dd（description details）」タグを配置します。単に文章を並べるだけであれば他のタグでも画面上の表示は可能ですが、用語とその意味が明確に紐づいている関係性を構造化するためには、このリスト型の記述タグを正しく使用することが求められます。

さらに、専門用語の中にはアルファベットの頭文字をとった略語が多く存在します。これらを示すタグとして「abbr」や、過去のHTMLで使用されていた「acronym」などがありますが、これらの具体的な使い分けや歴史的背景については後述のセクションで詳しく解説します。

これらの定義タグを適切に使い分けることは、SEO（検索エンジン最適化）において大きな効果をもたらします。検索エンジンのクローラーは、ページ内のHTML構造を解析してコンテンツの内容や文脈を深く理解します。「dfn」や「dl」タグを用いて用語が明確に定義されていると、検索結果の強調スニペット（検索結果の最上部に表示される回答部分）に情報が採用されやすくなる可能性があります。また、自社の事業領域における専門的な知識を、正確なマークアップで継続的に発信することは、検索エンジンからのホームページ（ウェブサイト）全体の評価を高めます。

本ページでは、それぞれのタグの基本的な記述ルールから、集客に強いサイトを構築するための論理的なマークアップ手法について詳しく解説します。

dfn（デフィニション）

<dfn></dfn>

ホームページ制作（ウェブサイト制作）において、<dfn>タグは、ウェブサイト・ホームページ内で、定義する用語を明示する際に使用します。

用語の定義を明確に示すために用いられるdfnタグは、コンテンツの専門性を検索エンジンへ伝える役割を担っています。

<dfn> 定義する用語を明示

<dfn>の「dfn」は、Definitionを示します。<dfn>タグは、ウェブページにおいて何らかの用語を定義する場合に使用します。文章内の該当の部分に、構造上の情報を付加する要素です。一般的なブラウザでは斜体で表示されます。

dfnタグは、文章中で初めて登場する専門用語や特定の概念を定義する際に使用します。単純なテキストとして用語を記述するのと、dfnタグで囲むのとでは、検索エンジンがコンテンツを解析する際の理解度が大きく変わります。例えば、自社の事業領域における独自の概念や、業界特有の専門用語を解説する際、dfnタグを用いることで、「ここが用語の定義である」と明確にシグナルを送ることができます。

このタグの近くには必ずその用語を説明する文章を配置することが求められます。検索エンジンのクローラーは、dfnタグで囲まれた単語とその周辺の文脈をセットで読み取り、情報の関連性を評価します。もし用語だけをタグで囲み、十分な説明が存在しない場合、意味論的なマークアップとして正しく機能しないかもしれません。そのため、読者にとって分かりやすい解説文を添えることが、結果としてSEOの観点からもプラスに働きます。

また、dfnタグは他のインライン要素と組み合わせて使用されることも多くあります。例えば、略語を定義する場合にはabbrタグと併用することで、その用語が略語であることと、ここで定義されていることの両方を同時に伝えることが可能です。このように、HTMLタグを単独ではなく文脈に合わせて適切に組み合わせることで、ホームページ（ウェブサイト）全体の構造がより立体的になり、情報検索において有利な評価を獲得しやすくなります。コンテンツの品質を高めるためには、表面上のテキストだけでなく、背景にあるコードの正確な記述にもこだわる必要があります。

<dfn></dfn>

ホームページ制作・SEOの1ポイント

ホームページ制作で用語を定義する場合は、定義型のマークアップを施しますが、より詳しく単語などの属性を指定する場合は、構造化データマークアップを利用します。構造化データマークアップを施すことで、検索結果スニペットでリッチスニペットとして表示されるものもあります。

dl（デフィニションリスト）

<dl></dl>

ホームページ制作（ウェブサイト制作）の際に<dl>（デフィニションリスト）タグを使用することで、定義型リストの定義を行います。用語とその説明をリスト化して整理する際、全体の枠組みを定義するのがdlタグです。

<dl> 定義型リストの定義

Definition List（デフィニションリスト）。

<dl>タグは、タグで囲まれた部分が、定義型リストであることを定義します。

定義型リスト

①定義する用語（<dt>）と、②その用語の説明（<dd>）を一対にしたリスト。

情報を構造化し、関係性を明示するリストの全体枠

dlタグは、用語（dt）とその解説（dd）をひとまとめにし、それらがペアとして関係していることを構造的に示すためのタグです。一般的な箇条書き（ulやol）が並列の項目を列挙するのに対し、dlタグは「見出し」と「内容」という明確な関係性を持つデータに適しています。例えば、自社事業のサービスメニュー一覧や、よくあるご質問（Q&A）、あるいは社史の年表などを表現する際、この構造化されたリストが大きな効力を発揮します。

検索エンジンは、dlタグで囲まれたブロックを「用語と説明の集合体」として認識します。そのため、ページ内に散らばった情報を単なる段落として記述するよりも、dlタグを用いて整理した方が、クローラーにとって情報の構造が理解しやすくなります。構造化されたデータは、検索結果の強調スニペットなどに引用されやすくなる傾向があるため、情報を的確に届ける上で非常に重要です。

実際のホームページ（ウェブサイト）制作の現場では、dlタグの中に複数のdtやddを含めるケースも頻繁に見られます。一つの用語に対して複数の説明文が存在する場合や、逆に複数の同義語に対して共通の説明を一つだけ記述する場合など、柔軟な情報の配置が可能です。このように、dlタグを活用して複雑な情報を論理的に整理することは、ユーザービリティの向上とクローラビリティの改善を同時に達成する手段と言えます。より専門的には、情報をどのようにグルーピングし、どのような階層で提示するかを設計する段階から、このタグの特性を考慮してマークアップの計画を立てていきます。

<dl></dl>

ホームページ制作・SEOの1ポイント

定義する用語と用語の説明といったように、HTMLにはセットで記述すべきタグがあります。ホームページ制作において、こうしたタグの意味を十分に理解して正確にマークアップしていくことで、ページの品質は向上し、SEOの効果も期待することができるでしょう。

dt（デフィニションターム）

<dt></dt>

ホームページ制作において<dt>（デフィニションターム）タグは、定義型リストの見出し、定義する用語を指定します。定義型リストの中で、核となる「用語」や「見出し」を指定するためのタグがdtタグです。

<dt> 定義型リストの見出し、定義する用語

Definition Term（デフィニション ターム）。定義型リストの見出し、定義する用語を指定。

ホームページ制作において<dt>タグは、<dl>、<dd>で定義した、定義型リストの見出し、定義する用語を指定します。

<dl>中に記述し、<dd>で定義した用語の説明を記述します。

dtタグは、dlタグで囲まれたリストの中で、これから解説する対象となる単語や名称を記述するために使用します。このタグに囲まれたテキストは、単なる文章の一部ではなく、「定義されるべき主題」として扱われます。事業を紹介するページであれば、サービス名や製品名、あるいはQ&Aにおける「質問」の部分がこれに該当します。

定義の対象となる用語を際立たせるマークアップ

検索エンジンの解析において、dtタグの内容は非常に重要なキーワードとして認識されやすい特徴があります。ユーザーが検索窓に入力するクエリと、dtタグに記述された専門用語が一致した場合、その用語に対して適切な回答（ddタグの内容）が用意されていると判断されれば、検索結果の上位に表示される可能性が高まります。したがって、dtタグには長々とした文章を入れるのではなく、端的で分かりやすい名詞やフレーズを配置することが求められます。

また、視覚的なデザインの観点からも、dtタグは重要な役割を持ちます。CSSを用いてdtタグを太字にしたり、背景色を付けたりすることで、ユーザーはどこに見出しがあるのかを瞬時に把握できます。情報を探しているユーザーにとって、見出しが明確に視認できることは、ページ内の回遊率を高め、離脱を防ぐための基本です。より専門的には、dtタグの中にdfnタグを含めることで、「この用語をここで初めて定義する」という強い意味を持たせることも可能です。このように、dtタグを適切に配置し、的確な言葉を選ぶことは、情報を正確に伝えるための基盤となります。

<dt></dt>

ホームページ制作・SEOの1ポイント

HTMLの中には、dtなど子要素として親要素の中でしか使用できないものがあります。正確に親要素と子要素を使用することで、その内側のテキストなどの関連性が高まります。すべてHTMLマークアップなしのテキストでも閲覧には問題はありませんが、正確にHTMLタグを使用することで、SEOとしてページの主題を検索エンジンに伝えられるほか、タグごとにCSSの指定をすることでデザイン変更などがしやすくなります。

dd（デフィニション ディスクリプション）

<dd></dd>

ホームページ制作において<dd>（デフィニション ディスクリプション）タグは、定義型リストの内容を示すタグで、定義した用語の説明を記述します。ホームページ（ウェブサイト）内のページに設置した<dt>で定義した用語の説明を記述します。dtタグで提示された用語に対して、具体的な説明や回答を記述するのがddタグです。

<dd> 定義型リストの内容、定義した用語の説明を記述

<dd>の「dd」は、Definition Description（デフィニション ディスクリプション）を示します。<dd>タグは、ウェブページにおいて定義した用語の説明を記述します。<dt>で指定した定義型リストの内容、用語の説明をします。

<dt>で定義する用語を記述し、<dd>で用語の説明を記述します。 これらは<dl>中に複数設置することができます。

ddタグは、dtタグと対になって機能し、提示された用語や見出しに対する詳細な説明文を提供します。Q&Aの「回答」部分や、サービスメニューの「詳細説明」、用語集の「意味」など、ユーザーが最も知りたい具体的な情報が入る場所です。このタグの中には、テキストだけでなく、画像、リンク、あるいは別の段落などを自由に含めることができるため、非常に表現の幅が広い要素です。

compact

compact=”compact”

<dt><dd>の表示を小さく表示。

<dd></dd>

用語に対する詳細な解説を記述し、検索意図に応える

検索エンジンは、ユーザーの検索意図を満たす有益なコンテンツを常に探しています。dtタグで適切なキーワードが提示されていても、ddタグの内容が薄かったり、的を射ていなかったりすれば、ページ全体の評価は上がりません。事業に関連する専門的な知見や、独自の視点をddタグの中にしっかりと盛り込むことで、他社のホームページ（ウェブサイト）にはない質の高いコンテンツを作り上げることができます。検索ユーザーが抱える疑問や課題に対して、具体的かつ詳細な回答をddタグ内で展開することが重要です。

さらに、一つのdtに対して複数のddを配置することも有効な手法です。例えば、一つの専門用語に対して、「概要」「具体的な活用例」「注意点」といった異なる切り口からの説明を複数のddタグに分けて記述することで、情報が整理され、読みやすさが格段に向上します。より専門的には、情報のボリュームが増えたとしても、HTMLの論理構造が保たれていれば、検索エンジンはその文脈を正確にたどることができます。充実した解説を適切なマークアップで提供することが、長期的な集客へと繋がります。

ホームページ制作・SEOの1ポイント

ホームページ制作において、特段マークアップをしなくても、ページを見るユーザーからは理解できる場合がよくあります。しかしながら、人間の判断とは異なり、検索エンジンはそれを理解できないことがあります。こうしたddタグなどのHTMLマークアップを施すことで、ページの中の各部分がどういった意味を持っているのかを伝えることができるため、SEOとして検索クエリとの関連性を高めることができるでしょう。

ホームページ制作作成の際、ページ内で「用語」を定義する場合は、定義型のHTMLマークアップを施します。

この場合、定義する用語と用語の説明といったように、HTMLにはセットで記述すべきタグがあります。

ホームページ制作において、こうしたHTMLタグの意味を十分に理解して正確にマークアップしていくことで、ページの品質は向上し、SEOの効果も期待することができるでしょう。

略語

現在のホームページ（ウェブサイト）制作において、専門用語やアルファベットの略語を正確に伝えることは、ユーザーの利便性と検索エンジンの評価の両面において重要です。HTMLタグの「abbr」と「acronym」は、テキスト内に登場する略語が本来どのような意味を持っているのかを明示するために使用されます。

「abbr」タグは「abbreviation」の略であり、一般的な略語全般を示す際に使用します。一方、「acronym」タグは、頭文字を繋げて一つの単語のように発音する略語（WHOやNATOなど）を示すために使われていました。しかし、HTMLの標準規格がHTML5へと移行するに伴い、「acronym」タグは廃止されました。そのため、現在ではどのような略語であっても、すべて「abbr」タグに統一して記述することが推奨されています。タグの中に「title属性」を用いて正式名称を記述しておけば、ユーザーがパソコンで文字の上にマウスカーソルを合わせた際に、正式な名称が小さな枠（ツールチップ）で表示されます。

より専門的には、このタグを適切に活用することは、SEO（検索エンジン最適化）とWebアクセシビリティの向上に大きく貢献します。検索エンジンのロボット（クローラー）に対して略語の正確な意味をデータとして伝えることで、ページ内のコンテンツの専門性やキーワードの関連性をより正しく認識させることが可能になります。また、視覚に障害があり音声読み上げソフト（スクリーンリーダー）を利用しているユーザーに対しても、略語のアルファベットを意味不明な単語として読み上げるのを防ぎ、設定した正式名称で正確に情報を届けることができます。事業用のホームページ（ウェブサイト）において、閲覧するすべてのユーザーや検索エンジンに対して、分かりやすく質の高いコンテンツを提供するための基本的なマークアップ手法と言えます。

<abbr>（アブリーヴィエイション）

<abbr></abbr>

ホームページ制作において<abbr>（アブリーヴィエイション）タグを使用することによって、略語（頭字語以外）であることを示すことができます。元々は、頭字語以外の略語用でしたが、html5からは頭字語でも使用します。業界特有の略語や頭字語をマークアップし、その正式名称を明示するためのタグがabbrタグです。

<abbr> 略語（頭字語以外）

Abbreviation（アブリーヴィエイション）。略語。タグで囲まれた語句が略語であることを示します。
文章に構造的な意味付けをする要素で、短縮された用語であることを示す場合に用います。
ブラウザ上では用語の下に点線が表示されます。
用語の上にカーソルを合わせると、title属性で指定した用語（正規表現の用語）が表示されます。

頭字語以外の略語用でしたが、<acronym>のhtml5での廃止により、頭字語でも使用します。

abbrタグは、HTMLやSEOといったアルファベットの略語や、事業特有の短縮語を記述する際に使用します。このタグの最大の特徴は、title属性を用いてその略語の正式名称（フルスペル）を指定できる点です。例えば、「SEO」という単語をabbrタグで囲み、title属性に「Search Engine Optimization」と記述することで、ブラウザ上でユーザーがその単語にマウスカーソルを合わせた際に、正式名称をツールチップとして表示させることができます。

title

title=””

タイトル属性

略語の元の意味を明示し、ユーザービリティを向上させる

専門的なコンテンツになるほど、略語の登場頻度は高くなります。しかし、すべてのユーザーがその略語の意味を理解しているわけではありません。略語を多用すると、初心者やその分野に明るくない読者にとって難解な文章になってしまい、直帰率の悪化を招くおそれがあります。そこでabbrタグを活用し、初出の際に正式名称を補足することで、専門性を保ちながらも幅広いユーザーに配慮した親切なホームページ（ウェブサイト）を構築できます。

<abbr></abbr>

ホームページ制作・SEOの1ポイント

元々のHTMLでのウェブサイトは、インターネットを通じて表示する文書としての意味合いが強く、それぞれのテキスト部分が持つ属性を示すためのタグがたくさんあります。そのほとんどは特に厳密に示す必要が無いものですが、示すことでSEOにプラスに働くものもあります。

<acronym>（アクロニム）

<acronym></acronym>

ホームページ制作（ウェブサイト制作）の際に使用する<acronym>タグについてのご説明です。

ホームページ制作において<acronym>（アクロニム）タグを使用することによって、頭文字言葉、略語（頭字語）であることを示すことができます。

<acronym> 頭文字言葉、略語（頭字語）

acronym（アクロニム）。頭文字言葉。<acronym>タグは、頭文字をとった略語で１つの単語として形成されているものを示すタグです。
文章に構造的な意味付けをする要素で、短縮された用語であることを示す場合に用います。
ブラウザ上では用語の下に点線が表示されます。

読み方　アクロニム

廃止。

代替タグ　⇒<abbr>

ホームページ制作・SEOの1ポイント

ホームページに記載するテキストは、特にマークアップを施さずそのままでも表示自体にはそれほど問題はありませんが、正確に要素の意味を示すことで検索エンジンの解析を助けることになります。こうしたことがSEOの原則であると考えることができます。

（初回投稿日 2012年5月25日）

ホームページ（ウェブサイト）制作・作成に役立つHTMLタグ一覧は
⇒html5 tag reference index ホームページ制作の基本タグ

ホームページ（ウェブサイト）のHTML編集方法

ホームページのHTML編集方法について。ホームページ（ウェブサイト）は基本的にHTMLで構成されています。かつてはHTML単独でHTMLの文書スタイルを設定していましたが、現代ではページの基本構成はHTMLで、外観はスタイルシート・CSSで設定されています。ホームページ制作・作成、ホームページ修正の基本はこのHTMLとCSSの編集で行います。

ホームページのHTML編集方法