본문 바로가기

누리집개선의견

홈페이지개선의건 상세보기 - 제목, 내용, 파일 정보 제공
철원군청(메인) 홈페이지 개선안에 대해 몇가지 조언 하겠습니다.
불철주야 수고가 많으십니다. 철원군청 홈페이지 리뉴얼 작업을 시행한다는 소식을 듣고 몇가지 도움이 될 만한 조언을 조심스럽게 말하겠습니다.

(본 내용은 리뉴얼 작업을 시행하는 업체를 위해 HTML과 혼용하면서 진행하겠습니다.)

1. 페이지 헤더(Header) 부분 요소가 수직정렬이 맞지 않습니다.

2. 페이지 헤더(Header) 부분에 있는 SNS 아이콘을 푸터(Footer) 부분에 배치하면 좋을 거 같습니다.

3. 상단 메뉴(정보공개-참여마당-사이버민원실등등)에 있는 하위 메뉴에 마우스 오버(hover)할 때 완성도가 부족해 보입니다. 상단 메뉴와 동일하게 완성도 있게 만들어주시면 좋을 거 같습니다.

4. 본 페이지는 반응형 디자인(PC - Mobile)기반 페이지 같습니다. 반응형 디자인을 제작하면 그에 따른 사용성도 편리해야 합니다.

4-1) 전체적인 아이콘(검색창, 네비게이션, 콘텐츠 분야별 사용된 아이콘등) 의 굵기(Stroke)가 일정하지 않습니다. 통일성을 유지하여 전체적으로 수정됐으면 좋겠습니다.

4-2) 전체적으로 콘텐츠에 마우스를 갖다대면(hover) 트렌지션(animate or transition)을 많이 사용됐습니다. 하지만, 최소화 시켰으면 좋겠습니다. 이유는 2가지 입니다. 첫째는 움직임이 매끄럽지 않습니다. Z-index가 맞지 않아 콘텐츠가 뒤죽박죽으로 보이기 때문입니다. 두번째는 많은 트렌지션으로 인해 페이지 로딩시간이 길어지는 요인 중 하나이기 때문입니다.

4-3) 전체적으로 콘텐츠에 색이 많이 들어있습니다. 철원의 브랜딩 색을 사용한 의도는 잘 알겠으나, 너무 많은 색을 사용하는것은 사용자 입장에서 혼란을 줄 수 있기 때문입니다. 또한 페이지 로딩시간에도 영향을 미칩니다. Fill(면) 디자인이 아닌, Line(선) 디자인으로 수정하면 좋을 거 같습니다.

4-4) 하단에 있는 네비게이션바(메인 - 소식 - 민원/소통 - 관광) 을 (메인 - 소식 - 민원 - 관광)으로 바꾸는게 더 일관성 있을 거 같습니다. 추가적으로 해당 페이지에 있는 구성요소도 손을 좀 봐야할 거 같습니다.

4-5) 네비게이션 바에 있는 4개의 페이지(메인,소식,민원,관광)를 분할하는게 아닌, 메인 페이지에 하나로 나타냈으면 좋겠습니다. 또한 하단에 있는 네비게이션바(메인-소식-민원/소통-관광)를 PC버전에서는 리모콘 기능으로 대체했으면 좋겠습니다. 각 해당되는 id 값을 a 태그에 걸어놓으면 해당 페이지로 바로 넘어가는 기능이 있기 때문에 그 점을 활용하는것을 추천합니다.

4-6) 모바일 버전에는 하단 네비게이션바를 사용하는게 맞습니다. 하지만 너무 큽니다. Mobile UI Guide에 의하면 손가락 터치에 필요한 크기는 최소 48px이라고 예시가 나와있습니다. 본 페이지에 나와있는 좌우 버튼을 없애고 딱 4개의 버튼으로 사이즈 조정하면 정말 좋을거 같습니다. (색도 빼주면 참 좋을 거 같습니다)

일단 크게 생각하는 요소는 이렇게 나왔습니다. 리뉴얼이 어떻게 진행될지는 모르겠으나, 철원에 계시는 국민이나 해당 관련되는 사용자가 편하게 사용되게 개편됐으면 좋겠습니다. 조금이나마 도움이 됐으면 좋겠습니다. 긴글 읽어주셔서 감사합니다.

(각 해당되는 요소는 파일로 첨부하겠습니다. 중복되는 요소는 포함하지 않았습니다.)
파일