PNG, JPG, WebP 중 어떤 이미지 형식을 쓸까?

이미지를 저장하거나 내보낼 때 고르는 형식은 파일 크기와 화질, 그리고 그 이미지가 표시될 환경과의 호환성을 곧바로 좌우합니다. JPG와 PNG, WebP는 서로 바꿔 쓸 수 있는 형식이 아닙니다. 각각 다른 압축 기법을 쓰고, 겨냥하는 이미지 종류도 다릅니다.

압축이란 무엇이고 왜 중요할까

압축은 이미지 파일의 크기를 줄이는 과정이며, 크게 두 가지가 있습니다.

• 무손실 압축(lossless): 파일은 작아지지만 원본 데이터는 하나도 버리지 않습니다. 압축을 풀면 원본과 완전히 같은 이미지가 나옵니다.
• 손실 압축(lossy): 파일이 훨씬 작아지는 대신 일부 데이터는 영영 사라집니다. 압축을 세게 걸수록 화질도 그만큼 나빠집니다.

JPG는 손실 압축을, PNG는 무손실 압축을 씁니다. WebP는 두 방식을 모두 지원합니다. 이 차이가 각 형식을 언제 써야 하는지 판단하는 출발점입니다.

JPG(또는 JPEG): 사진을 위한 형식

JPG는 1992년부터 쓰여 왔고 지금도 사진 분야의 표준입니다. 이유는 단순합니다. JPG가 쓰는 손실 압축은 색이 서서히 변하고 그림자와 질감이 많은 이미지에서 특히 효율이 좋은데, 그것이 바로 사진의 특징이기 때문입니다.

작동 원리

JPG 알고리즘은 이미지를 8×8 픽셀 블록으로 나눈 뒤 고주파 정보를 버립니다. 색이 완만하게 변하는 영역에서 사람 눈이 잘 알아채지 못하는 미세한 디테일입니다. 그 결과 눈에 띄는 화질 손실은 거의 없이 파일 크기가 크게 줄어듭니다.

JPG를 써야 할 때

• 제품, 인물, 풍경, 공간 등 일반적인 사진 전반
• 소셜 미디어에 올리는 이미지(인스타그램, 페이스북, 링크드인)
• 유튜브 영상 썸네일
• 투명 배경이 필요 없고 용량을 줄이는 쪽이 더 중요한 모든 이미지

JPG의 한계

• 투명도를 지원하지 않습니다. 배경은 항상 불투명하며 기본값은 흰색입니다.
• 저장할 때마다 화질이 깎입니다. 이미 압축된 JPG를 다시 내보내면 손상이 세대마다 쌓입니다.
• 글자와 또렷한 경계에는 최악입니다. 단색 배경 위의 글자처럼 색이 급격히 바뀌는 부분에는 아티팩트가 눈에 띕니다. 글자 주변이 네모나게 뭉개지는 그 현상입니다.

PNG: 그래픽과 투명도를 위한 형식

PNG(Portable Network Graphics)는 1996년에 GIF를 대신하려고 만들어졌습니다. 더 많은 색을 담고 압축도 더 낫습니다. 무손실 압축을 쓰기 때문에 PNG로 저장한 이미지는 언제나 원본과 똑같습니다. 아티팩트도, 화질 저하도 없습니다.

작동 원리

PNG는 ZIP 파일처럼 되돌릴 수 있는 방식으로 이미지 데이터를 압축합니다. 잃는 정보가 없습니다. 그래서 같은 이미지라도 PNG 파일이 JPG보다 큰 편이지만, 대신 품질은 완벽합니다.

PNG를 써야 할 때

• 배경이 투명한 로고, 아이콘, 일러스트
• 글자를 읽어야 하는 화면 캡처
• 단색 면과 또렷한 경계가 많은 이미지
• 여러 번 편집하고 다시 내보낼 파일(손실이 쌓이지 않습니다)
• 파비콘과 인터페이스용 이미지

PNG의 한계

• 사진에는 파일이 너무 큽니다. 같은 사진이라도 PNG로 저장하면 JPG의 5~10배가 되는데, 눈에 보이는 이득은 없습니다.
• 사진처럼 그러데이션이 많은 이미지에는 맞지 않습니다. 무손실 압축은 모든 정보를 지킵니다. 버려도 아무도 눈치채지 못할 정보까지 그대로 안고 갑니다.

WebP: 웹을 위한 최신 형식

WebP는 구글이 만들어 2010년에 공개했습니다. 웹에서 JPG와 PNG보다 효율적인 형식이 되는 것이 목표였습니다. 손실과 무손실 압축을 모두 지원하고 투명도까지 다루므로, 앞선 두 형식의 장점을 더 작은 파일 하나에 담은 셈입니다.

작동 원리

WebP는 영상 코덱 VP8에서 갈라져 나온 고급 압축 기법을 씁니다. 손실 모드에서는 같은 화질의 JPG보다 25~35% 작은 파일을, 무손실 모드에서는 PNG보다 20~30% 작은 파일을 만듭니다. 알파 채널(투명도)과 애니메이션도 지원합니다.

WebP를 써야 할 때

• 웹사이트와 웹 앱에 쓰는 이미지 전반. 빠른 로딩에는 가장 효율적인 형식입니다
• 쇼핑몰 제품 사진에서 JPG를 대신할 때
• 투명도가 필요한 로고와 아이콘에서 PNG를 대신할 때
• 성능과 로딩 속도가 최우선인 모든 상황

WebP의 한계

• 호환성: 2026년 기준으로 거의 모든 곳에서 열립니다. 크롬, 파이어폭스, 사파리, 엣지는 물론 주요 운영체제가 모두 지원합니다. 다만 오래된 편집 도구나 일부 플랫폼은 아직 WebP를 받지 않습니다.
• 유튜브는 썸네일로 WebP를 받지 않습니다. 썸네일 업로드에는 JPG나 PNG를 쓰십시오.
• 일부 소셜 플랫폼은 업로드된 WebP를 JPG로 다시 압축합니다. 그러면 이점의 상당 부분이 사라집니다.

PNG·JPG·WebP 전체 비교

상황별로 어떤 형식을 쓸까

웹사이트와 쇼핑몰

모든 이미지에 WebP를 기본으로 쓰십시오. 성능 향상은 실제로 체감됩니다. 페이지가 더 빨리 뜨고, 구글 PageSpeed 점수가 올라가며, 파일이 작아지는데도 화질은 JPG나 PNG와 같거나 오히려 낫습니다. 필요할 때를 대비해 JPG나 PNG 버전을 대체용으로 남겨 두십시오.

쇼핑몰 제품 사진

쇼핑몰 시스템이 지원한다면 WebP를 쓰십시오. 지원하지 않는다면 품질 80~85%의 JPG가 좋습니다. 이 구간이 용량과 화질의 균형이 가장 좋습니다. 제품 사진을 PNG로 저장하는 일만은 피하십시오. 파일만 거대해지고 눈에 보이는 이득은 없습니다.

로고와 브랜드 아이덴티티

발표 자료나 Word 문서, 구형 시스템까지 어디서든 열려야 한다면 PNG를 쓰십시오. 쓸 곳이 웹뿐이라면 WebP가 낫습니다. 로고에 JPG를 쓰는 일만은 피하십시오. 강제로 들어가는 흰 배경과 가장자리의 아티팩트가 로고를 망가뜨립니다.

소셜 미디어

인스타그램, 페이스북, 링크드인에 올리는 사진에는 JPG를 쓰십시오. 어차피 플랫폼이 전부 다시 압축하므로, 잘 압축한 JPG를 올리는 편이 최종 결과를 더 잘 통제할 수 있습니다. 그래픽 요소와 글자가 들어간 스토리나 게시물이라면 PNG가 플랫폼 재압축 전까지 글자의 또렷함을 더 잘 지켜 줍니다.

유튜브 썸네일

유튜브가 권장하는 JPG나 PNG를 쓰십시오. 유튜브는 썸네일로 WebP를 받지 않습니다. 파일 용량 제한은 2MB이므로, 업로드 전에 크기를 줄여야 한다면 압축 도구를 이용하십시오.

화면 캡처

무조건 PNG입니다. 화면 캡처에는 글자와 인터페이스, 또렷한 경계가 들어 있는데, 전부 JPG가 가장 못 다루는 요소입니다. JPG로 저장한 캡처는 글자 주변에 아티팩트가 그대로 드러납니다.

파비콘

여러 크기의 PNG(16×16, 32×32, 애플 터치용 180×180)를 준비하거나, 구형 브라우저까지 확실히 대응하려면 .ico 형식을 쓰십시오. ImageTools의 파비콘 만들기 도구는 어떤 이미지든 필요한 크기 전부로 한 번에 만들어 줍니다.

형식 변환을 무료로 하는 방법

ImageTools의 변환 도구는 PNG, JPG, WebP, BMP를 브라우저 안에서 서로 변환합니다. 외부 서버로 업로드하지 않고, 가입도 사용 횟수 제한도 없습니다. 이미지를 올리고 원하는 형식을 고른 뒤 내려받으면 끝입니다.

형식은 그대로 두고 JPG와 PNG 파일 용량만 줄이고 싶다면 압축 도구가 화질을 지키면서 알아서 압축해 줍니다. 웹사이트에 올리거나 이메일로 보내기 전에 정리하기 좋습니다.

자주 묻는 질문