일관된 페이지 경험

정책, 고객 지원과 소식 페이지에서 같은 타이틀 및 탭 내비게이션 컴포넌트를 사용하도록 개선했습니다. 페이지마다 달랐던 글자 크기와 간격도 하나의 디자인 기준으로 통일했습니다.

스크롤 위치 유지

탭을 전환할 때 페이지가 최상단으로 이동하지 않고 현재 스크롤 위치를 유지합니다. 긴 문서를 읽거나 지원 유형을 비교할 때 흐름이 끊기지 않습니다.

앞으로도 키보드 탐색과 화면 읽기 도구를 포함한 접근성 개선을 이어가겠습니다.

공통 컴포넌트 적용

페이지마다 반복되던 상단 타이틀 영역을 PageTitle로 통합했습니다. 배지, 제목과 설명만 전달하면 동일한 배경, 글자 크기와 반응형 여백을 사용할 수 있습니다.

탭 메뉴는 PageNav로 분리해 정책, 고객 지원과 소식 페이지가 같은 스타일과 활성화 규칙을 공유합니다. 디자인을 변경할 때 공통 컴포넌트 한 곳만 수정하면 모든 페이지에 반영됩니다.

모바일 내비게이션

화면이 좁을 때 탭이 여러 줄로 나뉘어 콘텐츠를 밀어내지 않도록 가로 스크롤 방식을 적용했습니다. 각 항목은 충분한 클릭 영역을 유지하고 현재 페이지는 색상과 aria-current 속성으로 구분합니다.

상세 페이지 사이드 목록

소식 상세 페이지에는 현재 분류의 글을 빠르게 전환할 수 있는 왼쪽 목록을 추가했습니다. 현재 읽고 있는 글은 별도의 배경색으로 표시하며, 데스크톱에서는 스크롤 중에도 목록을 확인할 수 있도록 고정됩니다.

접근성 개선 사항

• 내비게이션마다 용도를 설명하는 접근성 이름 제공
• 현재 선택된 메뉴와 글에 aria-current 적용
• 장식용 아이콘을 화면 읽기 도구에서 제외
• 제목 단계를 유지해 문서 구조를 쉽게 탐색하도록 구성
• 키보드 초점이 명확하게 보이도록 공통 스타일 적용

화면의 움직임과 전환 효과는 내용을 방해하지 않는 범위에서 짧고 자연스럽게 동작하도록 계속 다듬겠습니다.