메뉴건너뛰고 본문 바로가기

카테고리별 웹디자인 벤치마킹 사전 디비딕

데스크탑 모바일앱

서브 틀

기본구조 (GNB기준)

기본구조 (GNB기준)

수평
수직
격자/역격자

영역 나열

영역 나열

세로나열
가로나열
혼용나열
변칙나열 (GNB,VIS)

영역 합침

영역 합침

없음
GNB + Main img
Main img + 메뉴바
Main img + 로케이션바
GNB + 로케이션바
GNB + Title
메뉴바 + 로케이션바

영역 부분겹침

영역 부분겹침

없음
GNB / Main img
Main img / 로케이션바
Main img / 메뉴바
Main img / Page title
메뉴바 / 로케이션바

적용구성

적용구성

Main - img/bg
Main - 생략 img/bg
Main - Copy (단일단적용)
Main - Title (1뎁스 메뉴적용)
Main - Title (2뎁스 메뉴적용)
메뉴바&탭 (2뎁스 메뉴나열)
로케이션바
Page Title (last뎁스)
메뉴바&탭 (3뎁스 메뉴나열)

Main - Title (유형,정렬)

Main - Title (유형,정렬)

유형 - 기본/단일
유형 - 확장 (text/logo)
유형 - 확장(UI요소)
유형 - 확장 (블릿/포인트)
정렬 left
정렬 center
정렬 right

로케이션바 (유형,정렬)

로케이션바 (유형,정렬)

유형 - 기본/단일
유형 - bar + SubMenu
유형 - 확장 (UI 요소)
정렬 left
정렬 center
정렬 right

메뉴바 (유형,배치)

메뉴바 (유형,배치)

유형 - 세로형bar (LNB)
유형 - 가로형bar
유형 - 변형/응용
유형 - GNB서브메뉴 대체
배치 left
배치 center
배치 right