모바일 UX에 적응하는 방법과 사용자 브라우저 습관 변화

게시 됨: 2022-12-14

모바일 장치에서 들어오는 인터넷 트래픽의 비율은 2016년에 처음으로 데스크톱 트래픽을 넘어섰습니다. 더 많은 사람들이 모바일 장치에서 인터넷에 액세스함에 따라 우수한 모바일 디자인의 필요성이 더욱 중요해졌습니다. 마케터는 모바일 사용자에게 도달하는 동시에 전환과 참여를 높이기 위해 최고의 모바일 UX 디자인 요소를 이해해야 합니다.

목차

열악한 모바일 UX 디자인은 브랜드를 망칠 수 있습니다.

mobile design

모바일 웹사이트 사용자는 사이트를 제대로 최적화하지 않는 브랜드를 매우 용납하지 않습니다. Impactbnd에 따르면 고객의 52%는 모바일 UX가 열악한 웹사이트에 참여하고 싶어하지 않습니다. 또한 사이트를 완전히 이탈할 가능성이 5배 더 높습니다.

점점 더 많은 고객이 모바일 장치에서 인터넷을 검색하는 데 더 많은 시간을 할애함에 따라 고객의 기대치는 높아질 것입니다. 모바일 UX에 영향을 미치는 요소를 이해하는 것이 필수적입니다.

모바일 UX는 어떻게 다른가요?

모바일 UX에 대한 사이트 최적화를 시작하기 전에 모바일 및 데스크톱 사용자가 사이트와 상호 작용하는 방식의 차이점을 이해해야 합니다. 가장 큰 차이점은 스크롤과 클릭이 모바일 장치에서 훨씬 더 어렵다는 것입니다. 사용자가 콘텐츠와 상호 작용하는 동안 좌절하지 않도록 탐색을 단순화해야 합니다.

화면 크기도 고려해야 합니다. 스마트폰과 심지어 태블릿 화면은 데스크톱보다 작기 때문에 시각적 요소가 너무 콤팩트할 수 있습니다.

다음은 모바일 UX를 개선하기 위한 몇 가지 팁입니다.

더 읽어보기: SEO 캠페인을 시작하기 전에 알아야 할 10가지 사실

텍스트 및 링크의 가시성 향상

모바일 화면은 더 작기 때문에 일반적으로 텍스트를 읽기가 더 어렵습니다. 텍스트를 다르게 표시해야 합니다. 다음은 더 나은 모바일 UX를 위해 염두에 두어야 할 몇 가지 사항입니다.

  • 이상한 글꼴을 사용하지 마십시오. 사용하기에 가장 좋은 글꼴 유형은 Arial, Times New Roman, Grotesque, Helvetica 및 Open Sans입니다. Ad Bonnie의 Algerian과 같은 글꼴은 읽기가 너무 어려울 것입니다.
  • 18~22포인트 글꼴 크기를 사용하는 것이 좋습니다. 동일한 글꼴 크기는 데스크톱 장치에서 10% 더 크므로 모바일에서 텍스트가 눈에 띄도록 더 큰 글꼴을 사용해야 합니다.
  • 하이퍼링크에는 더 어두운 텍스트와 더 굵은 색상을 사용하십시오. 이것은 더 많은 대비를 만듭니다.

물론 텍스트를 최적화하는 동안 사용자의 인구 통계도 고려해야 합니다. 나이가 많은 사용자는 어떤 화면 크기에서든 텍스트를 읽는 데 더 어려움을 겪게 됩니다. 이 문제는 모바일 사용자에게 더 심각하므로 대부분의 독자가 노인인 경우 텍스트를 더 크게 만드십시오.

모든 클릭 유도 문안 버튼이 다양한 손가락 크기에 맞게 충분히 큰지 확인하세요.

cta

새로운 클릭 유도 문안 버튼을 만들 때 가장 먼저 고려해야 할 사항 중 하나는 가시성입니다. 그러나 가시성을 넘어서는 클릭 유도문안 작성의 용이성도 고려해야 합니다. 작은 버튼은 클릭하기가 더 어려울 것입니다. 이것은 특히 손가락이 큰 사용자에게 해당됩니다. 사이트의 UX를 평가할 때 어떤 사람들은 당신보다 손가락이 더 크다는 것을 기억하고 그에 따라 버튼 크기를 조정해야 합니다. Duda는 이것을 아주 잘합니다. vCita 온라인 예약 도구에는 쉽게 클릭할 수 있는 큰 CTA 버튼이 있습니다.

더 읽어보기: 2023년 초보자를 위한 WordPress 웹사이트 구축 방법

클릭 투 콜 옵션 사용

모바일 사용자는 집중 시간이 매우 짧습니다. 귀하의 웹 사이트에서 전화 번호로 전화를 걸도록 시도하는 행운을 빕니다. 대부분의 사람들은 전화번호가 올바른지 확인하기 위해 다이얼 패드와 웹사이트 사이를 오가는 것을 원하지 않습니다. 그렇게 했더라도 잘못 입력할 위험이 항상 있습니다. 잘못된 번호로 전화를 걸면 다시 전화를 시도하지 않을 것입니다.

대신 클릭투콜 옵션이 있다면 사용자는 훨씬 더 만족할 것입니다. 당신은 또한 그들이 전화를 걸 수 있는 훨씬 더 높은 기회를 갖게 될 것입니다.

이메일 퍼널을 지나치게 복잡하게 만들지 마세요

사용자가 이메일 목록을 구독하도록 하는 것은 데스크톱 장치에서 충분히 어렵습니다. 모바일 트래픽에 맞게 설정하는 것은 상당히 어렵습니다.

이메일 퍼널이 가능한 한 단순한지 확인하십시오. 또한 모바일 장치에서 증가하는 문제인 봇 트래픽을 피하기 위한 조치를 취하십시오. 이메일 확인 서비스를 사용하여 의심스러운 이메일을 확인하고 목록에서 제거하면 오픈율 및 기타 중요한 지표를 개선하는 데 도움이 될 수 있습니다.

햄버거 메뉴를 사용하여 콘텐츠 접근성 향상

hamburger menu

많은 웹사이트 메뉴가 예전보다 훨씬 복잡해졌습니다. 많은 데스크탑 웹사이트는 이 문제를 최소화하기 위해 탐색을 단순화하기 위해 드롭다운 메뉴를 사용합니다. 불행히도 이러한 유형의 메뉴는 모바일 장치와 모바일 UX에서 완전히 악몽이 될 수 있습니다.

Facebook은 햄버거 메뉴로 알려진 모바일 앱용 솔루션을 개발했습니다. 이 옵션은 모바일 사용자가 사이트와 상호 작용하고 콘텐츠에 보다 쉽게 ​​액세스할 수 있는 원활한 방법이 될 수 있습니다. 더 많은 옵션이 있는 드롭다운 하위 메뉴 대신 옆에 햄버거 아이콘이 있습니다. 사용자는 햄버거를 클릭하여 더 많은 메뉴 옵션이 있는 새 화면으로 이동할 수 있습니다.

자세히 보기: 평가 RingCentral 및 Nextiva: 소기업에 이상적인 옵션은 무엇입니까?

UX 전문가들은 햄버거 메뉴의 유용성에 대해 의견이 분분하다. 한편으로는 사용자가 여러 번 클릭해야 하는데 인기 있는 웹페이지를 찾으려는 경우 불필요하게 지루할 수 있습니다. 반면에 사용자를 완전히 잃지 않는 가장 좋은 방법일 수 있습니다.

한 연구에 따르면 고객에게 많은 옵션이 주어지면 행동을 취할 가능성이 10배 낮아집니다. 햄버거 메뉴로 일부 사용자를 잃을 수 있지만 한 번에 너무 많은 옵션으로 사용자를 과부하시키는 경우만큼 많지는 않습니다.

햄버거 메뉴는 테스트할 가치가 있습니다. 그러나 먼저 불필요한 옵션을 제거하여 메뉴 탐색을 단순화하는 것이 중요합니다. 이것이 시청자를 잃지 않는 가장 좋은 방법이 될 것입니다.

불필요한 요소 제거

웹사이트에서 불필요한 요소를 제거하는 것은 모바일 사이트의 성능을 개선하는 데 필수적입니다. 그들은 모바일 화면을 매우 복잡하게 만들 수 있습니다. 더 나쁜 것은 클릭 유도문안에서 주의를 분산시키거나 중요한 콘텐츠(CTA 포함)를 스크롤 없이 볼 수 있는 부분으로 밀어 넣을 수도 있습니다. 이 콘텐츠가 표시되지 않으면 사용자가 아래로 스크롤하여 참여하지 못할 수 있습니다.

화면의 모든 시각적 요소를 자세히 살펴보십시오. 중요한지 여부를 결정하고 필요한 경우 모바일 페이지에서 제거하십시오.

모바일 UX를 자세히 살펴보세요

잘 최적화된 모바일 UX를 갖추는 것이 필수적입니다. 사용자가 쉽게 콘텐츠에 참여하고 전환율을 극대화할 수 있는지 확인해야 합니다. 다행히 모바일 UX를 개선할 수 있는 방법이 많이 있습니다. 이 지침은 좋은 출발점이지만 테스트하는 것을 잊지 마십시오! 분석 데이터는 모바일 웹사이트의 새로운 디자인을 변경할 때 최고의 가이드가 될 것입니다.