PNG를 WebP로 변환

PNG 파일이 큰 이유

PNG는 무손실 형식이에요. 모든 픽셀을 그대로 저장하기 때문에 로고, 스크린샷, 인터페이스 그래픽에 딱 맞지만, 같은 사진을 PNG로 저장하면 JPG보다 10~20배나 커지는 이유이기도 해요. 디자인 도구가 기본으로 PNG로 내보내는 것은 안전하기 때문이지 효율적이기 때문이 아니에요. 그 결과 수백 KB면 충분할 이미지를 몇 MB짜리 PNG로 제공하는 웹사이트가 정말 많아요.

WebP는 무엇이 다를까요

WebP는 Google이 웹 전용으로 설계한 형식이고, 두 가지 모드가 있어요. 손실 WebP는 동영상 압축과 비슷한 예측 및 변환 부호화를 사용해서, 같은 화질 기준으로 보통 JPG보다 25~35% 작고 PNG보다는 훨씬 작은 파일을 만들어요. 무손실 WebP는 PNG처럼 픽셀을 그대로 저장하지만 더 똑똑한 압축 방식을 써서, 최적화된 PNG보다도 보통 20~30% 작아요. 두 모드 모두 투명도를 지원하는데, 이것이 PNG를 WebP로 변환하는 경우가 그렇게 많은 가장 큰 이유예요. PNG만큼 용량을 감수하지 않고도 알파 채널을 유지할 수 있는, 널리 지원되는 첫 번째 형식이거든요.

품질 설정 고르기

WebP는 어디에 쓸까요

브라우저로 보는 곳이라면 어디서나 WebP를 쓰세요. 웹사이트, 웹 앱, 최신 이메일 클라이언트를 대상으로 하는 이메일 템플릿, 이미지 CDN 모두 해당돼요. WordPress, Shopify, Webflow, Squarespace, Wix는 이제 모두 WebP 업로드를 지원해요. 오래된 뷰어도 함께 지원해야 한다면, HTML <picture> 요소에 WebP 소스를 먼저 넣고 PNG나 JPG를 대체 이미지로 두는 것이 표준 방법이에요.

인쇄소에 넘길 파일, 원본 아트워크 보관용 파일, 또는 예전 버전의 Photoshop이나 Illustrator로 파일을 열 고객에게 보낼 파일은 WebP로 변환하지 마세요. PNG 마스터는 그대로 두고, WebP는 배포용 형식으로 생각하세요.

일괄 변환

내보낸 PNG 에셋 폴더 전체를 한 번에 끌어다 놓을 수 있어요. 모든 파일이 같은 품질 설정으로 변환되고, 결과는 원래 파일 이름에 확장자만 .webp로 바뀐 채 ZIP 파일 하나로 다운로드돼요. 그래서 프로젝트에 적용할 때는 확장자만 찾아 바꾸기로 교체하면 돼요.