웹사이트에 팝업을 추가할 때 해야 할 것과 하지 말아야 할 것 + 예제

목요일 밤 9시, 당신은 약간의 차를 홀짝이고 있습니다. 또는 힘든 하루였다면 아마도 와인일 것입니다. 당신은 하품을 하기 시작하고 잠자리에 들 시간이라고 생각합니다. 탭을 닫으려는 순간 BAM! 종료 인텐트 팝업에 다음 메시지가 표시됩니다. “잠깐! 가방에 물건이 있습니다.” 클릭 유도 문안은 "지금 체크 아웃"하라는 메시지를 표시하고 결국 새 지갑을 구매하게 됩니다.

그 망할 종료 의도 팝업이 작동하기 때문에 우리는 모두 거기에 있었습니다. 실제로 종료 의도 팝업의 전환율은 약 3~5%입니다. 큰 숫자는 아니지만 개발자 시간 없이 리드, 판매 및 사이트 상호 작용을 늘리는 데 여전히 충분합니다. 팝업은 웹사이트의 표준 관행이지만 자신의 사이트에 팝업을 추가할 때 해야 할 일과 하지 말아야 할 일을 알고 계십니까?

너무 많은 정보를 입력하지 마십시오.

일반적으로 팝업의 최대 너비는 900픽셀을 초과하지 않아야 합니다. 이미지를 사용하면 콘텐츠를 위한 공간이 많이 남지 않으므로 창의력을 발휘해야 합니다.

Old Navy는 팝업을 사용하여 고객이 신용 카드를 신청하도록 권장합니다. 몇 가지 유익한 문구가 포함되어 있으며 CTA(Call to Action) 버튼이 고객을 애플리케이션으로 안내합니다. 간단하지만 효과적인 팝업 예제입니다.

사용자 정보를 수집하십시오 .

향후 커뮤니케이션을 보낼 수 있도록 이메일을 수집하는 것은 신규 고객과 기존 고객을 가장 먼저 기억할 수 있는 좋은 방법입니다. 뉴스레터용 이메일 주소를 수집하거나 쿠폰 코드를 제공할 수 있습니다.

거대한 양식을 만들 필요가 없습니다. 실제로 이메일 필드만 있으면 충분합니다. 이메일을 개인화하려는 경우 이름 필드를 추가할 수 있습니다. 사용자로부터 더 많은 정보를 수집해야 하는 경우 나중에 수집하십시오. 이 상호 작용을 위한 시간 창은 방문자가 원하는 정보를 보여주고 필요한 리드 정보를 수집하기에 충분합니다.

팁: 방문자가 고전적인 "Welcome10"을 10% 할인 코드로 추측하지 않도록 하려면 대신 사용자 정의 코드를 사용하십시오.

너무 많은 팝업으로 청중을 압도하지 마십시오.

사용자가 사이트를 탐색할 때 사용자의 경험을 염두에 두십시오. 원치 않는 팝업으로 방문자의 여정에 충돌을 일으키는 것은 해로울 수 있습니다. 예를 들어 최근에 러그를 보고 있었는데 제품을 탐색하는 동안 중단을 목격했습니다. 제품의 다음 페이지를 보기 위해 클릭할 때마다 이 팝업을 보고 검색을 계속하기 전에 이를 거부해야 했습니다.

고맙게도 그들은 이 작은 원으로 사용자 경험(UX)을 개선하여 팝업이 확장되지만 클릭을 선택한 경우에만 가능했습니다. 이 팝업을 개선하는 또 다른 방법은 고객이 장바구니에 항목을 추가한 후에만 팝업을 표시하는 것입니다.

또 다른 나쁜 예는 NFL의 이중 팝업 디스플레이입니다.

한 번에 두 개의 팝업을 표시하는 것은 압도적입니다. 브라우저 알림 팝업에 대해 "나중에"를 클릭했을 때 제한된 시간 제공도 종료되어 가입할 기회가 제거되었습니다. 한 번에 하나의 팝업을 고수하거나 이 경우 시간이 지정된 팝업을 사용하십시오. 그런 식으로 처음 방문자는 한 번에 하나의 옵션을 보고 고려할 수 있는 기회를 갖게 됩니다.

시간 초과 팝업 사용에 대한 자세한 내용은 계속 읽으십시오.

이메일(리드)에 대한 교환으로 쿠폰을 제공하십시오.

리드 수집으로 돌아가서 방문자로부터 정보를 수집하면 보람을 느낄 수 있습니다. 대부분의 소비자는 월간 뉴스레터를 받거나 첫 구매 시 약간의 할인을 받는 등 보답으로 무언가를 원합니다. 사용자가 보상 프로그램에 가입하도록 할 수도 있습니다. 이메일 및 이름에 대한 쿠폰 또는 독점 콘텐츠를 제공하는 것은 쉬운 교환이며 향후 마케팅 캠페인을 위한 리드를 확대합니다.

색상과 시간이 지정된 팝업을 통해 방문자의 관심을 사로잡으십시오.

팝업은 청중의 관심을 끌기 위한 것입니다. 따라서 보색을 사용하여 팝업을 돋보이게 만드십시오. 색상환을 살펴보고 기본 색상 체계를 보완하는 색상을 찾으십시오. 팝업을 너무 산만하게 만들지 말고 작은 알림인 경우 방문자가 보고 있는 페이지에서 눈에 띄기를 원할 것입니다.

또한 사용자가 일정 시간 동안 사이트에 머문 후에 팝업을 표시하는 시간 제한 기능을 사용하면 주의를 다시 집중하고 올바른 경로를 유지하는 데 도움이 될 수 있습니다.

예를 들어, 지원서를 작성하다가 주의가 산만해지면 아래와 유사한 팝업이 표시될 수 있습니다.

이 알림은 사용자에게 초점을 다시 응용 프로그램으로 리디렉션하도록 상기시킬 뿐만 아니라 작업을 완료해야 하는 긴박감을 제공합니다. 궁극적으로 시간 제한 팝업을 사용하면 웹사이트 방문자가 웹사이트 방문자가 신청, 구매 또는 양식 제출을 완료할 것으로 예상하는 경로를 유지할 수 있습니다.

팝업을 닫는 옵션을 추가하는 것을 잊지 마세요.

혼란을 피하기 위해 사이트 방문자가 어떻게 팝업을 닫을 수 있는지 명확히 하십시오. 최악의 시나리오: 방문자가 탭을 완전히 닫고 사이트로 돌아오지 않습니다. 이런. 아무도 그것을 원하지 않습니다. 특히 고객 서비스, 유지 및 판매 사업에서 그렇습니다.

ShortStack의 액션 위젯을 사용하여 닫기 팝업 액션을 만듭니다. 방문자가 팝업을 닫는 데 사용할 수 있는 훌륭한 텍스트는 다음과 같습니다.

• 제안 거절
• 닫다
• 다음번
• 나중에 상기시켜 줘
• 고맙지 만 사양 할게
• 정보 주셔서 감사합니다

팝업을 사용하여 사이트 또는 특정 제품에 대한 연령 제한을 적용하십시오.

구매자가 특정 연령이어야 하는 니코틴이나 알코올과 같은 제품을 판매합니까? Rogue Brewery와 같은 간편한 팝업을 사용하여 그들이 보는 콘텐츠가 연령에 적합한지 확인하십시오.

이와 같이 미리 만들어진 템플릿을 사용하여 방문자가 귀하의 사이트에 입장할 수 있는 올바른 연령인지 확인할 수 있습니다.

고객에게 주요 변경 사항을 알리십시오.

새로운 제품이나 서비스를 출시하고 해당 정보를 사용자에게 알리고 싶을 때 팝업을 통해 알리는 것이 가장 좋습니다. 새로운 템플릿, 기능 또는 캠페인 빌더에 대한 주요 업데이트가 있으면 아래와 같은 인앱 팝업을 통해 고객에게 알립니다.

이 새로운 기능에 대한 자세한 정보를 찾는 사람은 CTA 버튼을 클릭하여 더 자세한 설명을 볼 수 있습니다. 마찬가지로 클라이언트가 기능에 대해 알고 싶지 않거나 이미 정보를 알고 있는 경우 팝업을 닫는 옵션이 휴지통 아이콘과 "정보 감사합니다!" 두 위치에 명확하게 표시됩니다. 옵션.

결론

대체로 팝업은 매우 성공적인 마케팅 도구입니다. 웹 사이트 방문자에게 새로운 변경 사항을 알리고 싶거나 향후 마케팅 캠페인을 위한 리드를 수집하고 싶다면 팝업을 사용해 보십시오. 2023년 비즈니스 목표를 달성하는 데 도움이 되도록 위에 나열된 해야 할 일과 하지 말아야 할 일을 참조하세요.