<address>連絡先を示す

<address>タグは、webページの内容に関する連絡先・問合せ先を示す要素です。 <address>にもっとも近い先祖のarticle要素、あるいはbody要素の連絡先情報を示します。

<address>に入れる内容としては、メールアドレスやその他の連絡を取るための情報などを入れる事ができます。

また「address」という単語から住所に関するものを入れるように感じるかもしれませんが、文章中に住所が出てきたからと言ってaddress要素を使用するのは間違いです。 一般的な住所には、<p>タグなどを使用するようにします。 <address>には連絡先以外の情報を含む事はできません。

含む内容としては、一般的にはメールアドレスや問合せフォームへのリンクなどがふさわしいでしょう。 性質上<address>はfooter要素の中で使われる事が多くなります。

なお一般的なブラウザでは、address要素の内容をイタリックで表示します。 標準の字体で表示させたい場合は次のようにスタイルを指定して下さい。

address {font-style: normal;}

HTML5での変更点

HTML5の場合、<address>がarticle要素に含まれている場合は、そのarticle要素の内容に関する連絡先となります。 article要素に含まれていない場合は、HTML文書全体に関する連絡先となります。

例えば次のような場合であれば、address要素はarticle要素内にあるので、そのarticle要素の連絡先情報を示す事となります。

<body>
  <article>
    <address>
    </address>
  </article>
</body>  

書式

  • <address 属性="値">~</address> ……… 連絡先情報を示す

使用した時の例

<header>
<h1>ミカン</h1>
</header>
<p>和歌山のミカンは有名です。</p>
<footer>
<address>
お問合せ : <a href="mailto:sample@example.co.jp">sample@example.co.jp</a>
</address>
</footer>
<article>
<p>ミカンがオススメです。住所は下記です</p>
<address>住所 : 青森県.....</address>
</article>

<!-- 上記のような使い方は間違いです -->

ブラウザ上の表示例

対応ブラウザなどのデータ

形式 <address>~</address> カテゴリ フローコンテンツ
親要素 子要素にフローコンテンツをもてるもの 子要素 フローコンテンツ
開始タグ 必須 終了タグ 必須
グローバル属性 accesskey / class / contenteditable / contextmenu / dir / draggable / hidden / id / lang / spellcheck / style / tabindex / title / translate
対応ブラウザ Internet Explorer8~ , Google Chrome14~ , Firefox7~ , Opera11.5~ , Safari5.1~