상세페이지는 정성껏 길게 뽑았는데 정작 구매 버튼을 못 찾아 헤매다 이탈하는 손님, 생각보다 많아요. 손님이 사고 싶어진 그 순간 화면에 버튼이 없으면 그 정성이 오히려 새는 매출이 돼요. 모바일 sticky 구매 버튼을 직접 붙여보고 확인한 실측 숫자로 풀어볼게요.
상세페이지 만드느라 밤새 이미지 30장을 붙였어요. 원단 클로즈업에, 착용컷에, 사이즈 표에, 세탁법까지... 나름 정성 들여 길게 뽑았죠. 그런데 데이터를 까보니 이상하더라고요. 스크롤 끝까지 내려간 사람은 많은데 정작 구매 버튼을 누른 사람은 얼마 안 돼요. 왜냐하면 손님이 "이거 살까?" 마음먹은 그 순간, 화면 어디에도 구매 버튼이 없었거든요. 다시 엄지로 화면을 쭉 올려서 상단까지 가거나, 저 아래 끝까지 내려가야 버튼이 나오는 구조였던 거예요.
모바일에서 긴 상세페이지는 사실 함정이에요. 정보는 충분히 줬는데 결제로 이어지는 길이 끊겨 있으면, 그 정성이 오히려 이탈을 만들거든요. 오늘은 화면 하단에 늘 붙어 다니는 sticky 구매 버튼이 실제로 전환에 어떤 차이를 냈는지, 제가 직접 붙여보고 확인한 숫자로 풀어볼게요.
구매는 논리로만 일어나지 않아요. 감정이 딱 올라오는 순간이 있어요. 착용컷을 보다가 "아 이거 예쁘다", 후기 사진 스크롤하다가 "나랑 비슷한 체형이네", 이럴 때 바로 손이 가야 해요. 근데 그 순간 버튼이 화면 밖에 있으면요? 손님은 버튼을 찾으려고 스크롤을 위아래로 헤매요. 그 3~4초 사이에 카톡 알림이 뜨고, 인스타로 넘어가고... 그렇게 이탈해요.
PC는 그나마 화면이 넓어서 오른쪽에 구매 영역이 계속 보여요. 문제는 매출의 대부분이 나오는 모바일이에요. 저희 스토어도 모바일 비중이 87% 정도 되는데, 세로로 긴 화면에서는 한 번에 보이는 영역이 좁잖아요. 그래서 "지금 이 화면에 구매 버튼이 있느냐"가 생각보다 훨씬 크게 작동해요.
Sticky 구매 버튼은 화면 맨 아래에 고정돼서 스크롤을 아무리 내려도 항상 따라다니는 바(bar)예요. 원단 설명을 읽든, 사이즈 표를 보든, 후기를 넘기든, 손님 엄지 바로 위에 늘 "구매하기"가 대기하고 있는 거죠. 결심한 그 자리에서 바로 누르게 만드는 게 핵심이에요.
저희 여성 의류 스토어 기준으로, 상세페이지 하단에 sticky 구매 바를 붙이기 전과 후를 2주씩 비교해봤어요. 트래픽 성격이나 광고 세팅은 최대한 비슷하게 맞췄고요. 아래는 실측치인데, 스토어마다 상품가·객단가·상세페이지 길이가 다르니 그대로 나온다는 보장은 없어요. 어디까지나 참고용 추정으로 봐주세요.
| 지표 | 도입 전 | 도입 후 | 변화 |
|---|---|---|---|
| 상세페이지 → 장바구니 전환율 | 4.1% | 5.3% | +29% |
| 모바일 최종 구매전환율 | 1.8% | 2.3% | +0.5%p |
| 구매 버튼 노출 대비 클릭률 | 측정 불가 | 11.2% | − |
| 평균 페이지 체류시간 | 52초 | 58초 | +6초 |
가장 크게 움직인 건 장바구니 담기 전환이었어요. 최종 구매전환은 0.5%p 정도 올랐는데, 숫자만 보면 작아 보여도 이게 매출로 환산되면 꽤 커요. 월 방문 3만이고 객단가 3만9,000원이라 치면, 1.8%에서 2.3%로 오른 것만으로 구매 건수가 540건에서 690건으로 늘어요. 월 매출로 약 585만원 차이... 버튼 하나 붙이는 코드 몇 줄로요.
물론 이건 부가세랑 원가, 광고비 빼기 전 매출 기준이에요. 실제 통장에 남는 돈은 여기서 수수료·원가·세금을 다 걷어내야 나와요. 전환율 숫자에 취해서 순이익 착시에 빠지지 않으려면, 늘 순수익 기준으로 봐야 해요. 저는 대시부스터에서 원가·수수료·부가세 다 뺀 실제 순수익을 실시간으로 보고 있어서, 이런 변화가 진짜 남는 돈으로 얼마나 이어지는지 바로 확인했어요.
여기서 많이들 실수하는 게 있어요. sticky 버튼을 붙이긴 했는데 오히려 전환이 안 오르거나, 심하면 후기 사진을 가려서 답답해지는 경우요. 몇 가지는 꼭 챙겨야 해요.
첫째, 버튼 바가 콘텐츠를 가리면 안 돼요. 특히 하단 고정 바가 후기 영역이나 사이즈 표를 덮으면 손님이 정보를 못 봐요. 상세페이지 맨 아래에 여백(padding)을 버튼 높이만큼 넣어줘서, 스크롤 끝에서도 마지막 콘텐츠가 버튼에 안 가리게 해야 해요.
둘째, 버튼에 정보를 실어주세요. 그냥 "구매하기"보다 "39,000원 · 구매하기"처럼 가격을 같이 보여주면 클릭률이 더 좋았어요. 손님이 스크롤하다가 가격을 까먹는 경우가 은근 많거든요. 재입고 임박이나 무료배송 조건 같은 걸 짧게 얹어도 좋고요.
셋째, 옵션이 있는 상품은 바로 옵션 선택으로 연결하세요. 버튼 눌렀는데 다시 위로 올라가서 색상·사이즈 고르라고 하면 그 순간 또 이탈해요. 버튼 탭하면 하단에서 옵션 시트가 슥 올라오게 하는 게 제일 매끄러웠어요.
넷째, 상세페이지 자체가 부실하면 버튼은 소용없어요. 애초에 손님이 "사고 싶다"는 감정에 도달을 못 하니까요. 착용컷·디테일컷이 약하면 버튼 위치를 아무리 최적화해도 한계가 있어요. 이 부분은 상세페이지 사진 쪽을 먼저 손보는 게 순서예요.
버튼 배치도 은근 취향 싸움이 아니라 데이터 싸움이에요. 제가 몇 가지 조합을 돌려본 결과, 상단에 한 번(첫 화면 착용컷 아래) + 하단 sticky 조합이 제일 안정적이었어요. 첫 화면에서 이미 마음 정한 급한 손님은 상단에서 바로 누르고, 끝까지 다 읽는 신중한 손님은 하단 sticky로 잡는 거죠.
반대로 페이지 중간중간에 버튼을 서너 개씩 뿌리는 건 별로였어요. 스크롤 흐름이 자꾸 끊기고, 오히려 "왜 이렇게 사라고 보채지" 하는 느낌을 줘요. 하단 sticky가 항상 따라다니는데 굳이 중간에 또 넣을 이유가 없더라고요.
그리고 이건 꼭 말하고 싶은데, 버튼 색이랑 크기도 무시 못 해요. 브랜드 톤이랑 완전히 따로 노는 형광색까지는 아니어도, 배경과 대비가 확실한 색으로 엄지가 닿기 편한 크기(높이 최소 48px)로 만들어야 해요. 손 큰 남자 손님이든 네일한 여자 손님이든 한 번에 정확히 눌리게요.
이렇게 버튼 위치·문구를 바꾸면 전환율이 실시간으로 움직이는데, 이걸 감으로만 보면 놓쳐요. 저는 실시간 매출 추적으로 오늘 들어온 주문이 어제 대비 어떻게 흐르는지 보면서 판단해요. 어제 버튼 문구 바꿨는데 오늘 오전 전환이 미묘하게 좋아졌다, 이런 걸 바로 캐치할 수 있거든요.
긴 상세페이지는 좋은 거예요. 정보 많고, 신뢰 쌓이고, 손님이 궁금한 걸 다 풀어주니까요. 근데 그 긴 여정 내내 결제로 가는 문이 손 닿는 곳에 없으면, 정성이 이탈로 새요. Sticky 구매 버튼은 거창한 기능이 아니에요. 손님이 사고 싶어진 그 순간에, 바로 그 자리에서 살 수 있게 해주는 배려일 뿐이에요.
오늘 당장 할 일은 간단해요. 본인 스토어를 모바일로 열어서 상세페이지를 손님처럼 끝까지 스크롤해보세요. 후기 다 읽고 "이거 사야지" 마음먹은 그 화면에 구매 버튼이 보이나요? 안 보인다면, 그게 바로 새고 있는 매출이에요.
버튼 바가 후기나 사이즈 표 같은 핵심 콘텐츠를 가리고 있을 가능성이 커요. 하단에 버튼 높이만큼 여백을 넣었는지, 옵션 선택이 매끄럽게 연결되는지 먼저 확인해보세요. 그래도 안 오르면 상세페이지의 착용컷·후기 자체가 구매 욕구를 못 만드는 거라, 콘텐츠부터 손봐야 해요.
안 많아요. 급한 손님은 상단에서, 신중한 손님은 끝까지 읽고 하단에서 눌러요. 두 유형을 다 잡는 조합이에요. 오히려 페이지 중간중간에 버튼을 대여섯 개 뿌리는 게 흐름을 끊어서 역효과예요.
방문자를 반씩 나눠 한쪽만 sticky 버튼을 노출하는 A/B 테스트가 가장 정확해요. 통으로 바꾸고 전주 대비로 보면 요일·시즌·광고가 섞여서 착각하기 쉬워요. 최소 2주, 각 그룹 구매 100건 이상 쌓인 뒤에 판단하세요.
버튼 하나 바꿔 전환이 올라도, 원가·수수료·부가세 빼면 실제 순수익은 다를 수 있어요. 대시부스터는 다 걷어낸 진짜 남는 돈을 실시간 대시보드로 보여줘요.
7일 무료로 시작하기 →