본문 바로가기
728x90
반응형

시멘틱태그2

[HTML] 구조설계 시맨틱 태그(Semantic Tag) 활용 - <header> <nav> <main> <article> <section> <aside> <footer> 📌 시맨틱 태그 활용한 웹사이트 구조시맨틱 태그를 활용하면 웹사이트 구조를 명확하게 정의하고, 검색 엔진 최적화(SEO) 도움이 됩니다. 로고 GNB 내비게이션 메뉴 섹션 1 섹션 2 섹션 3 푸터 📌 시맨틱 태그 종류, , , 각각 헤더, 주요 콘텐츠, 사이드바, 푸터에 사용됩니다. 머리, 몸통, 발, 사이드바 역할헤더  -  header사이트의 로고, 제목 등 위치메뉴  -  는 GNB 등 내비게이션 메뉴를 묶는 데 사용되며, 보통 과 함께 나타납니다. 은 순서 없는 목록으로 를 하위 태그로 사용하고, 은 순서 있는 목록으로 동일하게 를 사용합니다. navigation사이트의 메뉴.. 2024. 10. 22.
[HTML] 시맨틱 태그(Semeantic Tag)란? 📌 시맨틱 태그(Semeantic Tag) 란?Sementic 요소들로 아래와 같이 직관적으로 웹사이트를 구성할 수 있습니다.🔎 시맨틱 태그의 종류태그설명사이트의 머리부분에 사용웹 페이지 메뉴를 만들 때 사용 메인 콘텐츠를 나타내는데 사용 제목별로 나눌 수 있는 문서의 콘텐츠 영역을 구성하는 요소개별 콘텐츠를 나타내는 요소 (여러개 반복되는 요소)좌우측의 사이드 영역사이트의 바닥부분, 주로 연락처나 제작자 정보등을 기술하는 부분 제목과 부제목을 묶어서 나타내는 요소 📌 시맨틱 태그 상세 설명  태그는 보통 사이트의 도입부, 즉 머릿 부분에 사용되며 사이트의 로고나 제목 등을 기술할 때 사용합니다. 하나의 구역이기에  태그 안에 부수적인 태그들이 추가로 들어갈 수 있으며 주로  태그를 사용해 검색.. 2024. 5. 13.
728x90
반응형