<address> 태그 – 연락처와 저작권 정보 표현하기

 

 

안녕하세요 😊
HTML5에서 제공하는 시맨틱 태그 중에는 잘 쓰이지 않지만, 특정 상황에서 아주 유용한 태그가 있습니다.
바로 <address> 태그입니다.

 

많은 분들이 <address>를 단순히 “주소(도로명주소)”를 표시할 때만 쓰는 줄 아시는데요,
사실은 웹 문서 작성자·저작자에 대한 연락처, 출처, 저작권 정보를 표현하는 데 쓰입니다.

---

📍 1. <address> 태그란?

• 문서나 아티클 작성자의 연락처 정보를 나타냅니다.
• 전화번호, 이메일, 회사 주소, 웹사이트 링크, 저작권 정보 등을 포함할 수 있습니다.
• HTML Living Standard에 따르면, 단순히 실제 우편 주소만을 의미하지 않습니다.

예시:

 

<address>
  Written by <a href="mailto:webmaster@example.com">홍길동</a><br>
  Visit us at:<br>
  https://www.example.com<br>
  서울특별시 강남구 테헤란로 123
</address>

 

👉 브라우저 기본 스타일은 기울임꼴(italic)로 표시됩니다.

---

📍 2. <address> 태그의 특징

• 보통 footer 영역이나 글 하단에 들어갑니다.
• <footer>와 함께 쓰이는 경우가 많습니다.
• 단순한 연락처 외에도 저작권 문구에 활용할 수 있습니다.

예시:

 

<footer>
  <address>
    © 2025 MyCompany. Contact: support@mycompany.com
  </address>
</footer>

---

📍 3. <address> 태그와 다른 태그 차이

태그	용도
<p>	일반 문단
<footer>	문서나 구역의 바닥 정보
<address>	작성자·저작권자 연락처, 출처 정보

👉 footer는 “영역의 끝부분”을 나타내고, 그 안에 **연락처 정보만 따로 담는 태그가 <address>**입니다.

---

📍 4. 스타일링 예시

<address>는 기본적으로 italic 처리되므로, 사이트 디자인에 맞게 CSS로 스타일을 지정하는 경우가 많습니다.

 

address {
  font-style: normal;
  font-size: 0.9rem;
  color: #666;
  line-height: 1.6;
}

 

👉 기울임을 없애고 회색 글씨로 표현하면 깔끔하게 “부가 정보” 느낌을 줄 수 있습니다.

---

📍 5. 언제 사용하면 좋을까?

• 회사 웹사이트 하단에서 대표 이메일, 고객센터 전화번호 안내
• 개인 블로그 글 하단에서 작성자 정보 표시
• 문서의 저작권 안내나 출처 표기

---

✅ 마무리

<address> 태그는 단순히 “주소”를 표시하는 게 아니라,
연락처·저작권·출처 정보를 시맨틱하게 표현할 수 있는 유용한 HTML 태그입니다.

 

검색엔진이나 보조기기도 <address>의 의미를 인식하기 때문에,
접근성과 SEO 측면에서도 긍정적인 효과가 있습니다.
앞으로 footer 작성 시 꼭 활용해 보시길 추천드립니다.