🖼️ Image Optimizer

Compress and convert images (client-side)

📁

Drag an image or click to upload

Supports PNG, JPG, WebP (max 50MB)

Info

All processing happens in the browser
Files are not uploaded to any server
WebP provides the best compression
Quality 75-85% is recommended

이미지 최적화 가이드

왜 이미지 최적화가 중요한가요?

웹사이트에서 이미지는 전체 페이지 용량의 50% 이상을 차지하는 경우가 많습니다. 최적화되지 않은 이미지는 페이지 로딩 속도를 늦추고, 사용자 경험을 저해하며, Core Web Vitals 점수에 악영향을 줍니다. 적절한 이미지 최적화는 SEO와 성능 향상에 필수적입니다.

포맷별 특징

포맷	장점	단점	사용 사례
WebP	작은 파일 크기, 투명도 지원	구형 브라우저 미지원	대부분의 웹 이미지
JPEG	높은 호환성, 사진에 적합	투명도 미지원	사진, 그라데이션
PNG	투명도 지원, 무손실	파일 크기가 큼	로고, 아이콘, 스크린샷
AVIF	가장 작은 크기	브라우저 지원 제한	최신 브라우저용 이미지

품질 설정 가이드

90-100%원본과 거의 동일한 품질, 파일 크기 절감 적음

75-90%권장 범위, 품질과 크기의 균형

50-75%눈에 띄는 품질 저하, 썸네일에 적합

50% 미만심한 품질 저하, 권장하지 않음

반응형 이미지 전략

<picture>
  <source
    srcset="image.avif"
    type="image/avif"
  />
  <source
    srcset="image.webp"
    type="image/webp"
  />
  <img
    src="image.jpg"
    alt="Description"
    loading="lazy"
    decoding="async"
  />
</picture>