PNG와 WEBP 차이: 어떤 이미지 형식을 선택할까?

받는 곳을 기준으로 선택하는 세 가지 상황

확장자의 장점보다 결과를 어디에 넣을지가 먼저입니다. 지원 형식은 제출 화면에서 확인하고, 변환한 파일을 그 프로그램에서 직접 열어 보세요.

• JPG·PNG만 받는 제출 양식: 더 작더라도 WEBP는 제외하고, 투명이 필요하면 PNG 선택
• 블로그 상품 사진: WEBP 업로드와 표시를 지원하면 원본과 같은 크기로 시험하고 용량 비교
• 로고·작은 글자가 있는 캡처를 편집자에게 전달: PNG 원본을 유지하고, WEBP는 공유용 사본으로 비교

PNG가 잘 맞는 이미지

PNG는 무손실 압축으로 반복 저장에 따른 손실을 피하고 투명 영역을 유지하기 좋습니다. 로고, 아이콘, 캡처 화면, 작은 글자가 있는 그래픽에 자주 사용됩니다.

• 투명 배경 로고와 아이콘
• 텍스트가 많은 화면 캡처
• 정확한 픽셀과 색 보존이 중요한 그래픽

WEBP가 잘 맞는 이미지

WEBP는 사진과 웹 콘텐츠에서 PNG보다 훨씬 작은 결과를 만들 수 있습니다. 손실·무손실과 투명을 지원하지만, 사용하는 프로그램이 WEBP를 열 수 있는지 확인해야 합니다.

• 웹사이트 대표 이미지와 상품 사진
• 블로그에 올릴 사진
• 모바일 데이터와 로딩 속도가 중요한 화면

변환할 때 주의할 점

PNG를 손실 WEBP로 바꾸면 용량은 줄지만 미세한 선이나 글자 주변이 흐려질 수 있습니다. 반대로 사진을 PNG로 저장하면 선명해 보이더라도 파일이 불필요하게 커질 수 있습니다.

같은 이미지로 비교할 때 확인할 순서

원본 한 장에서 PNG와 WEBP를 각각 만들고 가로·세로 픽셀 크기를 같게 유지하세요. 크기를 줄인 WEBP와 원본 크기 PNG를 비교하면 형식 차이와 축소 효과가 섞입니다. 원본이 이미 작고 목적에 맞다면 변환을 생략해도 됩니다.

작은 글자와 얇은 선을 실제 사용할 크기와 100% 확대 상태에서 확인하세요. 투명 로고는 흰 배경과 짙은 배경 위에 각각 놓아 가장자리를 살펴보고, 그다음 파일 크기를 비교하세요. 결과가 더 크거나 경계가 흐려졌다면 원본 PNG를 유지하거나 WEBP 품질을 높여 다시 확인하는 편이 낫습니다.

• PNG에는 손실 화질 슬라이더가 적용되지 않으며, 같은 픽셀 크기에서도 재저장 용량이 달라질 수 있음
• WEBP 형식 자체는 무손실도 지원하지만 툴릿의 이미지 압축기에는 별도의 WEBP 무손실 선택 기능이 없음
• 원본의 선명한 픽셀 보존이 우선이면 PNG와 원본 크기를 선택하고, 결과를 다시 열어 확인

배경이 하얗게 보인다고 투명이 사라진 것은 아닙니다

일부 사진 앱은 투명 영역을 흰색 위에 보여 줍니다. 투명이 손실됐는지 보려면 편집기에서 다른 색 배경 위에 올려 보세요. 반대로 흰 배경이 원본 이미지의 일부라면 PNG나 WEBP로 저장하는 것만으로 배경이 제거되지는 않습니다. 형식 변환과 배경 제거는 다른 작업입니다.

투명한 꽃 그래픽을 PNG와 WebP로 저장했습니다

사진과 달리 그래픽은 투명 배경, 가는 외곽선과 글자를 함께 보는 것이 좋습니다. 예제용 꽃 그래픽을 PNG로 보관한 파일은 742,016 B, WebP 품질 80 사본은 111,010 B였습니다. 둘 다 1254×1254이며, 투명도를 나타내는 값은 이 예제에서 그대로 유지됐습니다.

아래 이미지는 비교하기 쉽도록 같은 연회색 배경 위에 놓았습니다. 실제 내려받는 PNG와 WebP의 바깥 배경은 투명합니다. 꽃잎의 색 단계, 얇은 선과 SAMPLE 글자를 비교해 보세요. WebP는 이번에 손실 압축으로 저장했으므로 파일이 작다는 이유만으로 PNG와 모든 픽셀이 같다고 볼 수는 없습니다.

투명 배경을 유지하면서 웹에 올릴 사본은 WebP도 후보가 됩니다. 후속 편집용 원본과 선·글자 보존이 중요하면 PNG를 남겨 두세요. 받는 곳에서 WebP를 지원하는지도 따로 확인해야 합니다.

• 원본 이미지 보기 · PNG투명 PNG 원본
• 원본 이미지 보기 · WEBP실제 투명 WebP 사본