CSS_구조(시멘틱태그)

구조 : 일반적인 페이지는 대체로 3단, 4단으로 짠다.
각 페이지마다 어떤 데이터를 넣을 건지 생각하고 구조를 짜야 한다.

• ★헤더 : 제일 먼저 보여줘야 하는 정보들 나열 (로고, 서치바, 로그인)
• 메뉴바 : 헤더 안에 포함되도 된다.
• ★본문 : 실제 필요한 정보들(컨텐츠)
• ★푸터 : 회사정보나 사이트에 대한 정보

시멘틱태그 - html5에서 추가된 태그

• 아무의미 없는 DIV와 같다(여백같은 기본 CSS가 없다.)
• 사람, 컴퓨터한테 태그 이름만으로 해당 박스가 어떤 박스인지 구분하기 쉽게 해준다.
• 종류 :
  1. main : 중요부분 명시. 기존의 wrap 부분을 대체하기도 함.
     2. header : 화면 상단, 각 섹션(박스)의 상단
     3. nav : 메뉴바, 네이게이션 바
     - GNB : global navigation bar
     - 모든 페이지에서 똑같이 나오는 메뉴바
     • LNB : local navigation bar
       - 각 페이지마다 다르게 나오는 메뉴바
       4. section : 본문(각 영역, 박스)
       5. article : 본문(본문 안의 본문) (잘 안씀)
       -> section, article은 같은 느낌이다. 본문 단락 나누는 거.
       6. aside : 화면 좌우에 들어가는 박스
       7. footer : 화면 하단, 각 영역의 하단
• 시멘틱태그를 써도 class를 다 쓰기 때문에 중요도가 높진 않다.