GNB, LNB, SNB가 뭐야?

djunnni·2022년 1월 16일
0

FE

목록 보기
1/6
post-custom-banner

도입

디자이너와 협업을 하다보면 GNB, LNB, SNB 이야기가 나온다. 한 번 알아보자

뭐지? Header와 Sidebar면 되지 않나? 이런생각이 들지만 용어는 개발자와 디자이너 등 다양한 부분에서 다른 어휘로도 쓰일 수 있어 미리 준비해보는게 좋다.

그게 뭐야?

  • GNB

GNB는 Global Navigation Bar다. 주로 사이트에 들어갔을 때, 헤더라고 불리는 부분이다.

사이트 최상위 전체 공통 네비게이션
메인메뉴 · 대분류 메뉴 · 전체사이트에서 사용되는 공통메뉴바
대부분 상단에 위치

  • LNB

LNB는 2가지 의미를 가지고 있다.

1번째는 Local Navigation Bar다.

GNB를 누를 경우 소제목 형식으로 나오는 메뉴
현재 서비스 영역(Local)만 해당
네비게이션을 통해 특정 지역으로 가는 네비게이션 바
서브메뉴 · 중분류 메뉴 등 분류 별로 사용 됨

2번째는 Left Navigation Bar다.

SNB가 Left에 위치해 있을 때, LNB라고도 부름

  • SNB

SNB는 Side Navigation Bar다.

메인메뉴 · 서브메뉴 를 제외한 나머지 사이드 메뉴
보편적으로 왼쪽에 많이 있어 LNB(Left Navigation Bar) 라고 도 함
기타메뉴바 라고도 함

  • FNB

FNB는 Footer Navigation Bar다

하단메뉴 · 하단로고 · 주소 · 카피라이팅 영역

profile
https://djunnni.tistory.com/ 로 이전합니다.
post-custom-banner

0개의 댓글