이미지 파일 용량 줄이는 방법 (TinyPNG) 배너



블로그 글을 쓰다 보니 첨부된 JPG나 PNG 이미지들이 파일 용량이 너무 커서

사이트 로딩 속도도 문제가 되고 블로그 글을 읽는 분들 중에 모바일 환경이면 데이터 사용 문제도 될 것 같기 때문에

이미지 손실을 최소화하면서 파일 용량을 줄이는 방법을 알아봤습니다.



이미지 용량을 줄이는 프로그램이나 사이트가 몇 군데 있는데

속도도 빠르고 사용법도 쉬워서 제가 많이 이용하는 곳은 TinyPNG 입니다.


TinyPNG 사이트 주소: https://tinypng.com




TinyPNG 사이트 메인 화면

TinyPNG 메인화면입니다.

메인화면인데 좀 어수선하네요... 중국에서 만들었는지 판다가 방문객을 맞이하고 있습니다.






TinyPNG 사용법

TinyPNG로 이미지 용량을 줄이는 방법은 쉬운데 메인 화면에 점선 박스 안으로 이미지를 끌어놓기만 하면 됩니다.

단, png 와 jpg만 됩니다. 다른 파일은 올려도 최적화가 안됩니다. 또 파일 개수는 20개까지만 됩니다.

유료 버전을 사용하면 제한이 없는데. 무료로 사용하는 우리는 파일을 20개씩 올리면 되겠습니다.






TinyPNG로 이미지 용량 줄여보기

< JPG, PNG 파일과 한 번에 최대 20개까지 최적화가 된다 >


파일을 드래그한 후

약간의 시간이 지나면 이미지들이 압축이 되고,

다 되면 아래 Download all 버튼을 클릭해 올린 이미지 전체를 압축파일로 받을 수 있습니다.






TinyPNG 압축후 파일 사이즈 비교


최적화 전후를 비교해 봤습니다.

제가 쓰고 있던 블로그 글에는 JPG 이미지가 26개가 있는데, 최적화하기 전에는 약 7.7MB이었고 TinyPNG로 최적화해보니 4.9MB로 줄었습니다.

정말 놀랍죠?. 최적화하기 전과 비교해 거의 65%로 줄었습니다.


이렇게 파일 용량이 줄어든 이미지를 블로그 글에 사용하면 페이지 로딩도 빨라졌을 것이고

스마트폰으로 블로그 글을 보시는 분들에게도 데이터 사용량이 줄었을 것이니 일석이조입니다.


그런데 좀 걱정되네요.

용량을 줄이기 위해 이미지에 손상을 많이 주면 블로그 글의 퀄리티가 떨어지기 때문에

얼마나 열화를 주는지 확인해 봤습니다.







이미지 파일 용량 줄이고 비교


TinyPNG로 이미지 압축 전과 후를 비교했습니다.


최적화 전: 82.0 kb

최적화 후: 41.8 kb



두 이미지의 파일 사이즈는 50%로 줄었지만 눈으로 보는 차이는 느낄 수가 없었습니다.

그래도 차이를 알아보기 위해

이미지 압축 시 글자처럼 선 부분에서 열화가 잘 나타나므로 베트남의 '베'자를 확대해 봤습니다.


'베'자를 확대해 보면 TinyPNG로 압축 시 '베' 글자 주변이 좀 더 자글자글한 모습을 볼 수 있습니다.

확대하기 전 '베'자 주변은 눈으로 차이를 알지 못하니 걱정할 정도는 아닌 것 같습니다.



이상으로

TinyPNG 로 이미지 파일 용량 줄이는 방법을 알아봤습니다.


끝.






댓글