들어가며
며칠 전 웹사이트 네비게이션을 정리하면서 간단하게 FNB(푸터)에 대해서 다뤘습니다. 그런데 생각해보니 푸터에 들어갈 내용이 사이트 특성마다 다르기 때문에 처음 푸터에 들어갈 정보를 갈무리 할 때, 조금 헤맸던 기억이 떠올랐습니다. 너무 당연하다보니 막상 콘텐츠를 구성할 때 오히려 생각이 안나는 경우라고 해야할까요? 🙉 그래서 이번 아티클에서는 푸터에 들어가야 할 콘텐츠에 대해 정리해 보려고 합니다.
목차
🐾 푸터의 정의
푸터(FNB, Footer Navigation Bar)는 웹사이트나 앱의 하단에 위치하여 모든 페이지에서 동일한 정보를 제공하는 공간을 말합니다. 이 공간은 사용자가 찾기 어려운 콘텐츠를 마지막으로 제공하는 역할을 하며, 패밀리 사이트나 소셜 미디어 링크, 서비스 약관 등을 안내하는 용도로 사용합니다. 🔗 관련 아티클: 웹사이트 Navigation Bar의 종류
🐾 푸터의 구성요소
1. 유틸리티 링크
푸터에는 프로덕트나 서비스를 운영하는 사업체의 법적인 정보를 제시하는 것이 일반적입니다.
- 사업자 정보 (사업체 이름, 대표자명, 사업자번호, 주소, 대표 전화번호, 대표 이메일 등)
- 저작권 정보
- 서비스 이용약관
- 개인정보 처리방침
2. 네비게이션 제공
푸터에서 제공하는 네비게이션은 '도어매트 네비게이션'으로, 사용자가 페이지 상단에서 보았던 GNB와 하위 카테고리를 푸터에서 확인할 수 있도록 합니다. 도어매트 네비게이션을 제공하면 사용자는 상단으로 올라가지 않고도 빠르게 정보를 탐색하고 이동할 수 있습니다. 이 때, 도어매트 네이베이션에는 GNB와 동일한 단어를 사용하여 일관성을 유지해야 합니다. 그 외에도 회사의 PR홍보나 투자 및 채용, 계열사 패밀리 사이트로 쉽게 이동하는 링크를 제공하기도 합니다.
3. 사이트맵
사이트의 페이지 수가 많은 경우, 중요한 일부를 푸터에서 사이트맵으로 제공하거나 사이트맵을 위한 별도의 페이지를 할당하여 사이트를 한눈에 이해하도록 사이트맵을 제공합니다. 사이트맵을 통해 사용자들은 웹사이트나 앱의 구조와 콘텐츠를 파악하기 쉽습니다.
4. 고객 서비스
사용자가 서비스나 프로덕트를 이용하다 어려움에 처했거나 문의를 할 때 연락할 수 있는 수단을 말합니다. 주로 대표 전화번호나 대표 메일, 1:1 문의 게시판으로 이동할 수 있는 링크를 제공합니다. 더불어서 사용자가 스스로 문제를 해결할 수 있는 FAQ 페이지를 제공하면 더욱 좋습니다. 고객 서비스와 관련된 링크를 제공하여 사용자들의 피드백과 문의사항을 더욱 빠르게 대응할 수 있습니다.
또한 웹사이트에서 다국어 서비스를 제공할 경우, 어떤 언어를 서비스하는지 쉽게 살펴볼 수 있게 하고 사용자가 원하는 언어로 쉽게 바꿀 수 있도록 기능을 제공해야 합니다.
5. 브랜딩 영역
푸터를 브랜딩에 사용하는 경우도 있습니다. 사용자와의 신뢰성을 높이기 위해 프로덕트나 회사가 수상한 내역을 제공하거나, 취득한 자격증/인증서 로고를 제공합니다. 또한 협력사나 후원사, 수주했던 회사들을 레퍼런스로 쉽게 훑어볼 수 있도록 로고를 배치합니다. 회사에서 운영하는 브랜드가 있을 경우에는 브랜드 로고를 배치하기도 합니다.
6. CTA (Call to Action) 버튼
회원가입, 혹은 프로덕트에 운영하는 뉴스레터와 같은 구독 서비스가 있을 경우 푸터에 이를 배치하여 사용자가 액션을 마음 먹었을 경우 바로 실행할 수 있도록 합니다.
아티클을 작성하면서 푸터 예시를 많이 찾아볼 수 있었습니다. 어렸을 때부터 인터넷을 써오면서 푸터는 너무나도 당연한 존재였던 것 같아요. 그래서 처음에는 GNB, LNB, SNB를 설명하는 아티클에 푸터에 포함하면 좋을 정보에 대해 함께 적으려고 했는데, 정리하다보니 정보의 종류가 6개까지 분류가 되더라구요! 푸터는 하단에 위치해 있다보니 평소에 많이 신경을 쓰지 않았었는데 생각보다 많은 콘텐츠가 포함되었다는 것을 새삼 느낄 수 있었습니다. 제가 처음에 기획했던 푸터에서 조금 더 추가하면 좋을 아이디어가 많이 떠올라서 재밌었습니다. 🐶
'👾 UI・UX 용어 아카이빙' 카테고리의 다른 글
| 브레드 크럼 | Bread Crumbs (0) | 2023.08.02 |
|---|---|
| 웹사이트 Navigation Bar의 종류 (GNB, SNB, LNB, FNB) (0) | 2023.07.31 |
| 네비게이션 드로어 | Navigation Drawer (0) | 2023.07.26 |
| 햄버거 버튼 외 다양한 메뉴 아이콘 (0) | 2023.07.25 |
