과거에는 웹 사이트에 불필요한 요소가 많았습니다. 즉, 화려하고보기 흉한 색 구성표로 가득 찬 페이지, 작은 공간에 너무 많은 텍스트가 갇혀 있고, 팝업으로 방문자를 괴롭히는 팝업이있었습니다.
그러나 디자이너들은 그 당시에 더 많은 것을 알지 못했거나 오히려 그들이 알고있는 유일한 디자인 트렌드와 모범 사례로 작업했습니다.
그 이후로 시간이 많이 바뀌 었습니다.
웹 개발자와 디자이너는 더 이상 기술이나 기법에 제한을 받지 않습니다. 즉, 잘못된 디자인에 대한 변명의 여지가 없습니다. 이것은 홈페이지 헤더 이미지에서 워드프레스 사이트에 있는 모든 요소와 관련이 있습니다. 형태 연락처뿐만 아니라 타이포그래피에서 팝업까지. 이제 사용자 경험을 디자인할 때 모든 것이 중요합니다.
오늘은 무엇이 팝업을 효과적으로 만드는지에 초점을 맞추고 싶습니다. 전환 과정의 필수적인 부분이라고 생각합니다. 특히 효과적인 WordPress 팝업의 구조와이 흥미로운 요소가 어떻게 전환율을 높일 수 있는지 살펴보고 싶습니다.
WordPress에서 팝업 사용에 대한 주장
팝업은 흥미로운 디자인 요소입니다. 일시적으로 사용자 경험을 방해하지만 (일반적으로별로 높이 평가되지 않음) 올바르게 수행 된 제품은 방문자가 잃어 버릴 염려가없는 매력적이거나 흥미로운 것을 제공합니다. 주의를 기울일 분.
물론 이 경우에는 구독자를 모으는 역할을 하는 전환 생성 팝업에 대해 뉴스 레터 또는 방문자가 구매하도록 유도합니다. 그러나 팝업은 다양한 용도로 사용될 수 있습니다. 예를 들어 쿠키 또는 개인 정보 보호 정책을 공유하고, 방문자가 장바구니에 무언가를 추가한 후 관련 항목을 추천하거나 간단한 설문 조사를 요청할 수도 있습니다.
대부분의 경우 팝업 창을 사용하는 경우 방문자가 조치를 취하기를 원할 것입니다. 결국, 방해가 그들의 시간을 유용하게 사용하지 않는다면 왜 그들의 경험을 방해할까요? 거의 3,09 억 개의 팝업에 대한 연구에 따르면 이러한 유형의 팝업에 대한 평균 전환율은 XNUMX %입니다.
이제 질문이 제기됩니다. 팝업이 여전히 관련성이 있고 효과적입니까? 시장이 종료 팝업, 헬로우 바, 전체 페이지 오버레이 등으로 너무 포화 상태 인 경우 WordPress 사이트에서 사용할 가치가있는 변환 생성 도구입니까?
물론입니다 !!!
팝업은 많은 좋은 웹 디자인 관행을 고려합니다. 예를 들면 :
- 팝업은 사이트 페이지에서 불필요한 혼란을 제거합니다.
- 그것들은 보통 깔끔한 비주얼과 최소한의 텍스트로 구성됩니다.
- 클릭 유도 문안은 잘 디자인되어 있으며 표현 측면에서 간단하게 제공됩니다.
- 대부분의 사람들이 팝업에 익숙하고 팝업과 상호 작용하는 방법을 알고 있기 때문에 방문자를위한 작은 학습 곡선이 있습니다.
- 팝업은 사이트에 애니메이션, 비디오 또는 사회적 증거를 주입 할 수있는 재미있는 기회를 제공합니다.
- 다음을 사용하여 쉽게 만들 수 있습니다. 워드 프레스 플러그인 Hustle과 같은 고품질 또는 OptinMonster.
일반적으로 잘 디자인 된 팝업은 가장 필요할 때 방문자의 관심을 끄는 데 이상적입니다. 이를 사용하여시기 적절한 알림이나 요청을 보낼 수 있습니다. 방문자 데이터를 사용하여 구매를 유도 할 수도 있습니다.
효과적인 WordPress 팝업의 구조
분명히 WordPress 사이트 팝업의 성공 여부는 완벽하게 디자인되고 방문자가 상호 작용할 수 밖에 없는 매력적인 제안을 제공하는 팝업에 달려 있습니다. 그럼 효과적인 팝업을 위한 승리 공식이 어떻게 생겼는지 살펴보겠습니다.
1. 스타일
다른 유형의 팝업은 방문자를 구독자로 전환하는 데 더 효율적인 경향이 있습니다.
- 이메일 구독 팝업의 전환율은 2,9 %입니다.
- 환영 팝업 (입력시 전체 페이지를 채우는 팝업)은 2,6 %로 전환됩니다.
- 스크롤 트리거 팝업은 1,9 %를 변환합니다.
- 스마트 또는여보세요 팝업은 0,5 %의 변환을 표시합니다.
그렇다고 항상 기존 이메일 구독 팝업을 사용해야하는 것은 아닙니다. 다음은 Neil Patel 사이트의 예입니다.
이것은 간단하게 설계되고 방해가되지 않기 때문에 잘 수행되었습니다. et 재미있는 애니메이션을 사용하여 최소한의 풋 프린트가 눈에 띄지 않을 경우주의를 집중시킵니다. 스타일을 선택하는 것은 가장 인기가 있거나 전환율이 높은 것으로 가장 잘 알려진 스타일을 사용하는 것이 아닙니다. 귀하의 사이트와 방문자에게 적합한 스타일을 찾는 것과 그 사이의 경험을 보완하도록 설계된 것입니다.
2. 색
물론 색상은 웹 사이트 디자인에서 항상 중요한 역할을합니다. 선택한 색상의 심리를 이해하면 더욱 효과적인 팝업을 만들 수 있습니다. 물론 브랜드에 대해 확립 된 색 구성표를 잊을 수 없으므로 사이트에 잘 어울리는 팝업 창을 디자인하는 것 사이의 균형을 찾는 것이 중요합니다. 또한 방문자가 행동을 취하도록 강요합니다.
3. 구성
한 걸음 물러서서 전체적으로 팝업을 보는 것이 중요합니다. 팝업의 각 움직이는 부분의 디자인이 중요하지만 팝업의 전체 구성도 중요합니다.
팝업 창이 다음과 같아야합니다.
- 간단하고 따라하기 쉽다.
- 깨끗한 라인으로 설계되었으며 균형이 잘 잡혀 있습니다.
- 관련성이 높은 고해상도 이미지를 포함합니다. 이상적으로는 제안의 주제를 요약하는 단일 이미지입니다.
- 사이트의 확장으로 보이며 제한된 사용자 지정 옵션이있는 팝업에서 만든 것이 아닙니다.
- 크고 읽기 쉬운 타이포그래피를 사용하십시오.
4. 본문
그러면 팝업 메시지가 나타납니다. 이러한 작업에 들어가는 언어를 개발하는 과정에 있지는 않지만 팝업을 텍스트로 채울 때 알아야 할 모범 사례가 많이 있습니다.
다음 사항에 유의하십시오.
- 항상 헤드 라인, 짧은 메시지 (한 문장으로 가능) 및 클릭 유도 문안을 포함합니다.
- 방문객의 감정에 호소하는 강력한 언어를 사용하십시오.
- 간략하게. 30 단어 미만으로 쓸 수없는 경우이 메시지는 팝업 창에 속하지 않습니다.
- 귀하의 사이트에서 사용하는 것과 같은 음색과 개성을 사용하십시오.
- 방문자가 사이트의 다른 곳에서 찾을 수없는 중요한 것을 제공하십시오.
- 가능하면 긴급을 사용하십시오. 말로 할 수 없다면 색으로하세요.
5. CTA
요즘 웹 사이트에서 방문자에게 두 가지 클릭 유도 문안 옵션을 제공하는 이상한 성장 추세가 있습니다. 이 트렌드가 왜 커지고 있는지 이해하지만, 너무 많은 웹 사이트에서 잘못 적용되는 것을 보았 기 때문에 결국 트렌드가 사라지기를 바랍니다.
이 나쁜 응용 프로그램을 직접 보았을 것입니다.
- 긍정적 인 선택 : 이건“아, 고마워요, 고마워요! 이 제안이 내 인생을 더 좋게 바꿀 것이라는 것을 알고 있습니다! "
- 부정적인 옵션 : 이건 "내가 나쁜 삶을 선택하는 걸 좋아하고 내 얼굴을 문질러 주셔서 감사합니다." 이 끔찍한 결정을 내릴 것인지 다시 묻는 또 다른 창을 표시하려면이 자동 지원 중단 옵션을 클릭하겠습니다. "
두 가지 CTA 옵션이있는 모든 팝업이 잘못 설계되었거나 방문자를 부끄럽게 만들려는 의도는 아닙니다. Tim Ferris는 잘 수행 된 이중 옵션 CTA의 좋은 예입니다.
그러나 전반적으로 비꼬거나 방문자의 결정을 위협하려는 경우 사이트에서 나와 Twitter에 게시하십시오. 귀하의 웹 사이트는이를위한 장소가 아니며 Twitter가이를 완전히 삼킬 것입니다.
이 반려 동물과는 별개로, 행동 유도를 단순하게 유지하는 것이 좋습니다. 방문자가 이메일을 입력하거나 버튼을 클릭하면 얻을 수있는 내용을 명확하게하는 간단한 언어를 사용하십시오. 또한 작업을 최소한으로 유지하십시오. 채울 필드가 두 개 이상 (예 : 이메일 및 이름)이고 클릭 할 버튼 하나입니다.
이것으로이 튜토리얼을 마치고 클릭 유도 문안 버튼을 잘 디자인 할 수 있기를 바랍니다.
