웹사이트 예시는 당신을 속인다: 에이전시를 위한 실전 가이드

요약

웹사이트 예시는 완성된 제품처럼 보이지만, 사실은 아직 묻지 않은 질문에 대한 답입니다. 대부분의 팀은 예시를 수집하고 고객에게 보여준 다음 그 모양을 복제하려고 합니다. 이 과정은 표면을 복사하는 것이지 구조를 복사하는 것이 아니기 때문에 실패합니다. 이 글은 웹사이트 예시에 관한 여섯 가지 신화를 교정합니다: 기발한 헤드라인, 모든 것을 설명하는 히어로, 추가 CTA, 업계 규칙서, '예쁘게 보이면 완성'이라는 인수인계, 템플릿 복사 본능. 각각의 교정은 모든 고객의 다음 빌드에 적용할 수 있는 반복 가능한 비평을 제공합니다. 이 순서를 한 번만 사용하면 페이지가 예시처럼 보이게 만드는 것을 멈추고, 예시가 하는 일을 페이지가 하도록 만들기 시작할 것입니다.

고객의 새 사이트가 그들이 좋아했던 예시와 똑같이 생겼는데도 여전히 죽은 느낌이 드나요? 당신만 그런 것이 아닙니다. 페이지는 같은 레이아웃, 같은 색상, 같은 굵은 글씨를 가지고 있습니다. 그런데도 전환되지 않습니다. 이유는 이렇습니다: 웹사이트 예시는 답안이지 템플릿이 아닙니다. 그것들은 특정 대상의 특정 문제 하나를 해결하기 위해 만들어졌습니다. 표면을 복사해도 그 논리는 전혀 물려받지 못합니다. 이 가이드는 웹사이트 예시에 대한 여섯 가지 신화를 제거하여, 어떤 예시든 다음 고객에게 효과가 있는 반복 가능한 비평으로 바꿀 수 있게 해줍니다. 재미있는 빌드에만이 아니라 모든 빌드에 사용하세요.

신화: 그냥 예시처럼 보이게 만들기

먼저 해야 할 일부터 시작하세요. 예시를 하나도 열기 전에, 이 페이지가 가능하게 만들어야 할 단 하나의 행동을 적으세요. 행동들이 아닙니다. 하나입니다. SaaS 페이지라면: 무료 평가판 시작. 에이전시 페이지라면: 통화 예약. 포트폴리오라면: 문의 보내기. 이제 예시를 열어보세요. 유지할 가치가 있는 것은 낯선 사람을 최소한의 마찰로 그런 결정으로 이끄는 페이지뿐입니다.

현실: 페이지는 하나의 출력을 가진 기계입니다. 대부분의 작업이 여기서 잘못됩니다. 팀은 시각적 레이어에서 시작합니다. 히어로가 마음에 들고, 색상이 마음에 들고, 글꼴 조합이 마음에 듭니다. 그래서 완전히 다른 일을 하는 페이지에 그 요소들을 재구축합니다. 결과는 예시처럼 보이지만 전혀 그렇게 작동하지 않습니다. 예시는 구조가 직무와 일치했기 때문에 전환되었습니다. 당신의 페이지는 의상을 입고 있는 것입니다.

해결책은 한 문장 테스트입니다. 수집한 모든 예시에 대해 적어보세요: 이 페이지는 [방문자 유형]에게 [하나의 행동]을 하도록 설득합니다. 그 문장을 끝낼 수 없다면, 그 예시는 장식입니다. 분위기 보드에 도움이 된다면 장식을 계속 수집해도 좋지만, 전략으로 고객 앞에 내밀지는 마세요.

이것이 여러 계정에서 어떻게 작용하는지 보겠습니다. 소프트웨어를 판매하는 고객과 코칭을 판매하는 고객이 있다고 가정합니다. 서로 다른 업계, 같은 질문입니다. 방문자가 도착합니다. 관계를 발전시키는 하나의 행동은 무엇인가요? 소프트웨어 고객에게는: 무료 평가판 시작. 코치에게는: 통화 예약. 그것들을 적어서 책상 위에 두세요. 모든 디자인 결정, 모든 카피 선택, 페이지의 모든 섹션은 그 행동을 지원하거나 스스로 제거됩니다. 이것이 반복 가능한 부분입니다. 취향에 의존하지 않습니다. 어떤 도구를 열기 전에 내린 결정에 의존합니다.

그것이 복사와 구축의 핵심 차이입니다: 복사는 보이는 것을 반복하고, 구축은 예시가 결정한 것을 반복합니다. 결정을 먼저 식별하면 피부가 아닌 뼈대를 훔칠 수 있습니다. 그렇게 하면 같은 예시가 SaaS 페이지, 에이전시 페이지, 포트폴리오에 영감을 줄 수 있습니다. 고객은 바뀝니다. 논리는 바뀌지 않습니다.

신화	현실
훌륭한 웹사이트는 독특해 보인다	훌륭한 웹사이트는 낯선 사람에게 명확한 할 일 하나를 준다
히어로는 모든 것을 설명해야 한다	히어로는 스크롤을 유도해야 한다
CTA가 많을수록 전환이 늘어난다	한 페이지, 하나의 주요 행동
명확함은 더 많은 카피를 의미한다	명확함은 더 적고 더 잘 선택된 단어를 의미한다
예시는 복사할 템플릿이다	예시는 결정의 증거이다
예쁘게 보이면 완성이다	페이지는 트래픽이 증명할 때까지 가설이다

신화: 강한 브랜드는 기발한 헤드라인을 의미한다

Calendly의 홈페이지를 보세요. 첫 줄은 '이메일을 주고받지 않고 미팅을 예약하세요.'입니다. 기발한 것이 없습니다. 말장난도, 언어유희도 없습니다. 결과를 명시하고 고통을 제거합니다. 이것이 가치 제안이 작동해야 하는 방식입니다: 고객이 얻는 변화와 당신이 제거하는 마찰을 이름 붙이는 것입니다.

현실: 명확함이 기발함을 이깁니다. 고객은 이에 대해 반발할 것입니다. 그들은 '파괴하다', '힘을 실어주다', '해방하다'를 원합니다. 그런 단어들은 클릭할지 결정하는 방문자에게 아무 의미가 없습니다. 방문자는 고객의 사명에 관심이 없습니다. 클릭한 후에 무슨 일이 일어나는지에 관심이 있습니다.

재무 코칭을 판매하는 고객을 예로 들어 보겠습니다. 그들의 현재 히어로에는 '자신감 있게 부를 쌓는 사람들을 돕습니다'라고 쓰여 있습니다. 그것은 약속이 아니라 카테고리입니다. 다시 쓰세요: '45분 통화 한 번으로 명확한 월간 저축 계획을 얻으세요.' 어떤 버전이 낯선 사람에게 무엇을 얻을 수 있는지 알려주나요? 어떤 버전이 다음 단계를 분명하게 만드나요? 그 버전을 출시하세요.

그러므로 헤드라인은 고객이 동료에게 말할 법한 문장으로 쓰세요. 슬로건이 아니라 문장으로요. 그 문장이 누구에게나 혼란을 준다면 혼란을 주지 않을 때까지 줄이세요. 그런 다음 부제목에도 같은 작업을 하세요: 단락이 아니라 한 줄의 보조 문장. 가장 명확한 페이지들은 끊임없이 이렇게 합니다. 전환율이 높은 SaaS 페이지를 보면 공통 패턴이 있습니다: 깔끔한 헤드라인, 짧은 부제목, 하나의 클릭 유도 문구. 수상 경력이 있는 예시들은 때때로 이 패턴을 깨기도 합니다. 전환되는 예시들은 거의 그렇게 하지 않습니다.

브랜드는 중요하지만, 생각하는 곳이 아닙니다. 브랜드는 목소리, 이미지, 페이지의 느낌에 있습니다. 헤드라인은 수수께끼를 내는 곳이 아닙니다. 헤드라인은 평범하게 쓰는 곳입니다. 고객이 반발하면, 처음 읽었을 때 혼란스러운 슬로건으로 존경하는 회사를 하나 대보라고 하세요. 그들은 찾지 못할 것입니다. 혼란은 행동의 적입니다.

신화: 첫 화면은 히어로에 모든 것을 채워 넣는 것이다

접히는 지점은 채워야 할 선이 아닙니다. 결정 지점입니다. 방문자는 첫 화면을 보고 세 가지 질문에 답합니다: 이것은 무엇인가? 누구를 위한 것인가? 무엇을 클릭해야 하는가? 히어로가 그 이상으로 일해야 한다면, 전환할 수 있었던 사람들을 이미 잃은 것입니다.

현실: 첫 화면은 필터입니다. 성과가 좋은 히어로 섹션을 보세요. Linear의 홈페이지가 기준입니다: 최소한의 헤드라인, 최소한의 부제목, 하나의 다음 단계. 캐러셀도 없고, '더 알아보기'가 '시작하기'와 경쟁하지도 않습니다. 그저 하나의 명확한 경로만 있습니다. 나머지 이야기는 결정 후에 옵니다. 결정 전이 아닙니다.

이 신화는 고객의 신뢰를 가장 많이 잃게 하는 신화입니다. 디자인 비용을 지불한 사람에게 빈 공간은 미완성처럼 느껴지기 때문입니다. 선을 지키세요. 명확한 헤드라인과 하나의 CTA가 있는 히어로는 미완성이 아닙니다. 그것은 필터입니다. 잘못된 방문자에게는 빨리 떠나라고 말하고, 올바른 방문자에게는 어디를 클릭할지 알려줍니다.

커버 테스트를 해보세요. 검토 중인 모든 예시의 화면 하단에 종이를 대보세요. 남은 부분에서 세 가지 질문에 답할 수 없다면 그 예시는 거부하세요. 고객의 현재 사이트에도 같은 작업을 하세요. 이 연습은 2분이 걸리며 페이지가 너무 많은 것을 하려고 한다는 것을 증명하는 가장 빠른 방법입니다.

'공간을 활용해야 합니다'라는 말을 듣게 될 것입니다. 그것은 디자인 원칙이 아니라 고객의 불안입니다. 공간은 낭비가 아닙니다. 모호함이 낭비입니다. 페이지를 이해해야 하는 방문자는 이미 떠나고 있는 방문자입니다. 첫 화면을 실용적인 질문에 답하는 데 사용하고, 창의적인 디테일은 아래쪽에서 고민하세요.

여기 반대되는 부분이 있습니다: 미니멀리즘도 목표가 아닙니다. 제품이 무엇을 하는지 말하지 않는 빈약한 히어로는 그저 예쁜 퍼즐일 뿐입니다. 명확함이 목표입니다. 미니멀리즘은 명확함을 돕는 전술이고, 어수선함은 명확함을 죽이는 전술입니다. 모든 요소가 방문자가 하나의 결정을 내리는 데 도움이 되는지 판단하세요. 도움이 되지 않으면 잘라내세요. 명확해진다면 디자인이 복잡해 보여도 유지하세요. 테스트는 '깔끔한가?'가 아닙니다. '낯선 사람이 경로를 볼 수 있는가?'입니다.

신화: CTA가 많을수록 전환 기회도 많아진다

내일 CTA 감사를 해보세요. 고객의 홈페이지를 열고 주요 행동과 경쟁하는 모든 버튼과 링크를 세어보세요. 대부분의 페이지에는 여러 개가 있습니다: '더 알아보기', '서비스 살펴보기', '문의하기', '블로그 읽기', '요금 보기'. 모든 요소가 관심을 요구하면 아무것도 관심을 받지 못합니다. 방문자는 아무것도 하지 않음으로써 반응합니다.

현실: 한 페이지, 하나의 주요 행동. 성공적인 페이지는 이에 저항합니다. 예를 들어 Notion의 사이트는 단일 클릭 유도 문구를 목표로 합니다. 한 페이지, 하나의 주요 행동. 이 규율은 선택을 강요합니다: 우리가 이 방문자에게 실제로 무엇을 하길 원하는가? 답이 '무료 평가판 시작'이라면 전체 페이지는 그 버튼을 위해 존재합니다. 다른 모든 것은 그것을 지원하거나 떠납니다.

하나의 주요 CTA는 링크가 하나뿐이라는 뜻이 아닙니다. 보조 행동은 허용됩니다. 그것들은 더 조용해야 하고, 더 나중에 배치되어야 하며, 히어로에서 주요 버튼 옆에 절대 두지 않아야 합니다. 선택지를 없애는 것이 아닙니다. 순위를 매기는 것입니다. 방문자는 여전히 탐색하고, 읽고, 비교할 수 있습니다. 하지만 페이지에는 중심이 있고, 그 중심은 한 방향을 가리킵니다.

각 고객에게 가장 중요한 버튼 하나를 정하세요. 그것을 히어로에 넣으세요. 증거 섹션 후에 반복하세요. 그런 다음 방해하지 마세요. 고객이 히어로에 두 번째 경쟁 버튼을 요청하면 어느 쪽에 25센트를 걸겠냐고 물어보세요. 그들이 선택하는 것이 주요 버튼입니다. 다른 것은 방해물입니다.

계층을 한 줄로 만드세요: 주요 버튼(하나), 보조 링크(조용히), 3차 링크(메뉴). 제안서에 적어서 고객이 디자인을 보기 전에 계획을 알게 하세요. 나중에 고객이 두 번째 주요 버튼을 요구하면 그 줄을 다시 참조하세요. 당신은 하나에 동의했습니다.

이것은 반복되는 대화입니다. 모든 고객과 하게 될 것입니다. 모든 고객이 더 많은 옵션을 요구하기 때문입니다. 매번 당신의 답은: 한 페이지, 하나의 직무, 하나의 주요 행동. 이것은 창의적인 의견이 아닙니다. 최고의 예시들에 흐르는 패턴입니다.

신화: 고객의 업계에는 고유한 규칙이 필요하다

'SaaS'와 '에이전시'를 서로 다른 종으로 취급하는 것이 실수입니다. 직무는 같습니다. 낯선 사람을 하나의 결정으로 이끄는 것입니다. 달라지는 것은 그 결정을 안전하게 느끼게 하는 데 사용하는 증거입니다.

현실: 같은 직무, 다른 증거. SaaS 페이지는 데모, 무료 평가판, 또는 제품 자체의 스크린샷으로 제품이 작동한다는 것을 증명합니다. 에이전시 페이지는 사례 연구와 결과로 팀이 일한다는 것을 증명합니다. 포트폴리오는 전후의 명확성과 고객의 말로 작업이 고용할 가치가 있음을 증명합니다. 같은 뼈대, 다른 증거.

그러므로 다른 업계의 예시라서 무시하기 전에 표면 너머를 보세요. 그것이 어떤 결정을 이끌고 어떤 증거로 시작하는지 물어보세요. 치과 예약 페이지와 SaaS 제품 예약 페이지는 같은 구조를 공유할 수 있습니다: 명확한 헤드라인, 하나의 CTA, 클릭 위험을 줄이는 증거. 치과는 '보험 번거로움 없음'이라고 말합니다. SaaS 제품은 '신용카드 필요 없음'이라고 말합니다. 다른 어휘, 같은 직무.

이것이 다른 업계의 웹사이트 예시를 빌리는 것이 효과가 있는 이유입니다. 빌린 예시는 고객이 자신의 업계가 어떤 모습이어야 한다는 가정을 깨뜨립니다. 또한 결정을 정당화할 내장된 이유를 제공합니다. 고객이 '우리 경쟁사들은 모두 이렇게 합니다'라고 말하면, 업계 밖에서 같은 직무를 더 나은 구조로 수행하는 페이지를 가리킬 수 있습니다.

결정의 무게에 대해 물어보세요. 프로젝트 관리 도구를 선택하는 방문자는 6자리 수임료를 주는 방문자보다 덜 중요한 결정을 내립니다. 구조는 유지됩니다: 하나의 직무, 하나의 CTA, 계층화된 증거. 계층은 바뀝니다. 에이전시 페이지는 더 깊은 사례 연구, 명시된 역할, 그리고 작업 관계에 대한 더 강한 감각이 필요합니다. SaaS 페이지는 데모, 무료 평가판, 속도 증거가 필요합니다.

주의 사항: 외부 예시를 사용하여 실제 업계 제약을 회피하지 마세요. 법률 회사는 데이팅 앱처럼 전환할 수 없습니다. 구조가 다르기 때문이 아니라 신뢰 요건과 결정의 무게가 다르기 때문입니다. 여전히 하나의 행동을 이끌어냅니다. 더 많은 증거와 더 적은 웃음이 필요할 뿐입니다. 업계는 규칙의 집합이 아니라 제약 조건으로 중요합니다. 직무에서 시작한 다음 증거를 조정하세요.

신화: 예쁘게 보이면 완성이다

페이지를 출시한 다음 한 번에 하나씩 변경하세요. 전환은 실제 방문자가 증명할 때까지 가설입니다. 첫 번째 버전은 예시의 증거에 기반한 추측입니다. 추측이 맞는지 알 수 있는 유일한 방법은 트래픽 앞에 내놓고 무슨 일이 일어나는지 지켜보는 것입니다.

현실: 모든 페이지는 가설입니다. 한 번에 일곱 가지 테스트를 하지 마세요. 어떤 변경이 결과를 움직였는지 알 수 없습니다. 헤드라인을 바꾸고 측정하세요. CTA를 바꾸고 측정하세요. 증거의 순서를 바꾸고 측정하세요. 한 번에 하나의 변수, 트래픽에 따라 테스트당 1-2주, 그러면 이 고객의 잠재 고객이 실제로 무엇에 반응하는지 배웁니다. 전환되는 못생긴 페이지는 전환되지 않는 예쁜 페이지를 이깁니다. 아름다움이 목표가 아닙니다. 마찰이 없는 것이 목표입니다.

그것은 못생긴 작업을 출시해도 된다는 변명이 아닙니다. 다듬기를 첫 단계가 아닌 나중 단계로 취급해야 하는 이유입니다. 증거가 보상하는 것을 다듬으세요. 추측을 다듬지 마세요. 고객이 '새로고침'을 요청하면 반발하세요. 현재 페이지가 무엇을 달성해야 하는지, 실제로 무엇을 달성하고 있는지 물어보세요. 아무도 직무를 정의하지 않았다면, 새로고침은 중심 없는 페이지에 새 페인트를 칠하는 것일 뿐입니다.

출시 전에 측정 기준을 설정하세요. 페이지의 성공으로 간주되는 하나의 지표를 정의하세요. 클릭, 전화, 양식 제출이 될 수 있습니다. 그것이 말 그대로 비즈니스 목표가 아닌 한 '참여'나 '페이지 체류 시간'이 될 수 없습니다. 그러면 테스트할 기준이 생깁니다. 트래픽이 적다면 정성적 피드백을 대신 사용하세요: 무엇을 클릭할지 묻는 고객 전화 다섯 통. 하지만 증거 없이 승자를 주장하지 마세요.

모든 출시를 감사의 시작으로 취급하세요. 방문자가 실제로 보는 방식으로 페이지를 보세요: 빠르고, 회의적이고, 약간 지루해하는. 그것은 모든 계정에 적용할 수 있는 기술이며, 그래야 합니다. 최고의 예시는 디자이너가 더 창의적이기 때문에 좋아 보이는 것이 아닙니다. 팀이 페이지가 직무와 일치할 때까지 한 가지씩 계속 변경하기 때문에 전환되는 것입니다.

이제 실행하세요

다음 고객 미팅은 예시로 시작할 것입니다. 괜찮습니다. 그것들을 활용하세요. 하지만 분위기 보드가 아니라 질문으로 시작하세요: '방문자가 이 페이지에서 무엇을 해야 하나요?' 그런 다음 그들이 좋아하는 예시를 가져와 위의 테스트를 적용하세요. 각각은 어떤 직무를 수행하나요? 세 가지 히어로 질문에 답할 수 있나요? 단일 주요 CTA가 있나요? 클릭 위험을 줄이는 증거는 무엇인가요?

반발이 있을 것입니다. 고객은 기발한 헤드라인과 추가 버튼을 옹호할 것입니다. 그때 예시가 실제로 무엇을 하는지, 어떻게 보이는지가 아니라 무엇을 하는지 상기시키세요. 신경 쓰지 않는 고객처럼 웹사이트를 감사하고 페이지가 클릭을 얻거나 잃는 속도를 보여줄 수 있습니다.

이 순서는 반복 가능합니다: 직무를 정의하고, 평범한 문장을 쓰고, 하나의 결정을 중심으로 히어로를 구축하고, 경쟁 CTA를 제거하고, 같은 직무의 예시에서 구조를 훔친 다음, 출시하고 한 번에 하나씩 변경하세요. 모든 고객, 모든 페이지에 실행하면 예시는 더 이상 스타일의 원천이 아닙니다. 전략의 원천이 됩니다. 그것이 웹사이트를 구축하는 팀과 결정을 구축하는 팀의 차이입니다.