[HTML] 구조설계 시맨틱 태그(Semantic Tag) 활용 - <header> <nav> <main> <article> <section> <aside> <footer>
📌 시맨틱 태그 활용한 웹사이트 구조시맨틱 태그를 활용하면 웹사이트 구조를 명확하게 정의하고, 검색 엔진 최적화(SEO) 도움이 됩니다. 로고 GNB 내비게이션 메뉴 섹션 1 섹션 2 섹션 3 푸터 📌 시맨틱 태그 종류, , , 각각 헤더, 주요 콘텐츠, 사이드바, 푸터에 사용됩니다. 머리, 몸통, 발, 사이드바 역할헤더 - header사이트의 로고, 제목 등 위치메뉴 - 는 GNB 등 내비게이션 메뉴를 묶는 데 사용되며, 보통 과 함께 나타납니다. 은 순서 없는 목록으로 를 하위 태그로 사용하고, 은 순서 있는 목록으로 동일하게 를 사용합니다. navigation사이트의 메뉴..
2024. 10. 22.
단축키
내 블로그
| 내 블로그 - 관리자 홈 전환 |
Q
Q
|
| 새 글 쓰기 |
W
W
|
블로그 게시글
| 글 수정 (권한 있는 경우) |
E
E
|
| 댓글 영역으로 이동 |
C
C
|
모든 영역
| 이 페이지의 URL 복사 |
S
S
|
| 맨 위로 이동 |
T
T
|
| 티스토리 홈 이동 |
H
H
|
| 단축키 안내 |
Shift + /
⇧ + /
|
* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.
