전자 상거래 비즈니스를 위한 완벽한 제품 페이지를 만드는 방법
게시 됨: 2021-08-15제품 페이지 디자인은 상점에서 가장 중요하고 복잡한 페이지 중 하나입니다. 잠재 고객이 제품 페이지에 방문할 수 있는 모든 상황을 고려하세요.
- 검색 엔진에서 직접
- 매장을 둘러본 후
- 타겟 광고 클릭 후
판매의 마지막 단계 중 하나로 제품 페이지는 다음과 같아야 합니다.
- 쉽게 찾을 수 있도록 최적화되어 있으며,
- 고객에게 확신을 심어주기에 충분한 정보를 제공하고,
- 훌륭한 온라인 쇼핑 경험을 제공하도록 잘 설계되었습니다.
사람들이 귀하의 제품 페이지를 찾을 가능성을 높이고 해당 페이지에 도달한 후 전환율을 높이기 위해 할 수 있는 일에는 여러 가지가 있습니다. 문제를 세분화하기 위해 완벽한 제품 페이지를 만들기 위한 5부 가이드를 만들었습니다.
1부: 훌륭한 제품 페이지 디자인의 구성 요소 이해
제품 페이지의 각 측면을 최적화하는 방법에 대한 세부 정보를 살펴보기 전에 각 구성 요소가 어떻게 구성되고 왜 중요한지 이해하기 위해 훌륭한 제품 페이지 디자인 예제를 살펴보겠습니다.
Uniqlo Australia는 사용자를 염두에 두고 디자인된 제품 페이지의 훌륭한 예입니다. 다음은 주요 구성 요소가 강조 표시된 일반적인 제품 페이지 중 하나의 스크린샷입니다.
즉시 페이지의 90% 이상이 고객이 보고 있는 제품에 대한 추가 정보를 제공하는 데 전념하고 있으며 스크롤 없이 볼 수 있는 부분에 공간을 거의 낭비하지 않는다는 것을 알 수 있습니다. 각 섹션을 더 세분화하려면:
- 제품 제목과 개요를 쉽게 찾을 수 있습니다. 건물과 표지판이 새로운 도시를 방문할 때 참조 지점 역할을 하는 것처럼 좋은 제목은 고객이 새로운 사이트를 탐색하는 데 도움이 됩니다.
- 다양한 각도에서, 모델과 함께, 가까이에서 제품을 보여주는 이미지 갤러리입니다.
- 제품 이미지는 정면과 중앙입니다. 흰색 배경에 선명한 사진은 최상의 조명에서 제품을 보여줍니다. 이미지는 고객이 찾는 것이기 때문에 눈에 띄게 만드는 것이 좋습니다.
- 제품이 무엇인지, 제품 디자인에 대한 생각과 구매자의 문제를 해결하는 방법을 설명하는 제품에 대한 독특하고 상세한 설명.
- 귀하의 제품과 브랜드에 대한 신뢰를 구축하는 데 도움이 되는 성실한 고객 리뷰.
- 고객은 자신이 원하는 것이 무엇인지 알지만 찾는 방법을 모를 수 있습니다. 최근에 본 제품이나 관련 제품을 표시하면 선택의 폭을 더 빨리 좁힐 수 있고 선호할 것으로 생각되는 제품을 선보일 기회를 얻을 수 있습니다.
- 한 페이지에 다양한 옵션과 변형이 있으므로 고객이 여러 제품을 탐색할 필요가 없습니다.
- 고객이 옵션 선택을 마친 직후 "장바구니에 추가" 버튼이 기다리고 있습니다.
- 커밋할 준비가 되지 않았나요? 배송 및 반품 정책과 같은 추가 정보에 대한 링크는 남아 있는 질문에 답하는 데 도움이 됩니다.
나는 항상 다른 상점들이 그들의 제품 페이지를 어떻게 디자인했는지 보는 것이 도움이 된다고 생각합니다. 꼭 같은 업종의 매장만 볼 필요는 없습니다. 다른 산업에서 인기 있는 웹사이트가 고객이 좋아하지만 경쟁업체에서 활용하지 않는 전략이 무엇인지 살펴보십시오.
대부분의 성공적인 제품 페이지에서 다음과 같은 동일한 구성 요소의 변형을 찾을 수 있습니다.
- 명확하고 독특한 설명
- 훌륭한 제품 사진
- 구매자의 신뢰를 심어주는 리뷰
- 사용자 정의 옵션
- "장바구니에 추가" 버튼 지우기
- 추가 배송 또는 구매 정보
파트 2: 제품 카피에서 이 질문에 답하십시오
훌륭한 카피는 제품 페이지에 매우 중요합니다. 고객뿐만 아니라 SEO도 마찬가지입니다. 제조업체 또는 일반 제품 정보를 사용하는 것은 제품이 검색 순위에서 경쟁력이 없는지 확인하는 확실한 방법입니다.
훌륭한 제품 페이지 사본을 만들기 위해 답변할 수 있는 몇 가지 질문이 있습니다.
그것은 무엇입니까?
제품 사본에서 가장 먼저 해결해야 하는 것은 제품이 정확히 무엇인지입니다. 고객이 특정 제품을 찾고 있다면 이것이 가장 먼저 답을 얻고자 하는 것입니다.
신제품의 경우 정확히 그것이 무엇인지, 왜 관심을 가져야 하는지 알고 싶어합니다.
문제를 어떻게 해결합니까?
귀하의 제품은 어떤 문제를 해결하고 어떻게 해결합니까? 이것은 고객에게 대답해야 하는 근본적인 질문입니다.
아마도 그것은 당신을 따뜻하게 해주는 스웨터와 같은 효용 기능만큼 단순할 것입니다. 이 경우 제품 솔루션을 가능하게 하는 데 도움이 된 재료 또는 제조 프로세스를 포함하십시오.
또는 문제는 요구 사항의 계층 구조에서 조금 더 아래에 있으며 제품이 더 세련되게 보이도록 도와줍니다. 제품의 이면에 있는 어떤 스토리나 프로세스가 소유하고 싶어지는가?
광고
그것이 무엇이든, 제품이 해결하는 문제를 식별함으로써 고객이 구매할 때 스스로에게 묻는 질문을 이해하고 그에 대한 답을 얻기 위해 사본을 맞춤화할 수 있습니다.
왜 당신의 제품인가?
문제가 있고 제품이 문제를 해결할 수 있는 방법을 확인했습니다. 이제 경쟁 제품보다 귀사의 제품을 선택해야 하는 이유는 무엇입니까? 스웨터가 가장 따뜻하도록 하기 위해 어떤 추가 조치를 취했습니까? 다른 사람이 사용하지 않는 재료는 무엇입니까? 귀사의 제품이 특별한 이유를 보여줄 기회입니다.
다른 제조업체의 제품을 판매하더라도 시간을 내어 이 제품이 더 나은 이유를 이해하고 있음을 보여주는 것은 시간을 내어 조사를 했다는 의미입니다.
무엇으로 만들어져 있나?
추가할 마지막 세부 정보는 제품에 대한 메타데이터로 간주될 수 있는 것입니다. 제품에 들어가는 재료나 성분에 대한 정보를 제공하면 온라인 쇼핑객이 제품을 직접 느낄 수 없는 것을 보완하는 데 도움이 됩니다.
성분과 같은 간단한 정보와 관리 방법 또는 용도와 같은 기본 지침은 고객이 제품을 시각화하고 검색 엔진에 더 많은 컨텍스트를 제공하는 데 도움이 될 수 있습니다.
3부: 멋진 제품 이미지 만들기
귀하의 제품 사진은 종종 고객이 페이지에서 가장 먼저 보는 것이며 부정적인 또는 긍정적인 빛으로 귀하의 제품을 즉시 비출 수 있습니다. 그러나 첫인상 외에도 제품 사진은 텍스트만으로 가능한 것보다 훨씬 더 많은 세부 사항을 전달하는 데 도움이 되므로 제품 판매에 도움이 될 수 있습니다. 제품 사진을 잘 찍으면 고객 서비스 및 반품에 소요되는 리소스의 수도 줄일 수 있습니다.
따라서 훌륭한 제품 이미지를 만들기 위해 수행해야 하는 작업은 다음과 같습니다.
좋은 사진으로 시작하세요
적절한 장비 없이 촬영한 조명이 약한 사진은 고객에게 위험 신호가 될 수 있습니다. 괜찮은 사진을 촬영하는 데 시간을 들이지 않으면 실제로 편집에 더 많은 시간이 소요될 수 있습니다.
하지만... 훌륭한 소규모 사진 설정을 얻기 위해 많은 돈을 쓸 필요는 없습니다. DIY 제품 사진에 대한 더 나은 레모네이드 스탠드 가이드에는 모든 예산으로 DIY 제품 사진을 시작할 수 있는 방법이 나와 있습니다.
DIY 제품 사진 설정을 위한 기본 요구 사항은 다음과 같습니다.
- 좋은 품질의 카메라 또는 스마트폰: 제품 사진에 DSLR 카메라가 반드시 필요한 것은 아닙니다. 스마트폰은 빛과 조리개 조건을 조정하기에 충분한 해상도와 적절한 수의 설정을 가진 사진을 생성합니다.
- 일관된 광원: 조명은 제품의 가장 중요한 기능을 밝히고 그림자를 숨기는 데 도움이 되어야 합니다. 자연광은 인공 조명만큼 비싸거나 까다롭지 않기 때문에 시작하기에 이상적입니다. 그러나 광원을 양쪽에서 고르게 분배하려면 보조광이나 거울을 사용해야 합니다.
- 흰색 배경: 흰색 배경은 빛을 고르게 굴절시켜 대비를 수정하는 데 필요한 작업을 줄여줍니다. 또한 나중에 Magic Wand 또는 펜 도구를 사용하여 사진을 훨씬 쉽게 편집할 수 있습니다. 시작하기 위해 종이 롤이나 충분히 흰색 시트를 사용할 수 있습니다.
- A Steady Surface: 사진을 고르게 찍기 위해.
- 클립: 배경이나 조명을 제자리에 고정합니다.
- A 삼각대: 카메라를 고정합니다. 삼각대가 필수는 아니지만 다양한 제품에 대해 일관된 사진을 빠르게 찍는 데 도움이 됩니다. 1인 사진 작업인 경우 작업을 더 쉽게 만들고 후반 작업 시간을 절약할 수 있습니다.
여러 이미지 사용
하나의 제품 샷을 사용하는 것만으로는 충분하지 않습니다. 고객은 다양한 각도와 관점에서 제품을 보고 싶어 합니다. 제품 사진은 어떤 설명보다 제품의 가장 중요한 측면을 훨씬 더 잘 보여줄 수 있으므로 고객의 질문에 답하기 위해 필요한 만큼 사진을 추가하는 것이 중요합니다.
다른 사진은 구매 프로세스의 여러 단계에서 다양한 수준의 중요성을 가질 수도 있습니다.
신규 고객이 귀하의 제품을 처음 발견할 때 제품을 사용하는 다른 사람들의 이미지를 보고 싶어할 수 있습니다. 이것은 타일과 같은 제품의 경우 특히 중요합니다. 제품 자체로는 이점은 물론이고 제품의 기능을 설명하기에 충분하지 않습니다. 따라서 회사는 제품 사진을 사용하여 제품 사진을 사용하는 방법과 이유를 설명합니다.
그러나 실제 제품 페이지를 파고들면 제품 자체에 초점을 맞춘 보다 자세한 사진을 찾을 수 있습니다. 사용자가 제품 페이지를 방문하면 제품이 문제를 해결하는 방법을 발견하고 제품이 얼마나 잘 해결되는지에 대해 더 관심을 갖게 됩니다.
사진 편집
사진이 있으면 소매용으로 만들기 위해 몇 가지 작업을 수행해야 합니다. 가장 확실한 작업은 배경을 제거하는 것입니다. 흰색 화면이 있으면 Adobe Creative Cloud Magic Wand 또는 Pen 도구를 사용하여 시간을 절약할 수 있습니다.
광고
그런 다음 대비 또는 조명 설정을 조정하여 이미지 품질을 향상시키거나 자연광의 변화를 보정할 수 있습니다. 하지만 이미지 조건을 일관되게 유지해야 합니다. 어떤 종류의 필터도 추가하지 않는 것이 좋습니다.
사진 편집 소프트웨어에 액세스할 수 없는 경우 기본 사진 편집에 필요한 모든 도구가 있는 Pixlr과 같은 온라인 도구를 사용할 수 있습니다. Pixc와 같은 서비스는 또한 편집되지 않은 이미지를 가져와 전문적으로 편집된 제품 사진을 반환함으로써 이미지 편집 요구 사항을 처리할 수 있습니다.
이미지 최적화
마지막 단계는 사진이 속도와 SEO 모두에 최적화되어 있는지 확인하는 것입니다.
이미지 크기가 적절한지 확인하십시오. Shopify는 제품 이미지를 70kb 미만으로 유지할 것을 권장합니다. 이것은 이미지를 저장할 파일 형식의 유형을 알면 달성할 수 있습니다. 경험에 따르면:
- GIFS 는 아이콘 및 축소판에 적합한 저품질 이미지입니다. 애니메이션도 지원하지만 파일 크기와 품질이 좋지 않아 큰 이미지에는 적합하지 않습니다.
- SVG 는 벡터 형식입니다. 즉, XML을 사용하여 이미지 내용을 텍스트 형식으로 설명합니다. 아이콘과 기본 이미지를 거의 즉시 매우 작은 파일 크기로 로드하지만 일반 이미지는 이 형식으로 사용하기에는 너무 복잡합니다.
- PNG 이미지는 더 적은 압축을 지원하는 더 빠른 파일이므로 원본 이미지 품질을 유지합니다. 그들은 또한 회색조와 투명도를 지원하지만 파일 크기는 일반적으로 전자 상거래 목적으로 너무 큽니다.
- JPG 는 압축 정도를 변경할 수 있는 압축 방법을 나타냅니다. 일반적으로 JPG 이미지는 품질 저하 없이 파일 크기를 최대 10배까지 줄일 수 있습니다. 따라서 파일 크기가 작은 고품질 제품 이미지를 만드는 데 이상적입니다.
또한 적절한 파일 이름으로 이미지 이름을 지정하고 이미지와 콘텐츠를 정확하게 설명하는 제목과 대체 태그를 사용하는지 확인하세요. Alt 태그를 사용하여 주목할만한 키워드를 포함할 수 있지만 주요 목적은 접근성을 돕는 것입니다.
4부: 제품 사진의 일관성 유지
훌륭한 전자 상거래 상점은 개별 제품 페이지 또는 유사한 제품 모음에서 똑같이 잘 작동하는 제품 사진을 사용합니다. 일관된 이미지를 사용하면 제품을 더 쉽게 검색하고 비교할 수 있으며 브랜드에 대한 일관성과 전문성을 구축할 수도 있습니다.
제품 사진을 일관되게 유지하는 가장 좋은 방법은 다음과 같습니다.
흰색 배경에 제품 사진 찍기
지속적으로 멋진 제품 사진을 만드는 가장 쉬운 방법 중 하나는 흰색 배경을 활용하는 것입니다. 이전 사진 게시물에서 자신만의 사진 설정을 만들고 전문가 수준의 제품 사진을 찍는 방법에 대해 설명했습니다.
흰색 배경에 사진을 사용하면 다음을 수행할 수 있습니다.
- 모든 제품에서 일관성 만들기
- 제품의 특정 측면 향상
- 나중에 사진을 쉽게 편집하고
- 흰색 배경이 필요한 Google 쇼핑 및 Amazon과 같은 마켓플레이스에서 제품을 판매하세요.
동일한 치수 또는 종횡비 사용
컬렉션 페이지에서 다양한 크기의 이미지보다 더 눈에 띄는 것은 없습니다. CSS를 사용하여 특별히 최소 높이와 너비를 설정하지 않는 한 컬렉션 페이지는 엉망이 될 것입니다. 사용자는 클릭할 위치를 해독하는 데 소중한 쇼핑 시간을 보내야 합니다.
간단한 제품 컬렉션 페이지도 고려하십시오. 왼쪽의 멀티 사이즈 제품과 비교하여 오른쪽의 정사각형 제품을 탐색하고 비교하는 것이 얼마나 쉽습니까?
어느 것이 더 좋아 보입니까?
이미지를 정사각형으로 만들 수 있는 앱과 플러그인이 있지만 가장 좋은 방법은 제품 이미지가 항상 특정 크기로 저장되도록 하는 것입니다.
가장 긴 면이 1000픽셀에서 1600픽셀 사이의 크기로 이미지를 만드는 것은 괜찮지만 모든 이미지를 정사각형으로 유지해야 합니다. 정사각형 이미지는 이미지가 수평이든 수직이든 상관없이 좋아 보이며 매장 전체에서 이미지를 일관되게 유지합니다.
제품 템플릿 활용
전문적인 전자 상거래 상점을 얻으려면 제품 이미지 전체에 일관성을 만들어야 합니다. 이것은 크기가 같을 뿐만 아니라 이미지 내에서 유사한 스타일과 일관된 위치를 가진 사진을 갖는 것을 의미합니다.
성공적인 전자 상거래 상점을 보면 이미지가 그 자체로 눈에 띄지만 모두 카메라에서 같은 거리에 위치하므로 컬렉션에 잘 맞는다는 것을 알 수 있습니다.
광고
모든 사진에서 제품이 일관되게 배치되도록 하는 것은 까다로울 수 있습니다. 이때 제품 템플릿이 도움이 될 수 있습니다.
제품 템플릿을 사용하면 제품이 사진의 동일한 영역에 일관되게 배치되고 올바른 크기로 조정됩니다. 제품 이미지에 텍스트를 포함하는 경우 특히 중요할 수 있습니다.
Photoshop을 사용하여 기본 제품 템플릿 파일을 만들려면:
- 원하는 너비와 높이로 새 포토샵 파일을 만듭니다. 색상 모드가 RGB 색상 - 8비트, 해상도가 최소 72픽셀/인치, 배경 콘텐츠가 흰색 또는 투명으로 설정되어 있는지 확인하십시오.
- 다음으로 메인 메뉴의 "보기"에서 "새 가이드"를 선택합니다.
- 10% 수직 가이드를 만들고 단계를 반복하여 다음을 얻습니다.
- 10% 수직 및 수평 가이드
- 90% 수직 및 수평 가이드
- 50% 수직 및 수평 가이드
- 다음과 같이 끝내야 합니다.
- 이제 템플릿 위에 이미지를 배치할 수 있습니다. 가이드는 이미지가 가로 및 세로 모두 중앙에 있음을 알 수 있는 참조를 제공합니다. 또한 모든 제품이 일관된 규모로 배치되도록 하는 데 도움이 됩니다.
이제 파일을 일반 Photoshop 문서(.PSD)로 저장하면 가이드가 여러분을 기다리고 있습니다. 당신이 만든 가이드를 사용하면 편집된 제품 사진을 빠르게 업로드하고 웹사이트 전체에서 일관되게 멋지게 보이게 할 수 있습니다.
5부: 제품 사진을 한 단계 업그레이드하십시오!
훌륭한 제품 사진과 훌륭한 제품 설명이 있으면 전환율이 높은 제품 페이지를 만들 수 있습니다. 그러나 가능한 최고의 페이지를 만들기 위해 제품 사진을 개선하기 위해 할 수 있는 마지막 몇 가지 작업이 있습니다.
이미지 속도 향상
이미지는 페이지 로드 시간에 큰 영향을 줄 수 있습니다. 제품 페이지의 로드 속도가 느리면 방문자는 로드될 때까지 기다리다가 짜증이 나서 더 적은 페이지를 방문하게 됩니다. 실제로 방문자의 40%는 로드하는 데 3초 이상 걸리면 웹사이트를 이탈합니다. 따라서 제품 페이지는 로드가 빠르고 탐색하기 쉬워야 합니다. 다음은 이를 달성하기 위해 이미지를 최적화할 수 있는 여러 가지 방법입니다.
하나는 이미지 대신 페이지 배경에 CSS를 사용하는 것입니다. 마찬가지로 CSS는 이미지와 버튼 요소 주위에 테두리를 만드는 데 사용해야 합니다.
플러그인이나 이미지 갤러리를 로드하는 외부 라이브러리도 페이지의 전체 로드 시간을 늦출 수 있으므로 페이지의 중요한 요소에 대해서는 피해야 합니다.
또한 Google PageSpeed Insights를 통해 페이지를 실행하여 모바일 및 데스크톱 사이트의 속도를 높이는 방법을 식별할 수도 있습니다. Google PageSpeed는 압축할 수 있는 이미지, 이미지를 최적화하는 방법 및 그렇게 함으로써 절약할 수 있는 공간을 알려줍니다.
브라우저에 내장된 개발자 도구는 페이지에서 파일을 로드하는 방법과 시간이 오래 걸리는 파일도 식별할 수 있습니다.
Chrome에서 이 작업을 수행하려면 다음을 수행합니다.
광고
- 분석하려는 페이지를 마우스 오른쪽 버튼으로 클릭
- "네트워크"를 선택하십시오
- 페이지 새로고침
어떤 이미지를 로드하는 데 가장 오래 걸리는지 파일 "유형"별로, 가장 큰 파일을 보려면 "크기"로, 얼마나 오래 걸리는지 보려면 "시간"으로, 또는 로드할 수 없는 파일이 있는지 보려면 "상태"별로 정렬할 수 있습니다. 짐을 실은.
또한 3부의 팁을 사용하여 이미지가 속도와 SEO에 최적화되어 있는지 확인하십시오.
모바일용 페이지 최적화
다양한 모바일 장치에서 제품 페이지가 어떻게 표시되는지 확인하는 데 시간을 할애하는 것이 중요합니다. Hotjar와 같은 도구를 사용하면 사용자가 페이지와 상호 작용하는 방식에 대한 히트맵을 만들 수 있습니다. 또한 Google Analytics가 설치되어 있는 경우 모바일 및 데스크톱 전환율을 비교하여 모바일 쇼핑 경험이 만족스러운지 확인할 수 있습니다.
Google Analytics는 전환율 및 구매 여정에 대한 유용한 전자상거래 데이터를 제공할 수 있지만 웹사이트가 여러 기기에서 어떻게 보이는지 경험하는 가장 간단한 방법은 직접 경험하는 것입니다. Chrome 기기 도구 모음(또는 Firefox 또는 Safari를 사용하는 경우 반응형 디자인 모드)을 사용하면 모든 기기에서 제품 페이지가 어떻게 보이는지 확인할 수 있습니다.
모바일 제품 페이지에 대한 몇 가지 고려 사항:
- 이미지를 전면 중앙에 배치합니다. 사용자가 원할 때 추가 정보를 사용할 수 있어야 하지만 이미지를 방해해서는 안 됩니다.
- 이미지 크기를 줄이고 타사 플러그인을 너무 많이 로드하지 않도록 하여 사이트 속도를 높입니다. 로딩 시간은 모바일 네트워크를 통해 로딩하는 고객에게 특히 중요합니다.
- 고객이 항상 검색 표시줄, 기본 메뉴 및 장바구니에 액세스할 수 있도록 고정 메뉴 표시줄을 사용하는 것이 좋습니다.
고객은 모바일 장치에서 콘텐츠를 탐색하고 읽는 데 시간을 덜 소비하므로 이미지는 모바일 쇼핑객에게 특히 중요한 역할을 합니다. 최고의 모바일 쇼핑 경험을 제공할 수 있도록 이미지가 눈에 잘 띄고 로드가 빨라야 합니다.
SEO 기억하기
제품 페이지는 종종 SEO 측면에서 충분히 활용되지 않는 리소스인 것 같습니다. 귀하의 제품 페이지는 귀하의 상점이 검색 목록에서 더 높은 순위를 차지하는 데 도움이 될 수 있는 가장 가치 있고 고유한 콘텐츠를 소개할 수 있는 기회를 제공합니다. 대부분의 경우 제품 페이지는 정확히 고객이 보고 싶어하는 것입니다.
제품 페이지 SEO를 강화하려면:
- 귀하의 제품이 무엇인지 명확하게 설명하고 고객이 검색하는 용어와 일치하는 고유한 제품 설명을 작성하십시오.
- 이미지를 설명하는 ALT 태그, 적절한 제목 태그 및 관련 파일 이름을 포함하여 이미지 메타데이터를 최적화합니다.
- 제품 페이지에 비디오를 추가하는 것을 고려하십시오. 페이지에 동영상을 추가하는 것이 SEO에 도움이 되는지 여부는 논쟁의 여지가 있지만 제품에 더 많은 컨텍스트를 제공하여 전환을 개선할 수 있습니다.
확대/축소를 위한 이미지 최적화
대부분의 전자 상거래 사이트에서 이미지 위로 마우스를 가져가 제품을 "확대"하는 방법을 알고 계셨습니까? 이것은 거의 제2의 천성이 된 기능이 되었습니다. 제품을 클릭하거나 마우스를 가져가면 더 큰 버전의 제품을 얻을 수 있을 것으로 기대합니다.
이 기능을 갖는 것은 중요한 목적을 수행합니다. 고객이 제품의 품질을 자세히 확인할 수 있습니다. 또한 제품을 물리적으로 만지거나 볼 수 없을 때 고객의 구매에 대한 확신을 심어주는 데 도움이 됩니다. 때로는 바느질의 품질이나 색상 음영이 고객이 경쟁 제품보다 귀하의 제품을 선택하는 데 차이를 만들 수 있습니다.
그렇다면 줌 기능이 제대로 작동하는지 어떻게 확인할 수 있습니까? 비밀은 올바른 이미지 크기를 사용하는 방법을 아는 것입니다.
대부분의 전자 상거래 웹 사이트에는 다양한 "템플릿"이 있습니다. 이 템플릿은 해당 템플릿 크기에 맞게 이미지 크기를 조정합니다. 예를 들어 다음이 있을 수 있습니다.
- 50px x 50px 크기의 썸네일 템플릿
- 100px x 100px인 컬렉션 이미지 템플릿
- 150px x 150px인 관련 이미지 템플릿
- 500px x 500px의 기본 사진 템플릿
확대/축소 기능은 일반적으로 이미지를 원래 크기로 표시하여 작동합니다. 따라서 1000px x 1000px로 저장한 이미지가 있는 경우 기본 사진 템플릿(500px x 500px) 위로 마우스를 가져가면 해당 크기의 두 배로 표시됩니다.
이것이 의미하는 바는 줌 기능이 작동하려면 이미지 크기가 기본 사진 템플릿보다 커야 한다는 것입니다.
광고
크기가 같으면 사용자가 마우스를 가져갈 때 동일한 이미지를 보게 됩니다. 그러나 너무 크면 이미지 크기가 로딩 시간에 부정적인 영향을 미치고 너무 커서 실용적이지 않습니다.
1000px에서 1,600px 사이의 이미지 크기는 일반적으로 파일 크기와 충분한 클로즈업 세부 정보를 제공할 수 있는 이미지 사이에서 적절한 절충안입니다.
결론
이 5개 장에서 제품 페이지를 작성할 때 충분히 고려해야 하는 가장 중요한 영역을 광범위하게 다룰 수 있었습니다. 이 지침을 따르면 고객에게 훌륭한 쇼핑 경험을 제공하고 높은 전환율을 즐길 수 있는 제품 페이지를 갖게 됩니다. 이제 가이드가 생겼으므로 전자 상거래 상점에 대한 판매를 창출하는 성공적인 제품 페이지를 만드는 것은 귀하에게 달려 있습니다.
