첫 화면에서 결정된다

광고를 눌러 들어온 사람이 페이지에 머무는 시간은 몇 초입니다. 그 안에 판단이 끝납니다.

그래서 랜딩페이지에서 가장 많은 시간을 써야 할 곳은 스크롤 없이 보이는 첫 화면입니다. 아래쪽은 첫 화면을 통과한 사람만 봅니다.

#첫 화면이 답해야 할 세 가지

이게 뭔가, 나한테 왜 필요한가, 지금 뭘 하면 되는가. 이 셋입니다.

세 개 중 하나라도 없으면 사람은 스크롤하지 않고 나갑니다. 특히 첫 번째가 빠진 페이지가 놀랄 만큼 많습니다. 브랜드 슬로건만 크게 있고 무엇을 파는지가 없습니다.

점검 방법은 단순합니다. 이 일을 모르는 사람에게 첫 화면만 3초 보여주고 「여기 뭐 파는 데야?」를 물어봅니다. 답이 안 나오면 고칠 곳은 아래가 아니라 위입니다.

「새로운 경험의 시작」 같은 문구는 아무 정보도 주지 않습니다. 어느 회사 페이지에 붙여도 말이 됩니다.

좋은 제목은 대개 구체적이고 재미없습니다. 「한중일 수입 통관, 발주 전에 확인해 드립니다」처럼요. 읽는 사람이 자기 얘기인지 즉시 판단할 수 있습니다.

판별법이 하나 있습니다. 경쟁사 이름으로 바꿔도 말이 되면 그 제목은 우리 것이 아닙니다.

큰 배경 이미지를 첫 화면에 깔면 보기에는 좋은데 정보가 밀려 내려갑니다.

이미지의 역할은 분위기를 만드는 것이지 설득하는 게 아닙니다. 설득은 문장이 합니다. 그래서 이미지가 제목과 버튼을 밀어내고 있으면 줄이는 게 맞습니다.

다만 상품 자체를 보여줘야 하는 경우는 다릅니다. 「분위기 사진」과 「상품 사진」을 구분해서, 앞쪽은 줄이고 뒤쪽은 키웁니다.

데스크톱에서 잘 짜인 첫 화면이 모바일에서는 제목 한 줄과 이미지 절반만 보이는 경우가 흔합니다.

그리고 광고 유입의 대부분이 모바일입니다. 즉 실제로 사람들이 보는 첫 화면은 모바일 쪽인데, 만들 때는 데스크톱을 보고 만듭니다.

그래서 순서를 뒤집습니다. 모바일에서 먼저 맞추고 데스크톱을 조정합니다. 실제 기기로 열어 보는 게 가장 확실합니다.

아무리 잘 만들어도 뜨기 전에 나가면 소용없습니다. 광고비를 내고 데려온 사람일수록 아깝습니다.

대개 원인은 큰 이미지입니다. 원본 그대로 올려두고 화면에서 줄여 보여주는 경우가 많습니다. 크기를 맞춰 다시 올리는 것만으로 크게 빨라집니다.

그리고 첫 화면에 필요 없는 스크립트를 걷어냅니다. 채팅 위젯, 여러 개의 추적 코드, 폰트 파일. 아래에서 쓰는 건 나중에 불러도 됩니다.

첫 화면에 「상담 신청」, 「자료 받기」, 「전화하기」가 나란히 있으면 아무것도 안 눌립니다.

그래서 가장 원하는 행동 하나를 정하고 나머지는 아래로 내리거나 없앱니다. 선택지를 줄이는 게 전환을 올리는 가장 싼 방법입니다.

버튼 문구도 무엇이 일어나는지를 적습니다. 「신청하기」보다 「우리 경우도 되는지 확인」이 훨씬 눌립니다. 누른 뒤에 뭘 하게 될지 알기 때문입니다.

광고에서 「수입 통관 대행」을 보고 눌렀는데 첫 화면이 「글로벌 비즈니스 파트너」면 다른 곳에 왔다고 느낍니다.

그래서 광고 소재의 핵심 단어가 첫 화면에 그대로 있어야 합니다. 같은 말이 보이면 「맞게 왔다」가 되고, 그 순간부터 읽습니다.

소재를 여러 개 돌린다면 랜딩페이지도 나누는 편이 낫습니다. 하나로 다 받으면 어느 소재에도 정확히 안 맞는 페이지가 됩니다.

첫 화면을 고칠 때 대부분 더하려고 합니다. 실제로 효과가 나는 건 빼는 쪽입니다.

메뉴바, 소셜 아이콘, 공지 배너, 쿠키 알림. 이것들이 페이지를 떠날 경로이거나 화면을 가립니다. 광고 전용 랜딩페이지라면 메뉴는 아예 없애도 됩니다.

기준은 하나입니다. 이 요소가 저 버튼을 누르는 데 도움이 되는가. 아니면 뺍니다. 첫 화면에서는 이 기준이 거의 항상 맞습니다.

이어서 읽기 → 본문은 순서가 전부다