페이지 헤더는 페이지의 상단 영역을 지칭합니다. 다양한 요소들을 포함하여 사용할 수 있습니다.
Usage
페이지 헤더를 통해 사용자에게 필요한 핵심 정보를 제공합니다.
•
사용자가 쉽게 페이지를 파악하고 이용할 수 있도록 일관된 페이지 헤더를 사용합니다.
•
페이지 유형별로 헤더를 구성하여 사용합니다.
Variants
업종, 제품 등 일반적인 콘텐츠 제공 유형의 페이지에서 사용합니다.
1.
브레드크럼이 위치합니다.
2.
현재 페이지에 종속된 하위 계층 메뉴를 탭 패널 방식으로 표시합니다.
3.
타이틀을 표시합니다. 현재 선택된 메뉴명을 타이틀로 사용합니다.
제품(grade)의 상세 정보를 제공하는 페이지에서 사용합니다.
1.
타이틀을 표시합니다.
2.
버튼 그룹이 위치합니다.
3.
브레드크럼이 위치합니다.
기술협업, 주문 등의 목록 페이지에서 사용합니다.
1.
로컬 네비게이션이 위치합니다. 해당 페이지의 타이틀은 로컬 네비게이션의 현재 메뉴 레이블로 대신합니다.
2.
CTA 버튼이 위치합니다.
3.
필터, 검색, 정렬 등의 목록 컨트롤이 위치하는 영역입니다.
기술협업, 주문 등의 상세 페이지에서 사용합니다.
1.
닫기 버튼과 타이틀을 표시합니다. 해당 건의 제목을 타이틀로 사용합니다.
2.
CTA 버튼, 아이콘 버튼 등이 위치합니다.
3.
이전, 다음 단계로 화면을 전환하는 컨트롤이 위치합니다.
Guidelines
•
타이틀은 페이지에 해당하는 메뉴명을 사용합니다.
•
헤더 내에 각 요소는 지정된 위치에서만 사용하는 것을 원칙으로 합니다.