환영 팝업: 7가지 예시 및 제작 방법 [가이드 + 동영상]

어서 오십시오!

환영 팝업에 대해 배우고 영감을 주는 환영 팝업 디자인을 보고 생성 방법에 대한 자습서를 보려면 아래로 스크롤하십시오.

내가 거기에서 무엇을했는지보십시오?

이 인트로와 마찬가지로 환영 팝업은 웹사이트의 새로운 방문자를 맞이하는 메시지입니다. 또한 한 가지 매우 중요한 목표가 있습니다. 새 방문자를 구독자 및 고객으로 전환하는 것입니다.

이 게시물에서는 방문자를 전환시키는 환영 팝업을 만드는 데 필요한 모든 것(예제, 템플릿, 팁 및 단계별 생성 가이드)을 찾을 수 있습니다.

섹션으로 이동:

• 환영 팝업이란 무엇입니까?
• 환영 팝업의 예
• 웹사이트에 환영 팝업을 추가하는 방법
• 환영 팝업 도움말

환영 팝업이란 무엇입니까?

환영 팝업은 방문자가 웹 사이트에 들어갈 때 표시되는 메시지입니다. 목표는 새로운 방문자의 관심을 끌고 구독자 또는 고객으로 전환하는 것입니다.

웹사이트에 환영 팝업을 추가하는 것은 당장 구매할 준비가 되지 않은 방문자를 전환시키는 효과적인 방법입니다. 이것이 온라인 비즈니스가 환영 팝업을 사용하여 이메일 목록을 작성하여 나중에 마케팅 캠페인으로 육성하는 이유입니다. 다른 인기 있는 용도로는 제품 페이지로 트래픽을 유도하고 마케팅 발표를 하는 것이 있습니다.

다음은 전자상거래 웹사이트의 일반적인 환영 팝업입니다.

환영 팝업의 예

영감을 얻고 싶다면 인기 있는 웹사이트의 멋진 환영 팝업 디자인을 살펴보겠습니다. 이러한 예는 보기에도 좋고 효과적이며 매달 수천 명의 방문자를 전환합니다.

1. 전체 화면 환영 팝업

• 웹사이트 : 니키 키호
• 목표 : 이메일 목록 작성
• 인센티브 : 신제품, 독점 거래, 최신 뉴스 및 대면 이벤트에 대한 조기 액세스

영감을 주는 환영 팝업을 찾고 있다면 이것이 하나일 수 있습니다. 이것은 브랜드 아이덴티티와 전반적인 고급 웹사이트 분위기를 아름답게 강화합니다. 그리고 그냥 보세요. 정말 멋집니다.

Nickey Kehoe는 웹사이트를 연 후 몇 초 후에 환영 팝업을 표시합니다. 두 가지 방법으로 팝업을 닫을 수 있습니다( 사이트 입력 또는 닫기 버튼 클릭). 이 디자인 결정은 방문자 경험을 긍정적으로 유지하는 좋은 방법인 팝업을 닫는 작업을 단순화합니다.

2. 할인된 웰컴 팝업

• 홈페이지 : 블루메
• 목표 : a) 이메일 목록 작성, b) 최초 방문자로부터 더 많은 주문 생성
• 인센티브 : 첫 주문 20% 할인 + 회원 특전(무료 배송 및 반품)

첫 주문에 대해 할인을 제공하는 멋진 환영 팝업입니다. 많은 전자 상거래 상점은 리드와 주문을 생성하기 위해 이와 같은 홈페이지 환영 팝업에 의존합니다.

Blume의 이 환영 팝업 은 웹사이트 방문자의 5%를 전환하며 이는 평균 팝업 전환율인 약 2%보다 훨씬 높습니다. 이유: 넉넉한 제안, 멋진 브랜드 팝업 디자인, 좋은 브랜드 평판.

3. 무료 제품 샘플이 포함된 환영 팝업

• 홈페이지 : Sunday for Dogs
• 목표 : 방문자의 구매 결정을 도와 매출 증대
• 인센티브 : 무료 제품 샘플

개 사료 구독 사업인 Sundays For Dogs는 신규 이민자들이 개인 맞춤형 사료 무료 샘플을 시도하도록 동기를 부여합니다. 이는 훌륭한 마케팅 전략입니다. 무료 샘플은 식품 구독 비즈니스의 매출을 증가시키는 것으로 입증되었습니다.

고객이 Get Yours를 클릭하면 샘플 제품이 있는 페이지로 이동합니다. 그곳에서 원하는 레시피를 선택하고 주문합니다. 배송비는 5달러뿐입니다. 선호 정보 덕분에 비즈니스는 유용한 데이터를 수집하여 향후 제안을 개인화할 수도 있습니다.

4. 쿠폰 코드가 포함된 환영 팝업

• 홈페이지 : 캔들 델리리움
• 목표 : 첫 방문자로부터 리드 및 판매 창출
• 인센티브 : 첫 구매 시 할인 쿠폰 코드

개인화된 쿠폰은 리드를 확보하고 주문 가치를 높이며 판매를 촉진할 수 있습니다. 이 환영 팝업은 최초 방문자가 고유한 쿠폰 코드로 전환하도록 유도하며 새로운 방문자를 맞이하는 좋은 방법입니다. 또한 고유 코드는 캠페인 실적을 추적하는 데 도움이 됩니다.

디자인 면에서는 꽤 단순하지만 보기 좋은 환영 팝업입니다. 캔들 델리리움 제품의 멋진 이미지와 브랜드 디자인, 짧고 달콤한 메시지가 담겨 있습니다. 전자 상거래 상점에 대한 환영 팝업의 좋은 예입니다.

멋진 팝업 디자인을 보고 싶으십니까? ️ 이메일 팝업 예시 ️ SMS 팝업의 예 ️ 스핀 투 윈 팝업 예시

5. 소프트웨어 데모가 포함된 환영 팝업

• 웹사이트 : 젠데스크
• 목표 : 데모 조회수 증가 및 리드 생성
• 인센티브 : 사례를 통해 Zendesk가 고객 서비스 품질 개선에 어떻게 도움이 되는지 알아보기

이 환영 팝업은 여러 가지 이유로 나에게 눈에 띄었습니다.

첫째, Zendesk는 소프트웨어 비즈니스이므로 캠페인의 목적은 데모 세션에서 제품을 소개하는 것입니다. 둘째, 팝업은 이미지를 최대한 활용하여 제품 대시보드의 스크린샷과 함께 통합되는 일부 인기 앱을 보여줍니다.

방문자가 CTA 버튼을 클릭하면 사이트에서 데모 등록 페이지로 이동합니다. 거기에서 이름과 이메일을 입력하여 데모 시청을 시작합니다.

전반적으로 Zendesk는 소프트웨어 비즈니스가 리드를 생성하고 제품에 대한 인지도를 높이는 데 웹사이트 팝업이 어떻게 도움이 되는지에 대한 멋진 예를 제공합니다.

6. "브랜드 소개" 환영 팝업

• 홈페이지 : 프레스헬스푸드
• 목표 : 충성도 높은 고객 목록 구축
• 인센티브 : 건강한 라이프 스타일 팁, VIP 제안 및 경품이 포함된 주간 콘텐츠

여기에서 두 가지가 내 눈길을 끌었다. 아름다운 제품 이미지와 이모지가 있는 캐주얼한 글씨체였다.

PRESS Healthfoods는 제품 이미지로 놀라운 일을 했으므로 환영 팝업에 하나를 포함하는 것이 좋습니다. 게다가 이미지가 있는 팝업은 방문자의 거의 5%를 전환하는 반면 이미지가 없는 팝업은 2.85%만 전환합니다.

카피의 'Let's make itofficial'은 친근한 대화의 시작처럼 느껴져 호감을 불러일으킨다. 이러한 친근하고 캐주얼한 커뮤니케이션 스타일은 온라인 쇼핑객의 57%가 선호하는 것이므로 이 환영 팝업은 좋은 첫인상을 줍니다.

7. 기간한정 웰컴 팝업

• 웹사이트 : 페데고 바이크
• 목표 : 특정 제품의 매출 증대
• 인센티브 : 제품을 무료로 업그레이드할 수 있는 기간 한정 제안

이메일 가입 생성 외에도 환영 팝업은 판촉 제안 및 거래에 대한 인지도를 높이는 데 유용합니다. 이것이 바로 이 환영 팝업이 달성하려고 하는 것입니다. 즉, 매력적인 기간 한정 거래로 제품 페이지로 트래픽을 유도하십시오.

카피라이팅은 이 팝업의 또 다른 장점입니다. 여기에 있는 몇 문장에도 "무료", "제한된 시간", "저장" 및 "종료"와 같이 주의를 끄는 강력한 단어로 가득 차 있습니다. 헤드라인에 이러한 단어를 사용하는 것은 숙련된 작가가 방문자를 참여시키는 입증된 전술입니다.

웹사이트에 환영 팝업을 추가하는 방법

웹사이트에 환영 팝업을 쉽고 빠르게 생성하여 추가할 수 있습니다. 이를 위해 자체 팝업 도구인 Wisepops 를 사용할 것입니다.

튜토리얼이 포함된 동영상을 선호하는 경우 아래 동영상을 사용하세요. 그러나 단계별 가이드가 필요하면 비디오 바로 아래에 있습니다.

그래서-

다음 단계에 따라 코딩 없이 웹사이트에 환영 팝업을 만들고 추가하십시오. 시작하려면 Wisepops에서 무료 계정을 만드십시오 .

환영 팝업을 만드는 단계:

• 1단계: 새 캠페인 만들기
• 2단계: 목표 선택
• 3단계: 캠페인 형식 선택
• 4단계: 팝업 템플릿 선택
• 5단계: 환영 팝업 디자인
• 6단계: 감사 창 사용자 지정
• 7단계: 팝업 표시 방법 정의
• 8단계: 웹사이트 팝업 게시

1단계: 새 캠페인 만들기

구독에 대한 감사의 표시로 특별 행사 및 할인에 대한 액세스를 약속하는 온라인 상점을 위한 고전적인 환영 팝업을 만들어 보겠습니다. 그러나 원하는 방식으로 프로세스에서 버전을 사용자 지정할 수 있습니다.

Wisepops 대시보드에서 캠페인 생성 을 클릭하고 캠페인 지원 을 선택합니다.

캠페인 지원은 캠페인 생성 과정을 안내하는 유용한 기능입니다. 따라서 새로운 사용자에게 적합합니다.

2단계: 목표 선택

캠페인 지원 을 누르면 잠재고객 늘리기, 판매 촉진, 피드백 수집 중에서 선택할 수 있는 세 가지 목표가 표시됩니다.
잠재고객 늘리기를 클릭합니다.

3단계: 캠페인 형식 선택

이메일 목록을 작성하기 위해 환영 팝업을 생성하고 있으므로 뉴스레터 를 선택하십시오.

4단계: 팝업 템플릿 선택

이제 환영 팝업이 어떻게 보일지 선택합니다. 템플릿 라이브러리는 미리 만들어진 팝업 형식의 좋은 선택을 제공합니다.

템플릿을 클릭하여 선택을 확인하고 다음 단계로 이동합니다.

우리는 이 환영 팝업 템플릿을 사용할 것입니다. 이 템플릿은 방문자의 관심을 메시지에 집중시키는 친숙한 형식을 가지고 있습니다.

5단계: 환영 팝업 디자인

우리는 이 환영 팝업을 진정으로 당신의 것으로 만들어야 합니다—

즉, 색상, 이미지 및 텍스트를 사용자 지정하여 웹사이트의 자연스러운 부분처럼 보이게 합니다. 드래그 앤 드롭 편집기 덕분에 이 작업을 매우 쉽게 수행할 수 있습니다. 요소를 클릭하고 변경하기만 하면 됩니다.

먼저 텍스트를 작성해 보겠습니다.

텍스트 요소를 클릭하여 편집 설정을 엽니다. 팝업 바로 위에 표시됩니다(이미지에서 강조 표시됨).

다음-

새로운 이미지를 추가해 봅시다.

그렇게 하려면 템플릿에서 시각적 개체를 클릭합니다. 그러면 화면 왼쪽에 이미지 메뉴가 시작됩니다. 거기에서 바꾸기 를 클릭하고 다른 이미지를 선택하십시오.

색상과 이미지를 클릭하여 변경했습니다.

이제 템플릿이 어떻게 생겼는지 보여줍니다. 진짜 양초 가게에서 팝업처럼 생겼죠?

그리고 완전히 동일한(그리고 더 나은!) 팝업을 디자인할 수 있습니다.

이 디자인을 복제하는 데 관심이 있는 사람들을 위해 다음을 사용했습니다.

• 글꼴용 Arial
• #803345 컬러용
• 비주얼을 위한 Castorly Stock의 이 무료 사진

6단계: 감사 창 사용자 지정

방문자가 필드를 채우고 Sign Me Up 을 클릭하면 감사 창이 나타납니다. 대부분의 팝업 템플릿에는 구독 확인, 방문자 감사, 할인 코드 공유에 사용되기 때문에 이 창을 갖추고 있습니다.

시작한다-

감사합니다 탭을 클릭합니다.

거기에 감사 창이 나타납니다.

기본 환영 팝업에서 했던 것과 똑같이 디자인을 사용자 정의하십시오. 기본 팝업으로 쉽게 돌아가 색상 코드를 얻을 수 있습니다. 기본 팝업을 클릭하기만 하면 됩니다. 그리고 약속한 할인코드(저는 TENOFF로 갔습니다)를 추가합니다.

내 버전은 다음과 같습니다.

이제 환영 팝업 디자인이 완료되었습니다.

게시하기 전에 마지막으로 해야 할 일은 사이트에 새 방문자에게 표시될 팝업을 설정하는 것입니다. 그것이 우리가 할 일입니다.

7단계: 팝업 표시 방법 정의

기본 메뉴에서 표시 규칙 으로 이동합니다.

Wisepops는 방문자가 귀하의 웹사이트에서 8초를 보낸 후 환영 팝업을 표시합니다. 예를 들어 5초 더 일찍 표시하려면 다음 이후에만 표시 필드에 원하는 번호를 추가하기만 하면 됩니다.

그리고 마지막 설정-

새로운 방문자만 이 환영 팝업을 볼 수 있기를 바랍니다. 이를 확인하려면 대상 탭에서 신규 방문자 를 선택하십시오.

그게 다야

리드를 생성하고 잠재 고객을 늘리기 위해 사이트에 대한 멋진 브랜드 환영 팝업을 만들었습니다. 잘했어요!

8단계: 환영 팝업 게시!

팝업 디자인을 마쳤으므로 편집 완료 를 누르십시오. 게시 및 확인을 클릭하는 캠페인 개요 창으로 리디렉션됩니다.

그게 다야, 환영 팝업이 귀하의 웹사이트에 실시간으로 표시됩니다! 축하해요!

팝업이 보기를 수신하고 이메일을 생성하기 시작하면 Wisepops 대시보드에서 성능을 확인할 수 있습니다.

환영 팝업 도움말

이 팁을 사용하여 환영 팝업을 리드 생성 머신으로 만드십시오.

1. 혜택 제공

신선하고 유용한 콘텐츠, 할인, 쿠폰, 독점 제안, 무료 배송, 신제품에 대한 조기 액세스 등 비즈니스는 이 모든 것을 환영 팝업에 추가합니다. 온라인 비즈니스를 운영하는 경우 인센티브 사용도 고려하십시오.

2. 클리어 카피 쓰기

모든 훌륭한 환영 팝업은 매력적인 메시지를 명확하게 전달합니다.

좋은 카피를 작성하려면:

• 짧고 달콤하게 유지하십시오. 사람들은 가능한 한 빨리 메시지를 받아야 하므로 두 문장(제목 + 지원 메시지)만 작성하십시오.
• 매력적이고 창의적이어야 합니다 . 환영 팝업에 친근하고 캐주얼한 언어를 사용하십시오. 그러나 브랜드의 목소리가 허용한다면 주저하지 말고 재치 있거나 장난을 치십시오.
• 사람들에게 행동하도록 요청하십시오. 방문자가 수행해야 하는 작업을 설명하고 해당 작업에 대해 명확하게 설명합니다.

3. 팝업이 지연되게 표시

사람들은 웹사이트에 도착하는 순간 나타나는 팝업을 좋아하지 않습니다.

그렇기 때문에 시작 팝업에 대해 최소 5초의 지연 설정을 고려하십시오(튜토리얼에서 했던 것처럼).

숙련된 마케터도 간단한 트릭을 수행합니다. 그들은 사람들이 구글 애널리틱스로 웹사이트에서 보내는 평균 시간을 알아내고 그 값의 약 20%로 표시 시간을 설정합니다. 예를 들어 평균 시간이 60초인 경우 팝업은 12초(60의 20% = 12)에 나타날 수 있습니다.

4. 카운트다운 타이머 추가

긴박감은 구매에 대한 강력한 동기입니다. Wisepops 연구에 따르면 카운트다운 타이머를 추가 하면 전환율이 41% 증가합니다.

Wisepops에 이 요소를 추가하려면 메인 메뉴에서 블록 으로 이동하여 카운트다운 을 선택합니다. 타이머는 환영 팝업에 자동으로 추가됩니다.

5. 다양한 버전의 환영 팝업 테스트

일부 고객은 최적의 가격을 찾고 싶어합니다.

다른 사람들은 충동적으로 구매하는 경향이 있습니다.

방문자의 선호도(및 구매 이유)를 알아보려면 다양한 버전의 환영 팝업 캠페인을 만드십시오.

Wisepops에서 이것은 A/B 테스트 생성을 의미합니다. 기본적으로 대시보드에서 AB 테스트를 클릭하여 환영 팝업을 복제합니다. 다음은 이러한 방식으로 두 가지 버전으로 분할된 캠페인의 보기입니다.

분할을 통해 원하는 방식(할인 크기, 카운트다운/카운트다운 없음 등)으로 두 번째 캠페인 버전을 쉽게 변경하고 결과를 모니터링할 수 있습니다.

환영 팝업 FAQ

환영 팝업이 인기가 있지만 많은 웹사이트 소유자는 팝업의 효율성과 방문자 경험에 미치는 영향에 대해 우려하고 있습니다. 그렇기 때문에 이 마지막 섹션에서는 사람들이 가장 많이 하는 질문에 답할 것입니다.

환영 팝업은 얼마나 효과적입니까?

환영 팝업은 방문자의 최대 5%를 전환할 수 있습니다.

환영 팝업이 고객의 경험에 해를 끼치나요?

환영 팝업이 너무 일반적이고 너무 빨리 나타나면 성가실 수 있습니다. 방문자에게 명확한 가치를 제공하는 브랜드 캠페인을 디자인하면 많은 방문자를 전환할 수 있어야 합니다.

환영 팝업은 내 스토어의 SEO에 어떤 영향을 줍니까?

상단 팝업 소프트웨어를 사용하여 환영 팝업을 생성하면 캠페인이 모든 SEO 요구 사항을 100% 준수하게 됩니다.

팝업에 대한 더 많은 팁과 통찰력은 Wisepops 블로그 의 다른 가이드를 참조하십시오.