HTML 시맨틱: 모든 113개 요소의 간단한 설명
Source: Dev.to
a
a 요소에 href 속성이 있으면, 해당 요소는 내용으로 라벨링된 하이퍼링크(하이퍼텍스트 앵커)를 나타냅니다. a 요소에 href 속성이 없으면, 해당 요소는 링크가 있었을 경우를 위한 자리표시자 역할을 하며, 단지 요소의 내용만으로 구성됩니다.
abbr
abbr 요소는 약어나 두문자어를 나타내며, 선택적으로 그 확장을 포함할 수 있습니다. title 속성을 사용해 약어의 확장을 제공할 수 있습니다. 속성이 지정된 경우, 그 값은 약어의 확장만을 포함해야 하며 다른 내용은 포함해서는 안 됩니다.
address
address 요소는 가장 가까운 article 또는 body 요소 조상의 연락처 정보를 나타냅니다. 만약 그 조상이 body 요소라면, 연락처 정보는 문서 전체에 적용됩니다.
area
area 요소는 이미지 맵에서 텍스트와 해당 영역을 연결하는 하이퍼링크이거나, 클릭이 불가능한(dead) 영역을 나타냅니다.
article
article 요소는 문서, 페이지, 애플리케이션 또는 사이트 내에서 완전하거나 자체 포함된 구성을 나타내며, 원칙적으로 독립적으로 배포하거나 재사용할 수 있습니다(예: 신디케이션). 포럼 글, 잡지·신문 기사, 블로그 글, 사용자 제출 댓글, 인터랙티브 위젯·가젯, 혹은 기타 독립적인 콘텐츠 항목이 될 수 있습니다.
aside
aside 요소는 페이지 내에서 주변 콘텐츠와는 약간 동떨어진 내용으로, 별도의 섹션으로 간주될 수 있는 부분을 나타냅니다. 이러한 섹션은 인쇄된 타이포그래피에서 종종 사이드바 형태로 표현됩니다.
audio
audio 요소는 사운드 또는 오디오 스트림을 나타냅니다.
b
b 요소는 추가적인 중요성을 전달하지 않으며, 대체 음성이나 분위기의 암시 없이 실용적인 목적을 위해 주의를 끌고자 하는 텍스트 구간을 나타냅니다. 예를 들어 문서 초록의 핵심어, 리뷰의 제품명, 인터랙티브 텍스트 기반 소프트웨어의 동작 단어, 기사 리드 등이 해당됩니다.
base
base 요소는 URL 파싱을 위한 문서 기본 URL과 하이퍼링크를 따라갈 때 사용할 기본 탐색 대상의 이름을 지정하도록 저자에게 허용합니다. 이 요소는 이 정보 외에 어떠한 콘텐츠도 나타내지 않습니다.
bdi
bdi 요소는 양방향 텍스트 포맷팅을 위해 주변 텍스트와 격리되어야 하는 텍스트 구간을 나타냅니다.
bdo
bdo 요소는 자식 요소들의 명시적인 텍스트 방향성을 제어합니다. 저자는 유니코드 양방향 알고리즘을 무시하고 명시적으로 방향을 지정할 수 있습니다.
blockquote
blockquote 요소는 다른 출처에서 인용된 구간을 나타냅니다.
body
body 요소는 문서의 내용을 나타냅니다.
br
br 요소는 줄 바꿈을 나타냅니다.
button
button 요소는 내용으로 라벨링된 버튼을 나타냅니다.
canvas
canvas 요소는 높이와 너비 속성으로 정의된 그릴 수 있는 영역을 나타내며, 스크립트를 통해 실시간으로 그래픽을 렌더링하는 데 사용할 수 있습니다.
caption
caption 요소는 부모가 table 요소인 경우 그 테이블의 제목을 나타냅니다.
cite
cite 요소는 작품의 제목을 나타냅니다(예: 책, 논문, 에세이, 시, 악보, 노래, 대본, 영화, TV 프로그램, 게임, 조각, 회화, 연극, 오페라, 뮤지컬, 전시, 법률 사례 보고서, 컴퓨터 프로그램 등). 이는 상세히 인용·참조되는 작업일 수도 있고, 단순히 언급되는 작업일 수도 있습니다. 사람의 이름은 작품 제목이 아니므로(cite 요소는 사람 이름을 마크업하는 데 사용해서는 안 됩니다).
code
code 요소는 컴퓨터 코드 조각을 나타냅니다. 여기에는 XML 요소 이름, 파일명, 프로그램, 혹은 컴퓨터가 인식할 수 있는 기타 문자열이 포함될 수 있습니다.
col
col 요소가 부모를 가지고 그 부모가 colgroup 요소이며, 그 colgroup 요소의 부모가 table 요소인 경우, col 요소는 해당 colgroup이 나타내는 하나 이상의 열을 의미합니다.
colgroup
colgroup 요소는 부모가 table 요소인 경우 그 테이블 내에서 하나 이상의 열을 그룹화한 것을 나타냅니다.
data
data 요소는 내용 자체와 value 속성에 포함된 기계가 읽을 수 있는 형태의 값을 함께 나타냅니다.
datalist
datalist 요소는 다른 컨트롤을 위한 사전 정의된 옵션을 나타내는 option 요소들의 집합을 나타냅니다. 렌더링 시 datalist 요소는 화면에 아무것도 표시되지 않으며, 자식 요소와 함께 숨겨져야 합니다.
dd
dd 요소는 설명 리스트(dl 요소) 내에서 용어‑설명 그룹의 설명·정의·값을 나타냅니다.
del
del 요소는 문서에서의 삭제를 나타냅니다.
details
details 요소는 사용자가 추가 정보나 컨트롤을 얻을 수 있는 공개 위젯을 나타냅니다.
dfn
dfn 요소는 용어의 정의 인스턴스를 나타냅니다. dfn 요소의 가장 가까운 조상인 단락, 설명 리스트 그룹, 혹은 섹션은 해당 용어에 대한 정의를 포함해야 합니다.
dialog
dialog 요소는 애플리케이션의 일시적인 부분을 나타내며, 작은 창(“대화 상자”) 형태로 사용자가 작업을 수행하거나 정보를 수집하도록 합니다. 사용자가 작업을 마치면 애플리케이션이 자동으로 닫거나 사용자가 수동으로 닫을 수 있습니다.
div
div 요소는 특별한 의미가 없습니다. 자식 요소들을 단순히 나타냅니다. class, lang, title 속성과 함께 사용해 연속된 요소 그룹에 공통된 의미를 마크업할 수 있습니다. 또한 dl 요소 안에서 dt와 dd 그룹을 감싸는 용도로도 사용할 수 있습니다.
dl
dl 요소는 0개 이상의 이름‑값 그룹(설명 리스트)으로 구성된 연관 리스트를 나타냅니다. 이름‑값 그룹은 하나 이상의 이름(dt 요소, 필요 시 div 자식) 뒤에 하나 이상의 값(dd 요소, 필요 시 div 자식)이 따라오며, dt와 dd가 아닌 다른 노드는 무시됩니다. 하나의 dl 안에서는 각 이름마다 dt 요소가 하나만 있어야 합니다.
dt
dt 요소는 설명 리스트(dl 요소) 내에서 용어‑설명 그룹의 용어 또는 이름 부분을 나타냅니다.
em
em 요소는 내용에 대한 강조(스트레스)를 나타냅니다.
embed
embed 요소는 외부 애플리케이션이나 인터랙티브 콘텐츠를 통합하기 위한 지점을 제공합니다.
fieldset
fieldset 요소는 캡션이 있을 수 있는 폼 컨트롤(또는 기타 콘텐츠) 집합을 나타냅니다. 캡션은 fieldset 요소의 첫 번째 legend 자식 요소에 의해 제공됩니다(존재하는 경우). 나머지 자손들은 그룹을 형성합니다.
figcaption
figcaption 요소는 부모 figure 요소의 나머지 콘텐츠에 대한 캡션이나 레전드를 나타냅니다(존재하는 경우).
figure
figure 요소는 캡션이 있을 수도 있는 흐름 콘텐츠를 나타내며, 자체적으로 완전한(예: 한 문장) 단위이며 일반적으로 하나의 단위로 참조됩니다.