1. 시맨틱 태그
1. 시맨틱 태그란
- 시맨틱(semantic) 의미의, 의미적 뜻을 가진 형용사로 기능은 없고 의미적인 부분만 표현하는 태그
- 시맨틱 태그는 HTML 웹문서 구조를 잡는데 도움을 주는 태그. HTML5에 최초로 등장.
- 시맨틱 태그가 나오기 전에는 웹 문서 구조를 잡을 때 div 태그만 주로 사용.
- header, main, footer, nav, aside ... 등 아무기능 없이 위치를 표시하거나 영역을 나눌 때 사용한다.
- 시맨틱 태그의 종류
- header : 사이트의 헤더 영역을 담당하는 태그
로고, 네브바(메뉴바), 검색창등이 포함
- main : 사이트의 메인 콘텐츠를 표출하는 영역
section, article, aside 등의 시맨틱 태그로 다시 한 번 영역을 나눌 수 있다.
- footer : 사이트의 푸터 영역을 담당하는 태그
일반적으로 전화번호, 팩스번호, 회사 주소 등의 내용을 포함한다.
- nav : 네비게이션(메뉴들)을 만들어주는 태그
- section : 메인 콘텐츠 영역에서 주제별로
영역을 분리하는 역할을 담당하는 태그
- article : 메인 콘텐츠 영역에서 각각의 개별
콘텐츠를 감싸는 태그
- aside : 좌우측 사이드 영역을 표시하는 태그
주로 사이드 메뉴나, 추가정보 등을 표출.
- header : 사이트의 헤더 영역을 담당하는 태그
728x90
'네이버클라우드 캠프 5기 > 학습내용 정리' 카테고리의 다른 글
30. CSS - Selector (0) | 2023.05.26 |
---|---|
29. CSS - CSS란? (0) | 2023.05.26 |
27. HTML - 폼 관련 태그 (0) | 2023.05.26 |
26. HTML - 이미지와 하이퍼링크 (0) | 2023.05.26 |
25. HTML - 테이블을 만들어주는 태그 (0) | 2023.05.26 |