머니투데이

속보
통합검색

효과적인 상품 노출의 노하우 드림위버를 이용한 오픈마켓 상품페이지 편집하기

머니투데이
  • 주영욱 쇼핑몰뉴스
  • 카카오톡 공유하기
  • 카카오톡 나에게 전송하기
  • 페이스북
  • 트위터
  • 네이버
  • 카카오스토리
  • 텔레그램
  • 문자
  • VIEW 6,200
  • 2010.10.29 22:33
  • 글자크기조절
  • 댓글···

[연재] 임화연과 함께 하는 Self Design 8

오픈마켓(G마켓, 옥션, 11번가)은 시장 진입이 쉽기 때문에 하루에도 수많은 상품들이 등록되고 있다. 워낙에 많은 상품이 진열되어 있는 오픈마켓에서는 고객이 한번 들어와서 구매를 했다고 해도 어느 판매자의 상품인지를 기억하고 또 찾아온다는 것은 어려운 일이다.

단지 고객이 기억하는 것은 ‘11번가에서 샀다’ 혹은 ‘G마켓에서 샀다’ 이런 정도의 사이트 이름을 기억하는 것뿐이다. 되도록 판매자가 가지고 있는 모든 상품을 한 페이지에 보여주고, 클릭하고 들어왔지만 그 상품이 마음에 안 들어도 다른 상품으로 유도할 수 있도록 해야 한다.

한번 클릭하고 들어온 고객은 절대 놓치지 않도록 하는 것이 가장 중요한 포인트이다.

어떻게 하면 한번 들어온 고객에게 모든 것을 전달할 것인가? 많은 상품을 무조건 나열만 한다면, 무한히 내려가는 스크롤 때문에 고객들은 어떤 상품을 봤는지 조차 헷갈리고 페이지를 로딩하는 시간도 오래 걸려서 고객을 머물게 하기가 어렵다.

그래서 선택하는 방법이 대표 이미지 컷만 진열하고, 클릭하면 새 창으로 상세이미지들을 보여줄 수 있는 자바스크립트 방식이다.

고객은 좋은 퀄리티의 대표 이미지들을 살펴보다가 마음에 드는 상품을 클릭하여 보다 자세하게 살펴 볼 수 있어 판매자와 고객 모두에게 좋은 방법이다.

하지만 이런 방법은 오픈마켓에서는 전체 오픈마켓 사이트의 디자인을 헤칠 우려가 있어서, 이런 자바스크립트방식을 별로 좋아하지 않는 이유로 이런 상품페이지를 모두 제한하고 있다.

호스팅 서비스를 이용하는 방법과 드림위버의 몇 가지 기능만으로 간단하게 그 문제를 해결할 수 있다. 따라하기 이번 컬럼에서는 드림위버로 편집하는 과정이 주 내용이다. 드림위버를 이용해서 오픈마켓용 상품페이지를 편집하고, 오픈마켓에서 제한하는 스크립트를 어떻게 우회해서 표현하는지를 살펴보는 시간이다.

tip 드림위버 사용기능 : 테이블 편집, 이미지 삽입, 롤오버 버튼 만들기, 이미지 맵, 새창띄우기, 아이프레임 포토샵으로 기본 이미지 준비하기 포토샵으로 등록할 상품페이지를 만들고, 각 상품을 클릭했을 때 이동할 페이지를 디자인한다.

1. 메인상품 상세페이지
효과적인 상품 노출의 노하우 드림위버를 이용한 오픈마켓 상품페이지 편집하기

효과적인 상품 노출의 노하우 드림위버를 이용한 오픈마켓 상품페이지 편집하기


메인 상품상세페이지에 보여질 이미지와 각 상품을 클릭했을 때 새창으로 보여질 이미지들을 디자인하고, 하나씩 잘라서 images 폴더에 모아서 저장해 둔다.
효과적인 상품 노출의 노하우 드림위버를 이용한 오픈마켓 상품페이지 편집하기



[ 도움말 ; 쇼핑몰뉴스 (//www.shoppingmallnews.co.kr/) ]

머니투데이 머니위크 MnB센터 _ 프랜차이즈 유통 창업 가맹 체인 B2C 사업의 길잡이



베스트클릭

오늘의 꿀팁

  • 날씨
  • 건강쏙쏙

많이 본 뉴스

머니투데이 페이스북 퀴즈 이벤트
머니투데이 기업지원센터

포토 / 영상

머니투데이 SERVICE