HTML

Semantics Tag(시맨틱 태그)

FE묭묭 2022. 9. 7.

article

- 문서, 페이지, 애플리케이션, 또는 사이트 안에서 독립적으로 구분해 배포하거나 재사용할 수 있는 구획을 나타냅니다. 사용 예제로 게시판과 블로그 글, 매거진이나 뉴스 기사 등이 있습니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/article

aside

- 문서의 주요 내용과 간접적으로만 연관된 부분을 나타냅니다. 주로 사이드바 혹은 콜아웃 박스로 표현합니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/aside

details

- "열림" 상태일 때만 내부 정보를 보여주는 정보 공개 위젯을 생성합니다. 요약이나 레이블은 <summary> 요소를 통해 제공할 수 있습니다.

정보 공개 위젯은 보통 레이블 옆의 작은 삼각형이 돌아가면서 열림/닫힘 상태를 나타냅니다. <details> 요소의 첫 번째 자식이 <summary> 요소라면, <summary>의 콘텐츠를 위젯의 레이블로 사용합니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/details

figure

- 독립적인 콘텐츠를 표현합니다. <figcaption> 요소를 사용해 설명을 붙일 수 있습니다. 피규어, 설명, 콘텐츠는 하나의 단위로 참조됩니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/figure

figcaption

부모 <figure> 요소가 포함하는 다른 콘텐츠에 대한 설명 혹은 범례를 나타냅니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/figcaption

footer

- 가장 가까운 구획 콘텐츠나 구획 루트의 푸터를 나타냅니다. 푸터는 일반적으로 구획의 작성자, 저작권 정보, 관련 문서 등의 내용을 담습니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/footer

header

- 소개 및 탐색에 도움을 주는 콘텐츠를 나타냅니다. 제목, 로고, 검색 폼, 작성자 이름 등의 요소도 포함할 수 있습니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/header

main

- 문서 <body>의 주요 콘텐츠를 나타냅니다. 주요 콘텐츠 영역은 문서의 핵심 주제나 앱의 핵심 기능에 직접적으로 연결됐거나 확장하는 콘텐츠로 이루어집니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/main

mark

-  맥락에 관련이 깊거나 중요해 표시 또는 하이라이트한 부분을 나타냅니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/mark

nav

- 문서의 부분 중 현재 페이지 내, 또는 다른 페이지로의 링크를 보여주는 구획을 나타냅니다. 자주 쓰이는 예제는 메뉴, 목차, 색인입니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/nav

section

- HTML 문서의 독립적인 구획을 나타내며, 더 적합한 의미를 가진 요소가 없을 때 사용합니다. 보통 <section>은 제목을 포함하지만, 항상 그런 것은 아닙니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/section

summary (요약)

-  ("상세") 요소의 공개 상자에 대한 요약, 캡션 또는 범례를 지정한다. <요약> 요소를 클릭하면 부모 <상세> 요소의 상태가 열리거나 닫힌다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/summary

time

- 시간의 특정 지점 또는 구간을 나타냅니다. datetime 특성의 값을 지정해 보다 적절한 검색 결과나, 알림 같은 특정 기능을 구현할 때 사용할 수 있습니다.

https://developer.mozilla.org/ko/docs/Web/HTML/Element/time

 

댓글