Footer
사이트 하단에서 법적 정보·정책 링크·서비스 탐색·연락처를 모아 보여주는 영역입니다.
Footer는 모든 화면의 가장 아래에 놓여, 사업자 정보·정책 링크처럼 어디서나 닿을 수 있어야 하는 정보와 서비스 전반을 탐색하는 링크를 모아 보여주는 영역입니다.
Footer는 고정된 형태를 가진 단일 컴포넌트가 아니라, 제품마다 필요한 구성을 골라 조립하는 조합 예시(preset) 입니다. 정해진 필수 구성은 없으며 모든 블록이 선택적입니다. 비즈프로필처럼 링크 몇 개만 담는 최소 구성부터, 당근닷컴처럼 로고·국가 선택·전체 사이트맵까지 갖춘 구성까지 폭이 넓습니다. 아래 Building Blocks에서 구성 요소를 확인하고, Presets에서 제품별 완성 예시 중 가까운 것을 골라 시작하세요.
Anatomy
Footer는 독립적인 building block의 수직 조합입니다. 필수 블록은 없으며, 제품에 필요한 블록만 골라 위에서 아래로 쌓습니다. 블록은 역할에 따라 크게 두 영역으로 나뉩니다.
- 탐색 영역 (상단): 브랜드 로고, 국가 선택, 사이트맵 컬럼
- 안내 영역 (하단): 정책 링크, 사업자 정보, 연락처, 저작권, 소셜 링크
두 영역을 함께 쓸 때는 사이를 구분선으로 나눕니다.
Building Blocks
Footer를 이루는 블록과 각각의 역할입니다. 어느 것도 필수가 아니며, 제품 성격에 맞는 블록만 골라 조합합니다. 아래는 Footer에 놓이는 순서(위→아래)대로 정리한 것입니다.
브랜드 로고
당근 로고입니다. 서비스 전체를 대표하는 당근닷컴 같은 구성에서 탐색 영역의 시작점으로 둡니다.
국가 선택
Canada·United States 등 다른 국가/언어 페이지로 이동하는 링크입니다. 다국가 서비스를 노출하는 구성에서만 사용합니다.
사이트맵 컬럼
회사·탐색·비즈니스·문의처럼 카테고리별로 묶은 링크 컬럼 모음입니다. 서비스 전반을 한곳에서 탐색하게 하는 가장 무거운 블록으로, 당근닷컴처럼 허브 성격의 사이트에서 사용합니다.
정책 링크
개인정보처리방침·이용약관·운영정책 등 약관·정책 링크입니다. 제품에 따라 자주 묻는 질문·IR·PR 같은 안내 링크가 함께 묶이기도 합니다. 한 줄로 나열하며, 외부 페이지로 이동하는 링크에는 외부 이동 아이콘(↗)을 붙입니다.
사업자 정보
상호·사업자 등록번호·통신판매업 신고번호·대표자·주소·호스팅 사업자 등 사업자를 표기하는 정보입니다. 구분자(|)로 이어진 한 단락으로 보여줍니다.
연락처
전화번호·고객문의 이메일 등 사용자가 문의할 수 있는 채널입니다. 사업자 정보 아래에 둡니다.
저작권
© 2026 Danggeun Market Inc. 형식의 저작권 표기입니다. 안내 영역의 마지막에 둡니다.
소셜 링크
페이스북·인스타그램·유튜브 등 공식 채널로 이동하는 아이콘 버튼입니다. 제품마다 노출하는 채널이 다릅니다. 저작권과 같은 행의 반대쪽 끝(데스크탑 기준 우측)에 정렬합니다.
Presets
당근의 제품들이 실제로 사용하는 Footer 구성입니다. 새로 Footer를 구성할 때는 제품 성격이 가장 가까운 preset을 골라 시작한 뒤, 필요한 블록을 더하거나 빼세요.
비즈프로필
다른 화면에 얇게 얹히는 최소 구성입니다. 정책 링크와 사업자 정보만 담아, 페이지 본문을 가리지 않으면서 법적 정보에 닿을 수 있게 합니다.
당근비즈니스
사이트맵 없이 안내 영역만 갖춘 구성입니다. 정책 링크·사업자 정보에 연락처·저작권·소셜 링크를 더해, 단일 서비스 사이트의 마무리로 적합합니다.
어바웃당근
당근비즈니스와 비슷한 골격이되, 정책 링크 자리에 브랜드 리소스·자주 묻는 질문·IR·PR 같은 안내 링크를 함께 묶고 사업자 정보를 축약한 구성입니다. 브랜드를 소개하는 사이트에 적합합니다.
당근닷컴
거의 모든 블록을 갖춘 최대 구성입니다. 로고·국가 선택·전체 사이트맵으로 서비스 전반을 탐색하게 하고, 구분선 아래에 안내 영역을 둡니다. 서비스의 관문이 되는 허브 사이트에 사용합니다.
구성 비교
각 preset이 포함하는 블록입니다. ●는 해당 제품 구성에 포함된 블록이며, 반드시 있어야 한다는 의미는 아닙니다.
| 블록 | 비즈프로필 | 당근비즈니스 | 어바웃당근 | 당근닷컴 |
|---|---|---|---|---|
| 브랜드 로고 | – | – | – | ● |
| 국가 선택 | – | – | – | ● |
| 사이트맵 컬럼 | – | – | – | ● |
| 정책 링크 | ● | ● | ●¹ | ● |
| 사업자 정보 | ● | ● | ●² | ● |
| 연락처 | – | ● | ●² | ● |
| 저작권 | – | ● | ● | ● |
| 소셜 링크 | – | ● | ● | ● |
¹ 어바웃당근은 정책 링크에 브랜드 리소스·IR·PR 같은 안내 링크를 함께 묶습니다. ² 어바웃당근은 사업자 정보를 축약하고 연락처(채용문의)를 같은 줄에 둡니다.
Guidelines
Responsive
같은 블록 구성이라도 화면 폭에 따라 배치가 달라집니다.
- 사이트맵 컬럼: 화면 폭이 허용하는 만큼 컬럼을 가로로 나열하고, 넘치면 아래 줄로 접힙니다(wrap).
- 저작권·소셜 링크: 데스크탑에서는 한 행의 좌우 양 끝에 두고, 모바일에서는 위아래로 분리해 쌓습니다.
- 국가 선택: 데스크탑·모바일 모두 세로 목록을 유지합니다.
블록의 종류와 순서는 데스크탑·모바일이 같고, 가로로 펼쳐진 영역이 세로로 접히는 점만 다릅니다.
Last updated on