🌟 디테일의 간격 시리즈! [ ✍🏻 푸터 디자인 패턴과 적재적소에 사용하는 법] (👀간단 요약) 📌 푸터의 기초 ✓ 웹사이트의 푸터는 모든 페이지의 맨 아래, 본문 내용 아래에 위치한 영역 ✓ 내비게이션, 검색, 우선순위가 높은 콘텐츠는 일반적으로 페이지 상단에 위치 ✓ 최근 웹사이트가 늘면서 푸터 역시 다양한 기능을 하는 영역으로 변화 ✓ 사용자가 페이지의 품질을 측정하는 중요한 기준점이 될 정도 ✓ 작지만 사용자 경험을 크게 향상시킬 수 있는 강력한 영역 📌 푸터의 사용 1 : 고객을 붙잡을 수 있는 기회 ✓ 처음 원했던 상품이 마음에 들지 않는 상황 ✓ 서비스 또는 브랜드에 대한 호감은 여전히 존재 ✓ 푸터에서 다른 기능 또는 상품에 대한 직, 간접적 정보 확인 후 진입 📌 푸터의 사용 2 : 찾기 어려운 콘텐츠를 보여주는 마지막 수단 ✓ 내비게이션 영역에 없는 추가 정보가 푸터에 자리잡고 있는 경우가 있음 ✓ 커머스라고 하면, 상단에는 카테고리 등의 구매 관련 정보가 많지만 ✓ 푸터에서는 입사 지원 등 또 다른 시각에서의 정보를 찾을 수 있음 📌 푸터의 사용 3 : 다양한 정보가 집약된 공간 ✓ 의도적으로 푸터까지 스크롤을 내려보는 사용자들 ✓ 연락처는 물론 소셜 미디어 링크 등을 발견 할 수 있는 기회가 생김 📌 푸터의 사용 4 : 상단의 글로벌 내비게이션으로 돌아가기 귀찮을 때 사용하는 수단 ✓ 상단으로 바로 이동 할 수 있는 버튼 등이 제공되긴 하지만 ✓ 이것마저 귀찮을 땐, 푸터에 주요 메뉴를 다시 한 번 넣어 바로 이동하게 만드는 것도 가능 📌 푸터의 요소 ✓ 유틸리티 링크 : 모든 사이트가 공통으로 사용해야 하는 요소 1) 연락처 정보: 회사 주소, 전화번호, 실시간 채팅 링크 2) 고객 서비스 정보 3) 개인 정보 보호 정책 4) 이용약관 ✓ 도어매트 내비게이션 : 페이지 상하단에 모두 포함된 내비게이션 사용자가 웹사이트에 들어왔을 때 페이지 상단에서 가장 먼저 보고, 떠날 때 푸터에서 마지막으로 보는 내비게이션을 의미. 페이지 하단에 있던 사용자는 상단으로 돌아가지 않고도 사이트의 다른 섹션으로 빠르게 이동할 수 있음 ✓ 부차적 작업 링크 : 사용자가 관심을 가질만한 부차적 내용 1) 입사 원서 제출 2) 콘텐츠 작성자를 위한 작업 3) 투자자 정보에 대한 접근 4) 제품, 서비스의 문서 또는 사양 검색 5) 회사 언론 홍보 및 PR 정보에 대한 접근 6) 회사의 계열사 검색 ✓ 사이트 맵 : 글로벌 내비게이션에 없는 중요한 페이지 노출 - 대규모 사이트에서 자주 사용 1) 글로벌 내비게이션 수준에서 분명하지 않은 하위 토픽을 노출할 때 2) 사이트의 주요 콘텐츠에 대한 인식을 향상시키고자 때 3) 사용자들에게 회사 상품을 상기시킬 때 ✓ 수상내역 또는 인증기관 : 사이트가 대표하는 집단이나 개인의 권위와 신뢰를 쌓는 방법으로 사용 ✓ 조직 내 브랜드 : 자회사나 제휴 브랜드를 다수 보유한 다국적 조직이 많이 사용하는 요소 ✓ 고객 참여 : 이메일 뉴스레터 및 소셜 미디어 등 📌 푸터 작업 시 유의사항 ✓ 두 개 이상의 정보 계층 ✓ 불명확한 링크 이름 ✓ 불명확한 구조 또는 정보 계층 ✓ 숨겨져 있거나 너무 작아 읽기 힘든 푸터 (👋중요한 이유가 뭔가요?) 아, 오랫동안 그랬어요. 푸터는 뭐 마지막에 GNB에 넣을 수 없지만 중요할 수 있는 정보를 넣으면 그만이지. 라는 생각요. 일반 화면으로 따지자면 공지사항 화면처럼 중요도를 낮게 생각했습니다. GNB 영역으로 바로 이동 할 수 있는 버튼도 있겠다, 누가 푸터까지 내려와서 정보를 보겠어? 라는 생각도 한몫 했습니다. 그런데, 막상 데이터를 들여다보면 생각보다 푸터에서 다른 메뉴나 기능으로 진입하는 비율이 높았어요. (물론 이건 그냥 단순하게 표현한 것이고, 서비스에 따라 당연히 다를 순 있습니다.) 요즘은 다이렉트로 웹사이트에 진입하는 것 보다 어딘가를 통해 들어오는 경우가 많기에 그럴까? 아니면 첫 방문이니까 조금 더 탐색해보는 의미로 푸터까지 닿는걸까? 등 여러 생각을 했던 기억이 나네요. 지금도 푸터를 구성하고 있는 상황에서, 이전과 같은 아찔한 생각을 하지 않고자 - 그리고 푸터의 중요성에 대해 이렇게 잘 정리된 글도 많이 보지 못했기에 공유합니다. 이 글을 읽게 된다면, 다음에 접속하는 웹페이지의 푸터를 유심히 살펴보세요. 어떤 유형에 속하는지, 얼마나 디테일하게 작업했는지 보이지 않을까요?