Picovert

Squarespace 이미지 크기 가이드 2026: 모든 섹션 완벽 정리

Picovert 팀 작성2026-03-305분 분량

Squarespace는 Imgix CDN 전송, WebP 변환, 반응형 크기 조정 등 많은 이미지 최적화를 자동으로 처리합니다. 하지만 올바른 치수로 이미지를 업로드해야 합니다. 너무 작으면 레티나 디스플레이에서 히어로 이미지가 흐릿하게 보이고, 너무 크면 페이지 로딩이 느려집니다. 이 가이드에서는 2026년 Squarespace 웹사이트의 모든 섹션에 대한 정확한 이미지 크기를 안내합니다.

Squarespace 이미지 크기 — 빠른 참조

  • 배너 / 전체 화면 히어로: 2500×1406 px (16:9), 최소 너비 1500 px
  • 섹션 배경 이미지: 이상적으로 2500×1406 px
  • 갤러리 이미지: 가장 긴 변 기준 1500 px
  • 블로그 대표 이미지: 1500×844 px (16:9)
  • 본문 내 이미지: 너비 1500–1600 px (레티나 표시 너비 약 800 px)
  • 상품 이미지 (커머스): 1500×1500 px (1:1 정사각형)
  • 로고: 투명 배경의 PNG, 최대 높이 250 px
  • 파비콘: 100×100 px 또는 300×300 px PNG
  • 최대 업로드 크기: 이미지당 20 MB
  • 지원 형식: JPG, PNG, GIF, SVG, TIFF, WebP

Squarespace의 이미지 처리 방식

Squarespace가 자동으로 처리하는 사항을 이해하면 더 나은 업로드 결정을 내릴 수 있습니다:

  • Imgix CDN: 업로드된 모든 이미지는 전문 이미지 CDN인 Imgix를 통해 제공됩니다. Squarespace는 각 기기와 화면 크기에 맞게 이미지를 자동으로 크기 조정 및 압축합니다 — 방문자는 전체 해상도 업로드가 아닌 최적화된 버전을 받게 됩니다.
  • 자동 WebP 변환: Squarespace 7.1은 지원하는 브라우저를 위해 업로드된 이미지를 자동으로 WebP로 변환합니다. 업로드 전에 WebP로 변환할 필요가 없습니다.
  • 가장 큰 버전 업로드: Squarespace가 각 기기에 맞게 이미지를 축소하므로, 항상 보유한 가장 높은 품질의 최대 버전을 업로드하세요. CDN이 적합한 크기를 제공합니다 — 너무 크게 업로드해도 문제없지만, 너무 작게 업로드하면 레티나 및 4K 화면에서 흐릿하게 보입니다.
  • 파일 크기도 중요: CDN 최적화에도 불구하고, 압축이 부족한 원본은 여전히 속도를 저하시킬 수 있습니다. 업로드 전에 원본을 적절히 압축하세요.

배너 / 전체 화면 헤더 이미지

배너 또는 히어로 이미지는 페이지 상단의 큰 이미지로, 종종 전체 브라우저 너비에 걸쳐 있습니다. 2026년 Squarespace 기준:

  • 권장: 2500×1406 px (16:9) — 업스케일링 없이 4K 모니터도 채울 수 있음
  • 최소: 너비 1500 px — 이보다 좁으면 레티나 화면에서 흐릿하게 보임
  • 파일 크기 목표: 1 MB 미만 (업로드 전 너비 1920 px로 조정, JPEG q80)

모바일에서 Squarespace는 배너 이미지를 중앙에서 자릅니다. 얼굴, 제품, 핵심 텍스트 등 초점이 되는 콘텐츠를 이미지 너비의 중앙 60% 이내에 유지하세요. Squarespace 편집기에서 포컬 포인트 도구를 제공합니다. 이를 사용하여 작은 화면에서 이미지가 잘릴 때 어떤 영역이 표시될지 정확하게 제어하세요.

사진에는 품질 85의 JPEG 또는 WebP를 사용하세요. 대형 히어로 사진에는 PNG를 피하세요 — 사진 콘텐츠에는 품질 이득 없이 불필요하게 큰 파일 크기가 생성됩니다.

섹션 배경 이미지

섹션 배경은 배너 이미지와 동일한 규칙을 따릅니다. Squarespace는 섹션의 텍스트 콘텐츠 뒤에 이미지를 표시합니다:

  • 이상적인 크기: 2500×1406 px
  • 표시 높이: 섹션 패딩과 콘텐츠에 따라 일반적으로 600–900 px

모든 섹션 배경에 포컬 포인트 도구를 사용하세요 — 화면 크기에 따라 섹션 높이가 달라질 때 이미지의 어떤 부분을 중앙에 유지할지 Squarespace에게 알려줍니다. 배경 이미지는 텍스트 대비를 위해 오버레이와 함께 표시되는 경우가 많으므로 이를 고려하여 디자인하세요.

갤러리 이미지

Squarespace 갤러리 블록은 그리드와 슬라이드쇼로 이미지를 표시합니다. 최고의 선명도를 위해:

  • 권장: 가장 긴 변 기준 1500 px
  • 일관된 비율: 갤러리의 모든 이미지에 동일한 종횡비 사용 — 모두 4:3 또는 모두 1:1. 비율을 혼합하면 그리드 레이아웃에서 불균등한 자름이 발생합니다
  • 형식: 사진의 경우 품질 90 JPEG; 선명한 가장자리가 있는 디자인이나 일러스트의 경우 PNG
  • 파일 크기: 이미지당 300 KB 미만 — 갤러리는 여러 이미지를 한 번에 로드

업로드 전에 이미지 크기 조정 도구를 사용하여 갤러리 이미지를 일관된 크기와 비율로 표준화하세요.

블로그 포스트 이미지

Squarespace 블로그 이미지는 두 가지 용도로 사용됩니다:

  • 대표 이미지 (썸네일): 1500×844 px (16:9) — 이 이미지는 블로그 목록 페이지, 소셜 공유 미리보기, 포스트 헤더에 표시됩니다. 16:9 비율은 모든 컨텍스트에서 올바르게 렌더링되도록 보장합니다.
  • 본문 내 이미지: Squarespace 블로그 편집기는 대부분의 템플릿에서 최대 약 800 px 너비로 이미지를 표시하지만, 레티나 화면에서 선명하게 보이도록 1500–1600 px로 업로드하세요. 빠른 페이지 로딩을 위해 본문 내 이미지당 300 KB 미만을 목표로 하세요.

이미지 크기 조정 도구를 사용하여 대표 이미지를 정확히 1500×844 px로 설정한 다음, 업로드 전에 압축하여 300 KB 미만으로 줄이세요.

상품 이미지 (커머스)

Squarespace 커머스 상품 이미지는 정사각형이고 스토어 전체에서 일관성이 있을 때 가장 좋습니다:

  • 권장: 1500×1500 px (1:1 정사각형)
  • 배경: 메인 상품 사진에는 흰색 또는 중립적인 배경 — 깔끔하고 전문적인 쇼핑몰 외관 제공
  • 썸네일 자름: Squarespace는 원본 비율에 관계없이 썸네일 뷰에서 상품 이미지를 정사각형으로 자릅니다. 정사각형 이미지를 업로드하면 예기치 않은 자름을 방지할 수 있습니다
  • 추가 상품 이미지: 시각적 일관성을 위해 상품 갤러리의 모든 이미지에 동일한 1:1 비율 사용
  • 파일 크기 목표: 상품 이미지당 500 KB 미만

크기 조정 도구를 사용하여 모든 상품 이미지를 1500×1500 px로 표준화하세요. 원본 사진의 비율이 다양한 경우, 업로드 전에 크기를 조정하고 정사각형으로 자르세요.

로고

Squarespace 로고는 사이트 헤더에 표시되며 템플릿에 따라 크기가 조정됩니다. 모범 사례:

  • 형식: 투명 배경의 PNG — 어떤 헤더 배경 색상이나 이미지에서도 로고가 올바르게 보이도록 합니다
  • 높이 제한: Squarespace는 일부 템플릿에서 250 px보다 높은 로고를 잘라냅니다. 예기치 않은 자름을 피하려면 로고 높이를 250 px 미만으로 유지하세요
  • 너비: 템플릿마다 다릅니다 — 200–500 px 범위에서 테스트하고 적합한 것을 선택하세요
  • SVG: Squarespace는 로고에 SVG를 지원합니다. SVG는 픽셀화 없이 모든 해상도에서 완벽하게 확장되므로 세밀한 디테일이나 텍스트가 있는 로고에 최적입니다
  • 파일 크기: 100 KB 미만

절대 로고를 JPEG로 업로드하지 마세요 — JPEG는 투명도를 지원하지 않아 흰색이 아닌 헤더에서 로고 뒤에 흰색 또는 색상이 있는 사각형이 생깁니다.

파비콘

  • 권장: 100×100 px 또는 300×300 px PNG — Squarespace가 브라우저 탭용으로 16 및 32 px로 자동 크기 조정
  • ICO 형식도 지원됩니다
  • 디자인을 단순하게 유지하세요 — 파비콘은 아주 작게 표시되며 16 px에서는 세밀한 디테일이 사라집니다. 형식 변환이 필요한 경우 변환 도구를 사용하세요.

파일 크기 목표 요약

  • 히어로 / 배경: 1 MB 미만 (너비 1920 px로 조정, JPEG q80)
  • 블로그 대표 이미지: 300 KB 미만
  • 상품 이미지: 500 KB 미만
  • 갤러리 이미지: 각 300 KB 미만
  • 로고: 100 KB 미만

단계별: Squarespace용 이미지 준비

  1. 이미지 유형(히어로, 상품, 블로그, 갤러리 등)을 확인하고 위의 빠른 참조에서 권장 치수를 확인하세요.
  2. 이미지 크기 조정 도구를 사용하여 정확한 치수를 설정하세요. 히어로 이미지는 2500×1406 px로, 상품 이미지는 1500×1500 px로 크기를 조정하세요.
  3. 압축 도구를 사용하여 파일 크기를 줄이세요. 히어로 이미지는 1 MB 미만, 블로그 및 갤러리 이미지는 300 KB 미만을 목표로 하세요.
  4. 로고의 경우 파일이 투명 배경의 PNG인지 확인하세요. 사진의 경우 85% 품질의 JPEG로 저장하거나 변환 도구를 사용하여 형식을 변경하세요.
  5. Squarespace에 업로드하고 모든 히어로 및 섹션 배경 이미지에 포컬 포인트 도구를 사용하여 모바일 자름을 제어하세요.