지역 페이지로 가는 길이 푸터 하나뿐이었다
한눈에 답변
지역별 페이지를 만들었지만 헤더 메뉴에는 그 링크를 넣지 않았다. 화면 맨 아래 푸터와 일부 타일에서만 접근할 수 있어, 페이지는 존재해도 실제로 찾아 들어가기 어려운 상태였다. 헤더 링크는 푸터보다 검색엔진이 부여하는 가중치도 높다. 헤더에 항목을 하나 추가하면서 좁은 화면에서 메뉴가 넘치지 않도록 여백 규칙도 함께 조정했다.
무엇이 문제였나
지역별로 나뉜 페이지들이 실제로 사이트 안에 만들어져 있었다. 문제는 그 페이지로 가는 링크가 헤더 메뉴에는 없고, 화면 맨 아래 푸터와 몇몇 타일에서만 연결돼 있었다는 것이다.
왜 이게 문제인가
푸터는 페이지를 끝까지 스크롤해야 보이는 위치다. 사용자 입장에서는 그런 페이지가 있는지조차 모르고 지나칠 가능성이 크다. 검색엔진 관점에서도 헤더에 있는 링크가 푸터에 있는 링크보다 더 중요한 신호로 취급된다 — 사이트 어디서나 눈에 잘 띄는 자리에 놓인 링크일수록 그 대상 페이지가 중요하다는 뜻으로 읽히기 때문이다.
헤더에 항목을 추가하니 무엇이 걸렸나
헤더 메뉴 항목이 7개가 되면서, 화면 너비가 좁아지는 지점에서 여백이 24픽셀까지 좁혀지는 문제가 나타났다. 항목 사이 좌우 여백을 좁은 화면 폭에서만 줄이고, 로고와 메뉴 사이 여백을 40픽셀에서 96픽셀로 늘려 항목이 앞으로 더 늘어나도 쉽게 넘치지 않도록 여유를 뒀다.
이 사건에서 얻은 교훈
페이지를 만드는 것과 그 페이지를 찾을 수 있게 만드는 것은 별개의 작업이다. 새 섹션을 추가할 때, “만들었다”에서 끝내지 않고 “사이트 어디서 그 페이지로 갈 수 있는가”를 확인해야 한다. 그리고 내비게이션에 항목을 하나 추가하는 작은 변경도, 화면이 좁아지는 지점에서는 레이아웃 여유 자체를 다시 계산해야 할 수 있다.