프로 홈페이지의 메뉴 구조 짜기

메뉴는 자료실이 아니라 안내판입니다

회사 홈페이지를 처음 만들 때 가장 많이 하는 실수는 "우리 회사에 있는 자료를 전부 올리자"에서 출발하는 것입니다. 회사 연혁도 있고, 대표 인사말도 있고, 제품 소개서도 있고, 인증서도 있고, 보도자료도 있으니 일단 메뉴를 잔뜩 만들고 싶어집니다. 그런데 방문자는 회사 내부 폴더를 구경하러 온 사람이 아닙니다. 방문자는 아주 단순한 질문을 품고 들어옵니다.

"여기가 믿을 만한 회사인가?"

"내 문제를 해결해 줄 수 있나?"

"비용이나 절차를 물어보려면 어디로 가야 하지?"

메뉴는 이 질문에 답하는 안내판입니다. 고속도로 표지판처럼 짧고, 분명하고, 예측 가능해야 합니다. "회사개요", "사업영역", "레퍼런스", "문의"처럼 방문자가 다음 행동을 바로 떠올릴 수 있어야 합니다. 메뉴 구조만 잘 잡아도 홈페이지는 갑자기 정돈되어 보입니다. 반대로 디자인이 아무리 멋져도 메뉴가 복잡하면 방문자는 길을 잃고, 길을 잃은 방문자는 조용히 나갑니다.

아임웹에서 실제 페이지 디자인은 디자인 모드에서 진행합니다. 이곳에서 페이지를 만들고, 텍스트, 이미지, 버튼, 쇼핑, 게시판, 지도 같은 요소를 추가할 수 있습니다.¹ 그러니 메뉴 구조는 단순히 "상단에 보이는 글자"가 아니라, 앞으로 어떤 페이지를 만들고 어떤 위젯을 배치할지 결정하는 설계도입니다.

회사 홈페이지의 기본 뼈대는 다섯 칸이면 충분합니다

처음부터 정답을 찾으려 하지 마세요. 초보자에게 필요한 것은 완벽한 메뉴가 아니라, 바로 만들 수 있는 기본형입니다. 회사 홈페이지의 1차 메뉴는 보통 다음 다섯 가지로 시작하면 안정적입니다.

여기서 중요한 점은 메뉴명을 그대로 쓰지 않아도 된다는 것입니다. "서비스/제품"이라는 말은 뼈대입니다. 실제 사이트에서는 업종에 맞게 바꿔야 합니다. 제조업이라면 "제품"이 자연스럽고, B2B 소프트웨어 회사라면 "솔루션"이 더 전문적으로 들립니다. 병원이라면 "진료과목", 학원이라면 "교육과정", 인테리어 회사라면 "시공사례"가 방문자에게 더 빠르게 이해됩니다.

즉, 기본 구조는 이렇게 생각하면 됩니다.

이 다섯 칸은 대부분의 회사 홈페이지에 잘 맞습니다. 왜냐하면 방문자의 의사결정 순서와 닮아 있기 때문입니다. 사람은 먼저 회사를 확인하고, 제공하는 것을 살펴보고, 실제 사례로 믿음을 얻은 뒤, 마지막에 문의합니다. 메뉴는 이 흐름을 방해하지 않아야 합니다.

홈은 메뉴가 아니라 출발점입니다

초보자가 자주 헷갈리는 부분이 있습니다. "홈"도 1차 메뉴에 넣어야 할까요? 꼭 그럴 필요는 없습니다. 회사 로고를 누르면 홈으로 이동하게 만드는 것이 일반적입니다. 상단 메뉴에 공간이 넉넉하면 "홈"을 넣어도 되지만, 회사 홈페이지에서는 그 한 칸을 더 중요한 메뉴에 쓰는 편이 낫습니다.

홈페이지의 상단 메뉴, 즉 GNB는 Global Navigation Bar의 줄임말입니다. 쉽게 말해 사이트 어디에서든 보이는 대표 메뉴입니다. GNB는 5개에서 7개 이내로 유지하는 것이 좋습니다. 메뉴가 9개, 10개로 늘어나면 방문자는 선택지가 많다고 느끼는 것이 아니라 "복잡하다"고 느낍니다. 2026년 기준의 좋은 내비게이션은 화려한 효과보다 명확한 이름, 일관된 위치, 빠른 이동, 모바일 적응성을 더 중요하게 봅니다.²

그러니 첫 회사 홈페이지의 상단은 이렇게 생각하면 됩니다.

여기서 핵심은 "문의" 메뉴와 "문의 버튼"을 분리하는 것입니다. 문의 메뉴는 연락처, 위치, 입력폼이 있는 페이지로 가는 통로입니다. 반면 헤더의 버튼은 방문자가 지금 바로 행동하게 만드는 장치입니다. 이 버튼을 CTA라고 부릅니다. CTA는 Call To Action의 약자로, "행동을 요청하는 버튼"이라는 뜻입니다.

예를 들어 일반 메뉴 안에 "상담 신청"을 넣어두면 다른 메뉴와 똑같이 보입니다. 하지만 헤더 오른쪽에 진한 색 버튼으로 "무료 상담 신청"을 두면 방문자는 언제든 바로 클릭할 수 있습니다. 홈페이지의 목적이 문의라면, 이 버튼은 작은 장식이 아니라 매출로 이어지는 문입니다.

업종별 메뉴는 방문자의 결정 순서에 맞춥니다

같은 회사 홈페이지라도 업종이 달라지면 방문자가 확인하는 순서도 달라집니다. 1인 기업을 찾는 사람은 "이 사람이 누구이고 나와 잘 맞을까?"를 먼저 봅니다. 제조업 고객은 "제품 사양과 납품 경험이 충분한가?"를 따집니다. 병원이나 학원 방문자는 "믿을 수 있는 곳인가, 위치는 어디인가, 예약은 쉬운가?"를 빠르게 확인합니다.

아래 표에서 내 업종과 가장 가까운 줄을 골라 시작해 보세요. 완전히 맞지 않아도 괜찮습니다. 중요한 것은 메뉴가 회사 입장이 아니라 방문자의 판단 순서를 따라가야 한다는 점입니다.

여기서 한 가지를 더 기억하세요. "회사소개"가 항상 첫 번째일 필요는 없습니다. B2B 솔루션 회사라면 방문자가 회사를 보기 전에 "우리 문제를 해결할 수 있는가"를 먼저 궁금해할 수 있습니다. 이 경우 첫 메뉴를 "솔루션"으로 두고, 회사소개는 뒤로 보내도 됩니다. 메뉴 순서는 회사가 말하고 싶은 순서가 아니라 방문자가 확인하고 싶은 순서입니다.

메뉴 하나를 페이지 하나로만 생각하지 마세요

"회사소개"라는 메뉴를 만들었다고 해서 그 안에 대표 인사말만 넣으면 아쉽습니다. 메뉴는 문이고, 페이지는 방입니다. 방 안에 무엇을 어떤 순서로 배치하느냐에 따라 신뢰도가 달라집니다.

예를 들어 회사소개 페이지는 다음 흐름으로 설계할 수 있습니다.

서비스/제품 페이지는 방문자가 "그래서 나에게 어떤 도움이 되는데?"를 이해하게 만들어야 합니다. 단순히 제품명을 나열하지 말고, 문제, 해결책, 특징, 사용 대상, 문의 버튼 순서로 구성하면 좋습니다. 포트폴리오나 사례 페이지는 이미지가 중요하므로 갤러리나 카드형 섹션이 잘 어울립니다. 소식이나 자료는 반복해서 업데이트되므로 일반 페이지보다 게시판이 편합니다. 문의 페이지에는 입력폼, 연락처, 지도, 개인정보 동의 안내가 필요합니다.

처음에는 메뉴 이름만 고민하게 되지만, 진짜 실력은 각 메뉴 안의 페이지 흐름에서 드러납니다. 방문자가 위에서 아래로 읽었을 때 자연스럽게 "괜찮은 회사네. 문의해 볼까?"라는 생각이 들면 성공입니다.

아임웹 위젯 성격에 맞게 기능을 배치합니다

아임웹을 처음 열면 위젯이 많아 보입니다. 위젯은 페이지에 올려놓는 기능 블록이라고 생각하면 됩니다. 텍스트 블록, 이미지 블록, 버튼 블록처럼 필요한 조각을 쌓아 페이지를 만드는 방식입니다. 아임웹 공식 가이드에서도 디자인 모드에서 페이지, 텍스트, 이미지, 버튼, 쇼핑, 게시판, 지도 등을 추가할 수 있다고 설명합니다.¹

무엇을 어디에 써야 할지 헷갈린다면 정보의 성격부터 보세요. 자주 바뀌지 않는 정보인지, 반복해서 올릴 정보인지, 이미지 중심인지, 연락을 받아야 하는지에 따라 선택이 달라집니다.

예를 들어 제조업 홈페이지에서 "제품" 메뉴를 만들었다고 가정해 봅시다. 제품이 3개뿐이고 자주 바뀌지 않는다면 일반 페이지에 제품 이미지를 넣고 설명을 정리하면 됩니다. 반대로 제품 수가 많고 계속 추가된다면 카테고리 구조나 게시판형 목록을 고려하는 편이 관리하기 쉽습니다.

학원 홈페이지의 "수강후기"는 일반 페이지에 몇 개만 박아두는 것보다 게시판이나 반복형 구성으로 운영하는 편이 좋습니다. 병원의 "오시는 길"은 긴 설명보다 지도와 주차 안내, 예약 버튼이 더 중요합니다. 회사 홈페이지는 멋있어 보이는 것도 중요하지만, 운영자가 나중에 쉽게 고칠 수 있어야 오래 갑니다.

핵심 5페이지로 먼저 오픈하세요

초보자가 홈페이지를 만들 때 가장 위험한 말은 "이것도 필요하지 않을까?"입니다. FAQ도 필요할 것 같고, 채용도 필요할 것 같고, 자료실도 필요할 것 같고, 제품 상세 페이지도 전부 있어야 할 것 같습니다. 그렇게 메뉴가 늘어나는 순간 작업은 멈춥니다. 빈 페이지가 많아지고, 디자인은 흐트러지고, 공개일은 계속 미뤄집니다.

처음 오픈은 핵심 5페이지면 충분합니다.

소식, 자료실, 채용, FAQ, 상세 제품 페이지는 두 번째 단계에서 확장해도 늦지 않습니다. 홈페이지는 한 번에 완성해서 영원히 두는 인쇄물이 아닙니다. 운영하면서 좋아지는 공간입니다. 처음부터 너무 큰 건물을 지으려 하지 말고, 방문자가 꼭 지나가야 하는 복도와 방부터 열어두세요.

하루 단위로 작업한다면 이렇게 진행할 수 있습니다.

물론 하루 만에 기본 구조를 잡는 것도 가능합니다. 다만 초보자라면 "오늘은 메뉴만", "오늘은 회사소개만"처럼 작업을 작게 나누는 편이 훨씬 덜 지칩니다. 홈페이지 제작은 마라톤처럼 보이지만, 실제로는 레고 블록을 하나씩 끼우는 일에 가깝습니다.

아임웹에서 메뉴 구조를 만드는 실전 순서

이제 실제로 아임웹에서 메뉴를 정리해 봅시다. 2026년 5월 기준으로 아임웹은 AI와 템플릿을 활용해 빠르게 사이트를 시작할 수 있는 흐름을 강조하고 있으며, 다양한 비즈니스 홍보용 템플릿도 제공합니다.³ 하지만 템플릿을 골랐다고 끝이 아닙니다. 템플릿은 집의 인테리어 샘플이고, 메뉴 구조는 우리 회사의 동선입니다. 샘플 그대로 살면 어딘가 어색합니다.

1단계: 템플릿의 메뉴를 먼저 읽습니다

디자인 모드에 들어가면 선택한 템플릿의 페이지와 메뉴가 보입니다. 이때 바로 수정하지 말고, 먼저 전체 메뉴를 읽어보세요. 템플릿은 보통 예쁜 예시 문구와 샘플 페이지를 가지고 있습니다. "About", "Service", "Project", "News", "Contact"처럼 영어로 되어 있을 수도 있고, 쇼핑몰 템플릿이라면 "Shop", "Lookbook", "Review" 같은 메뉴가 있을 수도 있습니다.

여기서 해야 할 일은 예쁜지 평가하는 것이 아니라 "우리 회사 목적에 맞는가"를 보는 것입니다. 2장에서 정한 목적이 견적 문의라면 문의 동선이 강해야 합니다. 목적이 제품 소개라면 제품 메뉴가 빨리 보여야 합니다. 목적이 채용 브랜딩이라면 채용 메뉴가 숨으면 안 됩니다.

2단계: 1차 메뉴를 5개로 줄입니다

메뉴가 많다면 먼저 줄이세요. 처음에는 다음 기본형으로 바꿔도 좋습니다.

이 상태에서 업종 언어로 다듬습니다. 예를 들어 제조업이라면 "서비스/제품"을 "제품"으로, "사례/후기"를 "납품사례"로 바꿉니다. B2B 서비스라면 "서비스/제품"을 "솔루션"으로, "소식/자료"를 "인사이트" 또는 "자료실"로 바꿉니다.

아임웹 디자인 모드에서는 메뉴 관리에서 메뉴명을 수정하는 방식으로 템플릿의 기본 메뉴를 우리 회사에 맞게 바꿀 수 있습니다. 메뉴명을 바꿀 때는 가능하면 주소도 함께 정리하세요. 예를 들어 메뉴명이 "솔루션"이라면 URL도 /solution처럼 짧고 의미 있게 만드는 편이 좋습니다. 한글 주소가 꼭 나쁜 것은 아니지만, 공유하거나 관리할 때는 짧은 영문 주소가 편한 경우가 많습니다.

3단계: 필요 없는 페이지는 과감히 삭제하거나 숨깁니다

템플릿에는 우리 회사에 필요 없는 페이지가 들어 있을 수 있습니다. 예를 들어 회사 홈페이지를 만들고 있는데 장바구니, 상품 상세, 이벤트 페이지가 보일 수 있습니다. 반대로 쇼핑 기능이 필요한 회사라면 제품 판매 페이지가 중요할 수 있습니다.

처음에는 삭제가 두려울 수 있습니다. 그럴 때는 완전히 지우기 전에 메뉴에서 노출하지 않거나, 복제본을 만들어 보관하는 방식으로 진행하세요. 하지만 공개 사이트에는 빈 페이지가 보이면 안 됩니다. "준비중입니다"라는 페이지만 여러 개 있는 홈페이지는 전문적으로 보이지 않습니다. 차라리 메뉴에서 빼두고, 내용이 준비되었을 때 공개하는 편이 훨씬 낫습니다.

4단계: 페이지마다 첫 화면의 역할을 정합니다

각 페이지를 만들기 전에 첫 화면에 무엇을 말할지 정하세요. 방문자는 페이지에 들어오자마자 이곳이 어떤 페이지인지 알아야 합니다.

이 한 문장이 있으면 디자인이 쉬워집니다. 이미지도 고르기 쉬워지고, 버튼 문구도 자연스럽게 나옵니다. 회사소개 첫 화면에 "더 나은 미래를 향한 혁신"처럼 넓은 말만 쓰면 방문자는 무엇을 하는 회사인지 알기 어렵습니다. 멋있는 말보다 구체적인 말이 더 프로답습니다.

5단계: 그리드와 위젯으로 정리합니다

아임웹의 장점은 코딩 없이 섹션과 위젯을 배치하면서 페이지를 만들 수 있다는 점입니다. 공식 가이드에서도 그리드 시스템을 활용해 위젯을 더 보기 좋게 배치하고, 섹션을 나누어 가독성을 높일 수 있다고 안내합니다.¹ 여기서 그리드는 화면을 일정한 칸으로 나누어 콘텐츠를 정렬하는 기준입니다. 쉽게 말해 책상 위에 자를 대고 물건을 가지런히 놓는 것과 같습니다.

프로처럼 보이는 페이지는 대단한 효과보다 정렬이 좋습니다. 제목의 시작점이 맞고, 이미지 크기가 일정하고, 버튼 위치가 반복되면 안정적으로 보입니다. 같은 성격의 콘텐츠는 같은 모양으로 반복하세요. 서비스 카드가 3개라면 제목 길이, 설명 줄 수, 버튼 위치를 최대한 맞추는 것이 좋습니다.

6단계: 모바일 화면에서 다시 줄입니다

PC에서 예쁜 메뉴가 모바일에서 그대로 좋을 것이라고 믿으면 안 됩니다. 모바일에서는 화면이 좁기 때문에 메뉴는 보통 햄버거 아이콘 안으로 들어가고, 긴 문장은 답답해 보입니다. PC에서는 가로로 3개씩 보이던 카드가 모바일에서는 세로로 쌓입니다.

모바일 점검에서는 "다 보이는가"보다 "빨리 이해되는가"를 보세요. 버튼이 손가락으로 누르기 쉬운지, 문의 버튼이 너무 아래에 있지 않은지, 메뉴명이 두 줄로 깨지지 않는지 확인합니다. 특히 CTA 버튼은 모바일에서도 쉽게 보여야 합니다. 전화 문의가 중요한 업종이라면 모바일 하단이나 문의 페이지에 전화 버튼을 분명하게 두는 것이 좋습니다.

메뉴명을 바꾸면 사이트의 인상이 바뀝니다

메뉴명은 작은 글자처럼 보이지만, 회사의 말투를 결정합니다. 같은 페이지라도 "서비스"라고 부를 때와 "솔루션"이라고 부를 때 느낌이 다릅니다. "작업물"보다 "프로젝트"가 더 전문적으로 들릴 수 있고, "후기"보다 "고객사례"가 B2B에서는 더 신뢰감 있게 느껴집니다.

다음처럼 바꿔보면 사이트의 인상이 달라집니다.

단, 너무 독특한 이름은 조심해야 합니다. 예를 들어 회사소개를 "우리의 항해"라고 쓰면 감성적으로는 멋질 수 있지만, 방문자가 바로 이해하지 못할 수 있습니다. 초보자는 메뉴에서 창의력을 발휘하기보다 페이지 안의 표현에서 개성을 보여주는 편이 안전합니다. 메뉴는 시적인 문장이 아니라 표지판입니다.

하위 메뉴는 정말 필요할 때만 만듭니다

하위 메뉴는 1차 메뉴 아래에 펼쳐지는 2차 메뉴입니다. 예를 들어 "회사소개" 아래에 "인사말", "연혁", "조직도", "오시는 길"을 넣는 방식입니다. 큰 회사라면 필요할 수 있지만, 처음 만드는 홈페이지에서는 하위 메뉴가 오히려 부담이 됩니다.

하위 메뉴를 만들기 전에 이렇게 물어보세요.

예를 들어 "연혁"은 독립 페이지보다 회사소개 페이지 중간 섹션으로 넣어도 충분한 경우가 많습니다. "오시는 길"은 문의 페이지 안에 지도와 함께 넣을 수 있습니다. "인증서"는 제조업이나 의료기기 회사처럼 신뢰 증거가 중요한 업종에서는 별도 섹션으로 강조할 수 있지만, 모든 회사가 1차 메뉴로 뺄 필요는 없습니다.

하위 메뉴는 정보가 많을 때 쓰는 도구이지, 있어 보이려고 만드는 장식이 아닙니다.

문의 동선은 메뉴보다 강하게 보여야 합니다

회사 홈페이지의 최종 목표가 문의라면 문의 동선은 절대 숨기면 안 됩니다. 상단 메뉴에 "문의"가 있어도, 방문자가 서비스 페이지를 읽다가 바로 상담하고 싶어질 수 있습니다. 이때 페이지 하단까지 내려가야만 문의할 수 있다면 아쉽습니다.

좋은 회사 홈페이지는 여러 지점에 자연스럽게 문의 버튼을 둡니다.

버튼 문구도 중요합니다. "Submit"이나 "확인"보다 "견적 요청하기", "상담 신청하기", "자료 받아보기"처럼 클릭 후 얻게 되는 결과를 적는 편이 좋습니다. 방문자는 버튼을 누르기 전에 작은 불안을 느낍니다. "누르면 결제되는 건가?", "바로 전화가 오는 건가?", "무엇을 입력해야 하지?" 이런 불안을 줄이는 문구가 전환율을 높입니다.

문의 페이지에는 입력폼만 덩그러니 두지 말고, 연락 가능한 시간, 답변 예상 시간, 전화번호, 이메일, 주소, 지도까지 함께 넣어 주세요. 방문자가 안심하고 연락할 수 있어야 합니다.

템플릿을 써도 메뉴는 반드시 다시 짭니다

아임웹의 템플릿은 빠른 시작을 도와주는 훌륭한 출발점입니다. 아임웹은 다양한 감각의 템플릿과 AI 기반 시작 흐름을 제공하므로 초보자도 백지에서 시작하는 부담을 줄일 수 있습니다.³ 하지만 템플릿의 메뉴는 "예시 회사"의 메뉴입니다. 우리 회사의 목적, 고객, 문의 방식과 다르면 반드시 바꿔야 합니다.

템플릿을 고른 뒤에는 다음 순서로 정리하세요.

이 순서를 지키면 코딩을 몰라도 정보 구조가 탄탄한 회사 홈페이지를 만들 수 있습니다. 디자인은 나중에 다듬을 수 있지만, 메뉴 구조가 엉켜 있으면 페이지를 만들수록 더 복잡해집니다. 집을 짓기 전에 복도를 먼저 그리는 마음으로 메뉴를 잡으세요.

초보자가 자주 하는 메뉴 실수

메뉴 구조에서 자주 나오는 실수는 대부분 욕심에서 시작됩니다. 더 많이 보여주면 더 전문적으로 보일 것 같지만, 실제로는 반대입니다. 좋은 홈페이지는 많은 정보를 한꺼번에 보여주는 곳이 아니라, 필요한 정보를 쉽게 찾게 해주는 곳입니다.

특히 빈 게시판은 조심해야 합니다. "공지사항"을 만들었는데 마지막 글이 2년 전이라면 방문자는 회사가 멈춰 있다고 느낄 수 있습니다. 꾸준히 올릴 자신이 없다면 처음에는 소식 메뉴를 빼고, 대신 홈이나 회사소개에 최근 활동 몇 개만 보여주는 편이 낫습니다.

지금 바로 메뉴 트리를 써봅시다

이제 내 회사 홈페이지의 메뉴 트리를 직접 적어봅시다. 아래 형식을 그대로 복사해서 회사에 맞게 바꾸면 됩니다.

조금 더 구체화하면 이렇게 됩니다.

이 표가 완성되면 아임웹에서 무엇을 만들어야 할지 훨씬 분명해집니다. 메뉴를 정하지 않은 채 디자인 모드에 들어가면 이것저것 눌러보다가 시간이 사라집니다. 반대로 메뉴 트리를 들고 들어가면 템플릿을 보더라도 "이 페이지는 살리고, 이 메뉴는 바꾸고, 이 섹션은 문의 페이지로 옮기면 되겠다"라고 판단할 수 있습니다.

이번 장의 결론: 좋은 메뉴는 방문자를 대신 생각합니다

프로처럼 보이는 홈페이지의 비밀은 특별한 기술에만 있지 않습니다. 방문자가 무엇을 먼저 보고, 무엇을 믿고, 어디에서 행동할지 대신 생각해 주는 데 있습니다. 메뉴는 그 생각을 가장 압축해서 보여주는 장치입니다.

처음에는 다섯 개면 충분합니다. 회사소개, 서비스/제품, 사례/후기, 소식/자료, 문의. 그리고 매출이나 상담으로 이어지는 핵심 행동은 헤더의 CTA 버튼으로 분리하세요. 업종에 맞는 말로 메뉴명을 바꾸고, 각 페이지에는 정보 성격에 맞는 아임웹 위젯을 배치하세요. 모든 페이지를 한 번에 만들려 하지 말고, 핵심 5페이지로 먼저 오픈한 뒤 운영하면서 확장하면 됩니다.

다음 장에서는 이 메뉴 구조를 바탕으로 실제 아임웹 템플릿과 AI를 활용해 첫 사이트를 만들어 보겠습니다. 이제 우리는 빈 화면 앞에서 막막해하지 않아도 됩니다. 이미 복도와 방의 위치를 정했으니까요.

참고

¹아임웹 빠른 디자인 시작 가이드

²Navigating the Future: Website and App Navigation Patterns for 2026

³아임웹 공식 홈페이지