권장 이미지 사이즈 정리_한별

정해진 규격이 없어 고민이었던 이미지의 기준을 알려드립니다.

목차

1. 이미지 썸네일

식스샵의 이미지는 원본이 아닌 썸네일 형태로 노출이 됩니다.

사이트에 이미지를 등록하시게 되면 어떠한 이미지던 썸네일화를 거치게 되어서 한 번 더 압축이 됩니다. 그렇기 때문에 고화질의 이미지 혹은 해상도가 높은 이미지라면 화질을 낮추게 되어 오히려 화소가 뭉뚱그려져 보이는 현상이 있습니다.

이미지를 저장하실 때 웹용으로 저장하시어 압축과정을 거칠 때에도 다른 영향이 없도록 위 규격대로 이미지 설정을 해주시면 됩니다!

• 해상도 : 72dpi

• 이미지 저장 : save for web (웹용 저장)

• 저장 방식 : RGB 또는 sRGB

• 파일파일 형식 : JPG 또는 PNG

  • 용량 : 5MB 이하

2. 각 섹션 별 이미지 규격

식스샵은 반응형 웹빌더 서비스로 이미지의 규격화 된 사이즈가 없습니다. 다만, 각 섹션별로 권장하는느 사이즈가 있으니 참고 부탁드립니다.

2-1. 메인 배너 섹션 이미지 사이

메인 배너 섹션은 스타일 편집에서 설정한 값으로 노출이 되기 때문에 정확히 표시된 규격은 없지만 가로 기준 2,000 px ~ 2,500 px 세로 기준 10,000 px 이하로 작업을 권장드립니다.

메인 배너 섹션은 같은 사이즈를 등록하여도 메인 배너 섹션의 종류를 [높이 고정]으로 설정하느냐 [비율 고정]으로 설정하느냐에 따라 다르게 노출이 됩니다. [높이 고정] 페이지가 표시되는 모니터의 세로 길이가 기준이 되며, 이미지의 세로 길를 어디까지 표시할 지로 고정이 됩니다. 높이 고정의 기준을 전체 화면으로 할 경우, PC와 모바일 모두 모니터의 전체 화면으로 표시가 됩니다. [비율 고정] 이미지의 가로와 세로가 기준이 되며, 어떤 모니터에서 표시가 되던 설정한 가로 세로의 비율 값으로 노출이 됩니다. 썸네일 비율대로 이미지 편집을 해서 등록을 해야지만 모니터에서 잘리지 않고 표시가 됩니다. ex. 1:1 비율로 설정할 경우 1,000 px X 1,000 px로 2:3비율로 설정할 경우 2,000 px X 3,000px 등으로 작업하시면 됩니다.

2-1-2. 메인 배너 섹션 동영상 사이

보통 유튜브에 올라가는 동영상의 경우 16:9 비율로 찍히기 때문에 동영상 화면이 잘리지 않고 보이게 하려면 [비율 고정] 16:9로 하셔야 동영상이 모니터에서 잘리지 않고 표시가 됩니다.

2-1-3. 모바일 전용 메인 배너 섹션 사이

모바일 전용 메인 배너 섹션(링크)을 설정하실 수가 있습니다.

이미지의 용량을 고려하신다면 가로 840 px로 작업을 하시고 이미지의 품질을 고려하신다면 가로 1,440 px로 작업을 하시면 됩니다.

2-2. 상품 상세 페이지 이미지 사이

상품 상세 페이지 설정 시, 이미지 규격은 가로 800 ~ 1,000 px 로 작업을 하시면 됩니다.

2-3. 팝업 이미지 사이

팝업 설정 시, 이미지 규격은 가로 500 ~ 1,000 px 로 작업을 해주시고 [애드온 > 팝업]에서 너비 설정을 해주셔야 노출이 됩니다.

모바일에서는 팝업 사이즈가 고정으로 노출이 되기 때문에 별도 너비 조절이 불가합니다.

2-4. 최상단 배너 이미지 사이

최상단 배너 설정 시, 이미지 규격은 가로

2-5. 게시판, 블로그 이미지 사이

게시판과 블로그 설정 시, 이미지 규격은 800 px 이하로 작업을 하시면 됩니다.

장바구니 페이지