address 要素連絡先情報を表す

address 要素は、直近の祖先となる article 要素、または body 要素に対する連絡先情報を表します。

直近の先祖となる要素が body 要素の場合、address 要素でマークアップされた連絡先情報は、文書全体に対する連絡先情報となります。article 要素の場合は、各記事に個別の連絡先情報を付与することができます。複数の著者で運営される Web サイトなどでは、使い分けることで、Web サイト全体に対する連絡先と、個別の記事に対する連絡先を明示することが可能です。

さらに詳細な説明を見る

サンプルソースを見る

address 要素の仕様

カテゴリ
コンテンツモデル

ただし、子孫にヘッディング・コンテンツ、セクショニング・コンテンツ、header 要素footer 要素、address 要素を含むことはできません。

この要素を使用できる文脈

フロー・コンテンツが期待される場所

この要素で使用できる属性
DOM インタフェース
Uses HTMLElement.

詳細説明

HTML5 における address 要素は、明確にその文書、あるいは記事の連絡先となる情報のみをマークアップするための要素となります。例えば、連絡先以外に文書の公開日など、連絡先とは関係のない情報を入れてはいけません。

また、文書や記事の中で、その文書や記事の連絡先とは関係のない住所、電話番号、メールアドレスなどが出てくる場合にも、これらを address 要素でマークアップすることは適切ではありません。あくまで、文書、記事に対する連絡先情報を示すものとして使用しましょう。

HTML5 では、address 要素のコンテンツモデルはフロ・ーコンテンツです。従って HTML 4.01 などにおける address 要素とは異なり、p 要素div 要素なども内包することが可能になりました。ただし、ヘッディング・コンテンツ (h1 ~ h6)、セクショニング・コンテンツ (section 要素や aside 要素)、header 要素、footer 要素、address 要素を含むことはできません。

address 要素のサンプルソース

<!-- footer 要素内で文書に対する連絡先を記述した例 -->
<footer>
 <address>
  このサイトに関するお問い合わせ先:
  <a href="mailto:japan@example.com">日本太郎</a>
 </address>
 <p><small>&copy; copyright 2013 Example Corp.</small></p>
</footer>
<!-- 下記のような記述も可能です -->
<footer>
 <address>
  <p>このサイトに関するお問い合わせは下記のいずれかにお願いします。</p>
  <ul>
  <li><a href="mailto:world@example.com">世界太郎</a></li>
  <li><a href="mailto:japan@example.com">日本太郎</a></li>
  <li><a href="mailto:kanto@example.com">関東太郎</a></li>
  </ul>
 </address>
 <p><small>&copy; copyright 2013 Example Corp.</small></p>
</footer>
<!-- 下記のように記述することで、記事に対する連絡先情報となります -->
<article id="article-123">
 <h1>プレスリリース</h1>
 <p>本文</p>
 <footer>
  <address>
   本プレスリリースに関するお問い合わせ先:
   <a href="mailto:japan@example.com">日本太郎</a>
  </address>
 </footer>
</article>

W3C HTML5 仕様書

4.4.10 The address element