<address>

By raae for Semantic Advent | December 6, 2023

I was today years old when I learned that <address> means contact information 🤪

The <address> HTML element indicates that the enclosed HTML provides contact information for a person or people, or for an organization.
MDN Docs

I thought <address> was meant for physical addresses, as in the address for a restaurant on its homepage. But boy, was I wrong. URLs, email addresses, phone numbers, social media handles, geographic coordinates, and so forth are valid contact information.

The information wrapped in <address> will be considered the contact information for the nearest <article> or <body> ancestor.

It can even be used to indicate information about the author of an article! Not me wanting to update the Semantic Advent article template to wrap the author link in <address>...

<article>
    <header>
      <h1>The title</h1>
      <address>By <a href=`https://github.com/theauthor>@theauthor</a></address>
    </header>
    <p>The article...</p>
</article>

For some reason, <address> is styled the same as <em>, i.e. cursive letters. You'll probably want to change that back to a normal font style. Especially if it's a longer <address>:

<address>
  Let me know what you think,
  <a href="https://twitter.com/raae">send me a DM</a> with your thoughts.<br />
  
  If you see any bugs, please
  <a href="https://github.com/queen-raae/semantic-advent">file an issue on Github</a>.<br />

  You may also surprise med with a Christmas card:<br />
  Benedicte Raae<br />
  Tromsøgata 26<br />
  0565 Oslo<br />
  Norway
</address>