내비게이션 바Navigation Bar
한 줄 정의
내비게이션 바는 사이트 맨 위에 로고와 주요 메뉴를 한 줄로 늘어놓아, 방문자가 어느 페이지에 있든 원하는 페이지로 옮겨 갈 수 있게 해 주는 메뉴 막대예요.
쉽게 말하면
사이트 맨 위에 로고가 있고 그 옆에 '회사 소개' · '상품' · '문의' 같은 메뉴가 한 줄로 놓인 막대가 내비게이션 바예요. 방문자는 지금 어느 페이지를 보고 있든 이 막대에서 다른 페이지로 옮겨 갈 수 있어요. 사이트의 모든 페이지에 같은 메뉴가 같은 자리에 놓이기 때문에, 사이트 전체에 공통으로 쓰는 메뉴라는 뜻으로 GNB(글로벌 내비게이션 바)라고도 불러요.
메뉴는 어떻게 정하나요
- 메뉴 이름은 방문자가 찾는 말로 지어요. '스토리'보다 '회사 소개'라고 써야 방문자가 누르기 전에 무슨 페이지인지 짐작할 수 있어요
- 메뉴 수를 줄여요. 메뉴가 늘어나면 방문자가 원하는 메뉴를 찾기까지 읽어야 하는 이름도 함께 늘어나요
- 하위 메뉴가 있다면 상위 메뉴 아래에 드롭다운 메뉴로 묶을 수 있어요
- 휴대폰처럼 화면이 좁은 기기에서는 메뉴를 한 줄에 다 놓기 어려워서, 메뉴를 햄버거 메뉴 안에 접어 두기도 해요
큐샵에서는
클래식 에디터와 스튜디오 에디터 모두에서 헤더를 만들어 내비게이션 바를 꾸밀 수 있어요. 헤더에 들어갈 메뉴도 손쉽게 설정할 수 있어요.
헷갈리는 말
| 헷갈리는 말 | 뜻 | 내비게이션 바와 다른 점 |
|---|---|---|
| 헤더 | 페이지 맨 위 영역 전체 | 헤더는 영역이고, 내비게이션 바는 그 안에 놓이는 메뉴 막대예요. 헤더에는 메뉴 말고도 로고 · 검색창 · 장바구니 버튼이 함께 들어갈 수 있어요 |
| LNB | 특정 메뉴 안에서만 보이는 하위 메뉴 막대(로컬 내비게이션 바) | GNB는 사이트 어디서나 같고, LNB는 방문자가 들어간 메뉴에 따라 내용이 바뀌어요 |
같은 말
아래 이름으로도 불러요. 모두 같은 뜻이에요.
네비게이션 바GNB
