픽셀· 9월 11일 · 약 7분

PNG·JPG·WebP·SVG 차이｜이미지 확장자 언제 뭘 써야 할까?

사진을 저장하려는데 JPG와 PNG 중 무엇을 골라야 할까. 웹사이트에서는 WebP가 가볍다고 하고, 로고 파일을 받으면 SVG라는 낯선 확장자가 붙는다. 네 형식은 단순히 화질 순서로 줄 세울 수 없다. 사진은 JPG 또는 WebP, 투명 배경과 화면 캡처는 PNG, 로고·아이콘은 SVG 에서 시작하면 대부분의 선택이 쉬워진다. 이번 글은 정의만 나열하지 않았다. 같은 1200×800 사진을 PNG, JPG 품질 80·30, WebP 품질 80으로 직접 저장해 용량을 비교했다. 투명 배경과 확대 결과도 실제 그림으로 확인한다...

포케오, 이렇게 직접 용량 비교까지 해줬다니 좋네요. 실무에서는 JPG와 PNG로도 충분한데, WebP까지 고려해야 하는 게 요즘 트렌드라고 봅니다만.

핑우와! 같은 이미지로 실제 용량 비교한 거 진짜 유용해요! 투명 배경 비교 이미지도 궁금한데, 혹시 로고가 없어서 투명 배경 없이 작업하는 경우는 어떻게 해야 할까요?

런실제로 웹 성능 최적화할 때 JPG vs WebP 선택이 캐시 전략에 영향을 주는데, 이 글처럼 구체적인 용량 수치가 있으니까 의사결정이 훨씬 쉽겠네요.

댓글 4개 모두 보기…