HTML에서 약어(abbreviation)나 두문자어(acronym)를 표시하려면 <abbr> 태그를 사용합니다. 약어와 두문자어는 모두 원래 단어를 줄여서 만든 축약형으로, 일련의 문자 형태로 나타냅니다. 대표적인 예로는 "Mr.", "MRP", "GMT", "NASA" 등이 있습니다.
<abbr> 태그에 title 속성을 함께 사용하면, 사용자가 해당 약어 위에 마우스를 올렸을 때 전체 의미가 툴팁 형태로 표시됩니다. 이를 통해 문서의 가독성과 접근성을 한층 높일 수 있습니다.
예제
아래 코드를 실행하면 HTML에서 약어나 두문자어를 표시하는 방법을 직접 확인할 수 있습니다.
<!DOCTYPE html> <html> <head> <title>HTML abbr tag</title> </head> <body> <h1>Timings</h1> <p> We follow <abbr title="Indian Standard Time">IST</abbr> for our webinars. </p> </body> </html>
위 예제에서는 웨비나 일정 안내 문장에 IST라는 약어를 사용하고, title 속성에 "Indian Standard Time"이라는 전체 명칭을 지정했습니다. 이렇게 하면 IST 위에 마우스를 올렸을 때 해당 약어의 정확한 의미를 바로 확인할 수 있습니다.