인터넷 사용환경이 데스크탑 중심에서 모바일기기로 넘어가고 있습니다.
이제는 PC에서보다 스마트폰에서 홈페이지를 보는 사용자가 많아졌다는 의미입니다.
모바일기기에 최적화된 홈페이지 디자인은 데스크톱과 다르기 때문에 고려할 내용이 있습니다.
WIX 모바일홈페이지 제작시 고려사항 7가지를 정리해 봤습니다.
1. 데스크톱 편집기로 시작하세요.
WIX에서는 홈페이지를 만들 때 데스크톱 편집기가 기본 편집기 입니다.
WIX 홈페이지 제작시 데스크톱 버전을 완성할 때까지 모바일 기기 버전 사이트 편집을 하지 마세요.
먼저 데스크톱 버전을 완성한 다음 모바일 기기 버전 사이트 편집으로 전환하시기 바랍니다.
WIX 홈페이지의 데스크톱 및 모바일 버전은 동일한 홈페이지를 다른 모드에 표시할 뿐, 두 개의 다른 홈페이지가 아닙니다.
참고 :
데스크톱 홈페이지의 변경사항은 모바일 홈페이지에 영향을 미칩니다.
모바일 홈페이지의 변경사항은 데스크톱 홈페이지에 영향을 미치지 않습니다.
2. 모바일홈페이지 필수사항을 우선 표시하세요
PC에서 홈페이지를 볼 때와 달리 모바일홈페이지에서 홈페이지를 보는 방문자들은 원하는 정보를 빠르게 찾기를 원합니다. 불필요한 설명보다는 전화번호, 금액 등 찾고자 하는 내용 위주로 모바일홈페이지 내용을 정리할 필요가 있습니다.
모바일 편집기를 사용하면 데스크톱 편집기에서 추가했던 내용을 재정렬 할 수 있습니다.
비즈니스에 대한 명확한 설명으로 시작하여 가장 중요한 것을 맨 위에 배치하세요.
홈페이지 내용의 중요도가 높은 것부터 내림차순으로 배치하세요.
팝업을 제거하고 데스크톱 편집기에 추가했던 마우스 오버 효과는 삭제하세요.
중요하지 않은 양식은 모바일기기로 작성하기 어려울 수 있으니 비공개로 전환하세요.
3. 원하는 정보를 쉽게 클릭할 수 있도록 하세요.
가독성이 있는 텍스트와 함께 쉽게 클릭할 수 있는 버튼크기로 조절하세요.
업체명이나 로고를 홈페이지 머릿글(헤더)에 넣고 클릭할 수 있게 하시기 바랍니다.
4. 퀵액션바를 표시하세요.
WIX 모바일 편집기 왼쪽에 표시되어 있는 모바일 도구 - 퀵액션바를 활성화하세요.
고객이 전화를 걸거나 이메일을 보내고 주소를 확인하기 쉽도록 퀵액션바에 설정이 가능합니다.
5. 텍스트와 이미지의 크기를 조절하세요.
모바일 화면은 PC 화면과 달리 가로가 좁고 세로로 긴 형태로 홈페이지가 다르게 보입니다.
데스크톱 홈페이지에서는 나란히 표현되어 있는 내용도 모바일 홈페이지에서는 세로로 정렬되어 표현해야 합니다.
너무 많은 공간을 차지하거나 모바일에서 제대로 표시되지 않는 요소의 크기를 조절해야 합니다.
반대로 모바일에서는 버튼을 손가락으로 잘 눌러질 수 있도록 키워야 할 수 있습니다.
마지막으로 모바일에만 텍스트 정렬을 조정할 수 있습니다.
6. 모바일버전의 색상을 신중하게 선택하세요.
WIX 홈페이지는 데스크톱 버전에 영향을 주지 않고 모바일 편집기에서 색 구성표를 변경이 가능합니다. 모바일 홈페이지 방문자가 햇빛 아래에서 화면을 볼 수 있다는 것을 고려해야 합니다.
일광에서 읽기 쉬운 색상을 선택하는 것이 좋습니다.
배경과 눈에 띄게 대비되는 텍스트 색상을 사용하세요. 밝은 배경에 어두운 텍스트가 눈에 가장 쉽습니다.
7. 다양한 모바일 기기에서 모바일 홈페이지를 테스트하세요.
가능하다면 다른 크기의 휴대폰, 태블릿에서 모바일 홈페이지를 확인하세요.
Google 휴대기기 친화성 테스트 바로가기
