PNG & JPG 파일이란 _ 차이점 비교하기

JPG, HEIC, SVG, PNG, GIF 등등... 정말 많은 이미지 형식이 존재하고 있어요. 그중에서 가장 많이 사용되고 있는 JPG(=JPEG)와 PNG가 무엇이고 어떠한 차이점이 있는지 궁금하신 분들을 위해 최대한 쉽게 설명해보려고 해요 !(•̀ᴗ•́)و ̑̑

 

둘 다 잘 열리는데 무슨 차이가 있긴 한가?

 

---

 

1. JPG(=JPEG) 파일이란?

' Joint Photographic Experts Group ' 의 약자. 압축 손실 방식으로 큰 용량의 파일을 보다 효율적으로 압축하여 전송하거나 공유할 수 있습니다. 좋은 호환성을 가지고 있기도 하지만 용량에 비해 이미지의 품질이 좋기 때문에 가장 많이 사용되고 있기도 합니다.

하지만 손실 방식은 압축하는 과정에서 불필요하다고 생각하는 데이터는 삭제되므로 압축률이 높아지면 높아질 수록 품질 저하가 뚜렷하게 나타난다는 단점이 있기 때문에 무작정 용량을 줄인다고 과하게 압축을 하는 것은 추천하지 않습니다. 특히 문서와 같이 문자가 많이 들어가 있거나, 많은 선이 존재하는 이미지를 JPG로 본 적이 있는 분들은 아시겠지만 품질 저하로 인해 약간의 블러 처리가 된 것처럼 보입니다. 그렇기 때문에 이런 복잡한 이미지는 PNG로 저장하는 것이 좋습니다.

 

2. PNG 파일이란?

' Portable Network Graphics ' 의 약자. JPG와 달리 비손실 압축 방식을 사용하기 때문에 이미지의 데이터를 모두 유지할 수 있습니다. 대신 용량은 JPG보다 큰 편이지만 JPG와 달리 투명성을 지원하기 때문에 우리가 흔하게 말하는 ' 누끼 작업 ' 을 통해 배경을 제외하고 합성에 많이 사용되기도 합니다.

 

 

3. 사진으로 비교해보기

왼쪽이 JPG, 오른쪽이 PNG로 흰 배경이 있을 때 우리가 보는 이미지 화면입니다. 이렇게 보았을 때는 .JPG, .PNG와 같은 파일명을 보지 않으면 알 수가 없을 정도로 동일합니다. 이런 상황일 경우에는 용량이 더 적은 JPG를 쓰는 게 효율적이겠죠? 그렇기 때문에 이미지 용량이 적을 수록 페이지를 빨리 불러오는 웹 사이트에는 JPG가 적합합니다.

동일하게 왼쪽이 JPG, 오른쪽이 PNG 입니다. 이번에는 깔아 두었던 흰 배경을 없애본 이미지입니다. JPG와 PNG의 큰 차이점이라고 할 수 있는 투명성에 관련된 것인데요. JPG는 아무리 배경을 투명하게 한다고 해도 저장될 때 자동으로 투명한 부분은 흰색으로 메꾸어 버려요. 하지만 PNG는 배경을 지우고 저장을 하면 위의 사진처럼 그림만 남아있게 됩니다. 현재 제 맥북이 다크 모드라서 뒷 배경으로 검은색이 깔린 것 같겠지만 라이트 모드로 바꾸면 흰색으로 바뀔 거예요.(= 배경이 없다는 증거) 그렇기 때문에 PNG는 합성에 유용하게 사용될 수 있습니다.

 

혹시 더 궁금한 점이 있다면 댓글로 남겨주세요!