홈페이지  /  All  / 모바일 장치에서 팝업을 보기 좋게 만드는 5가지 방법(반응형 웹사이트의 경우)

모바일 장치에서 팝업을 보기 좋게 만드는 5가지 방법(반응형…

모바일 팝업

우리의 세계는 공식적으로 모바일화되었습니다. 미국 사용자가 다양한 기기에서 소비한 디지털 시간의 점유율을 분석하면 스마트폰이 차지합니다. 62 비율 그 뒤를 데스크톱이 29%, 태블릿이 9%로 뒤를 이었습니다.

모바일 시대로의 전환 추진 Google은 1년 2019월 XNUMX일부터 모든 웹사이트에 대해 기본적으로 모바일 우선 색인 생성을 출시한다고 발표했습니다. 이러한 모든 요인으로 인해 웹사이트와 웹 앱을 개발할 때 반응형 디자인 방식을 통합하는 것이 필수가 되었습니다. 모두.

사용자가 모바일에 최적화된 웹사이트에 방문할 때 발생하는 엄청난 양의 모바일 트래픽 유입을 활용하려면 영리한 팝업 전략이 필요합니다. 사용자가 전환하고 입력하도록 강요하는 것 영업 파이프 라인 사용자 경험에 부정적인 영향을 미치거나 Google의 SEO 순위에 부정적인 영향을 미치지 않습니다.

모바일 팝업 구현 전 중요 고려사항

Google은 원활한 사용자 경험을 가장 중요하게 생각하므로 다음 항목의 통합과 관련하여 엄격한 지침을 발표했습니다. 팝업 모바일 웹사이트에서. 전면 광고 형태의 팝업은 모바일에서 탐색하는 동안 전반적인 사용자 경험을 침해하고 방해하는 것으로 간주합니다.

따라서 모바일 검색 경험을 개선하기 위한 엄격한 기준을 제시했습니다. 여기에는 방문 페이지(사용자가 Google 검색 결과를 클릭한 후 나타나는 페이지)에 방해가 되는 팝업을 표시하는 웹 페이지에 대한 처벌이 포함됩니다.

 

웹사이트의 검색 순위가 영향을 받지 않도록 팝업을 디자인하는 동안 확인해야 할 사항은 다음과 같습니다.

  • 사용자가 탐색하는 동안 팝업이 웹페이지의 주요 콘텐츠를 덮어서는 안 됩니다.
  • 팝업은 사용자가 기본 콘텐츠로 이동하기 위해 닫아야 하는 독립형 전면 광고 형식이어야 합니다.
  • 페이지 레이아웃의 접힌 부분 위는 사용자가 콘텐츠에 액세스하기 위해 아래로 스크롤하도록 하는 팝업만으로 구성되어서는 안 됩니다.

팝업을 사용하여 모바일 전환율 높이기

Google은 모바일 팝업을 선호하지 않으며 팝업에 대한 사용자 의견이 부정적이라는 사실에도 불구하고 모바일 팝업의 중요성과 능력은 웹사이트 전환 유도 귀하의 비즈니스는 부인할 수 없습니다.

올바르게 수행된다면 팝업은 사용자 가입을 유도하고 긍정적인 수익을 창출할 가능성이 있습니다. 전자상거래 웹사이트를 디자인하든, B2B SaaS 웹사이트, 사용자가 클릭하도록 유도하는 효과적인 팝업을 디자인하는 것은 비즈니스 관점에서 매우 중요합니다.

검색 순위에 부정적인 영향을 주지 않으면서 반응형 웹사이트의 팝업이 모바일 장치에서 멋지게 보이도록 할 수 있는 5가지 방법은 다음과 같습니다.

1. 모바일용 팝업 디자인

반응형 디자인은 데스크톱에 표시되는 것과 동일한 팝업이 모바일 장치에서도 작동한다는 의미는 아닙니다. 휴대폰의 경우 사용 가능한 화면 공간이 훨씬 적기 때문에 동일한 팝업 세트를 사용하면 결국 사용자 인터페이스가 어지러워져 사용자 경험이 저하됩니다.

또한 데스크톱 웹사이트에 표시되는 팝업은 Google 페널티를 받지 않으므로 콘텐츠를 포함하는 전체 페이지 팝업을 표시할 수 있으며 웹페이지 순위를 방해하지 않습니다. 반응형 디자인을 보장할 때 모바일에서도 유사한 전략이 있을 것입니다.

웹사이트의 웹 및 모바일 버전에 대해 서로 다른 팝업을 디자인하면 디자인에서 우위를 점할 수 있고 Google 가이드라인을 준수할 여유가 생깁니다.

2. 터치 대상에 주의하세요

웹과 모바일용 팝업 디자인은 화면 크기의 차이와 두 경우 모두 존재하는 사용자 상호 작용 종류로 인해 근본적으로 다릅니다. 웹의 경우 입력 필드는 마우스 클릭을 수용하기 위해 더 작을 수 있지만 터치 대상을 통합할 수 있을 만큼 충분히 커야 합니다.

터치 대상이 작을수록 "뚱뚱한 손가락 증후군"이 발생합니다. 사용자가 모바일 장치에서 원하는 작업을 완료할 수 없으면 전환하는 대신 웹사이트를 떠나게 될 수도 있습니다.

경험상 모바일 웹사이트에서 클릭 가능한 모든 버튼은 최소 44×30픽셀이어야 합니다. 모바일 장치는 사용자가 선호하는 입력 매체가 아닙니다. 이메일 가입을 요청하는 경우 입력 필드가 사용자가 손가락으로 탭하여 클릭할 수 있을 만큼 충분히 크고 입력 양식이 사용자에게 가장 낮은 마찰을 제공하는 흐름을 가지고 있는지 확인하세요.

3. 팝업 크기를 제한하세요

웹페이지의 주요 내용을 가리지 않는 화면 하단의 배너 팝업은 랜딩 페이지에 팝업을 통합하기 위한 인기 있는 전략입니다. 스크롤 없이 볼 수 있는 부분 위에 있는 주요 웹사이트 콘텐츠를 다루지 않으므로 Google 사양을 위반하지 않습니다.

또한 전체 페이지 모달 팝업보다 사용자에게 덜 방해적입니다. 이 팝업 전략을 통합하는 데 있어 유일한 과제는 고객이 전환할 수 있는 충분한 가치를 제공하기 위해 사용할 수 있는 공간이 제한되어 있다는 것입니다.

팝업의 크기가 작기 때문에 사용자의 주의를 피할 수 있습니다. 또한 입력 필드가 작을수록 목록을 구독하려는 사용자에게 어려움을 줄 수 있습니다.

4. 사용자에게 팝업을 퍼붓지 마세요.

사용자가 웹페이지에 접속하자마자 표시되는 팝업은 즉시 꺼집니다. 사용자가 탐색 과정에서 콘텐츠를 먼저 사용할 기회가 생기면 나중에 실행되도록 하는 방식으로 이를 통합하세요. 방문자가 도착한 후 즉시 또는 몇 초 내에 팝업이 표시되지 않도록 하세요.

또 다른 실행 가능한 전략은 사용자가 방문하는 두 번째 페이지에 팝업을 표시하는 것입니다. 이렇게 하면 Google의 가이드라인을 위반하는 일이 없으며 사용자가 가치 있는 콘텐츠를 소비할 시간이 충분하므로 전환 가능성도 높아집니다.

5. 의도를 이해하고 가치를 제공하라

가치를 제공하는 팝업은 사용자가 자발적으로 클릭하게 만듭니다. 이러한 팝업은 모바일 웹사이트를 통한 사용자의 여정에 흡수되어 원활한 사용자 경험을 제공합니다.

사용자의 심리를 이해하고 사용자가 웹페이지를 방문하는 의도를 해독하면 매력적인 가치 제안을 작성하는 데 필요한 단서를 얻을 수 있습니다. 그런 다음 클릭 유도 버튼이 팝업 대신 랜딩 페이지에 통합됩니다. CTA를 클릭하면 팝업이 표시됩니다.

사용자가 좌절감 때문에 클릭하거나(닫기 위해) 실수로 배치로 인해 클릭하는 다른 유형의 팝업과 달리 CTA 팝업은 더 잘 통합됩니다. 사용자가 자발적으로 클릭하기 때문에 향상된 사용자 경험이 보장됩니다.

어떤 전략을 선택하든 팝업 디자인과 전체 모바일 웹사이트 디자인은 전체적인 사용자 경험을 염두에 두고 이루어져야 합니다. 방문자의 심리를 이해하고 그들의 요구 사항을 해결하는 것이 비즈니스 성공과 전환율 증가의 열쇠입니다.

Rahul Varshneya는 공동 창립자이자 회장입니다. 아르케니아. Rahul은 Bloomberg TV, Forbes, HuffPost, Inc 등 수많은 미디어 채널에서 기술 사고의 리더로 소개되었습니다.