이미지 압축으로 블로그 로딩 속도 빠르게 개선하는 방법
- WEB/블로그 꿀팁
- 2017. 10. 24. 11:25
이미지 압축은 블로거 또는 홈페이지 관리자들에게 있어서 꼭 필요한 작업 중 하나다.
이미지 압축 없이 대량의 고화질의 사진을 첨부하게 되면, 사진 퀄리티는 좋을지 모르나 로딩시간이 상당하기 때문이다.
누구나 그러하듯 느린 이미지 로딩속도는 사이트를 방문하는 이들이 쉽게 이탈하는 가장 큰 요소 중 하나일 것이다.
그렇다고 열심히 사진 촬영 및 포토샵 편집 작업을 거친 소중한 이미지 자료를 저화질로 저장하자니 화질 손실이 너무 크다.
이러한 경우 어떻게 하면 이미지 화질의 손실을 줄이고 이미지 용량은 압축을 시킬 수 있을까?
필자의 경우는 두 군데의 이미지 압축 사이트를 통하여 이미지를 압축한다.
이용하는 두 사이트 모두 이미지 압축률이 훌륭하고 압축 전후의 차이가 별로 없다는 것이 장점이다.
오늘은 먼저 주력으로 이용하는 사이트 ‘TinyPNG’ 를 먼저 소개할까 한다.
「TinyPNG」
Tinypng는 이미지 압축 서비스를 제공하는 사이트로, 불필요한 설치가 필요 없는 것이 가장 큰 장점인 곳이다.
사이트에 압축을 원하는 이미지를 업로드 하고 압축을 마친 이미지를 재저장 하기만하면 되는 누구나 쉽게 이용할 수 있는 곳이다.
Tinypng는 png 또는 jpg 파일의 형식의 이미지 압축만을 지원하며 최대 20개의 이미지, 최대 5MB까지 한번에 이미지 압축을 진행 시킬 수 있다.
20개가 넘는 경우 이미지압축을 분리하여 두번 정도 걸쳐서 진행시켜야 되며, 한번에 대량의 이미지 파일 압축을 원하는 경우 유료제공 서비스인 Tinypng PRO로 업그레이드 시키면 된다.
Tinypng PRO는 유료로 50달러를 지불하면 평생 사용할 수 있다.
품질과 파일 크기면에서 완벽한 균형을 유지하면서 이미지를 최적화 시키는 TinyPNG는 스마트 손실 압축 기술을 사용하여 이미지 파일의 크기를 줄인다.
이미지의 색상 수를 선택적으로 줄이면 데이터를 저장하는 데 필요한 바이트 수가 줄어 들며 효과는 거의 보이지 않지만 파일 크기에는 큰 차이가 있다고 한다.
필자가 모든 작업을 함에 있어서 꼭 거치는 사이트로 결과물에 만족을 하는 이미지 압축 사이트다.
그럼 어떤 식으로 이미지 압축을 할 수 있는 지 살펴보자.
Tinypng 이미지 압축 사이트 접속
먼저 Tinypng 이미지 압축 사이트에 접속을 한다.
접속을 하면 중앙에 팬더와 함께 ‘png 또는 jpg 파일을 여기에 저장하십시오!’ 라는 문구가 보일 것이다.
해당 문구가 있는 중앙을 클릭하면 파일 선택창이 뜨게 된다.
이미지 선택 및 업로드
앞서 언급한 바와 같이 무료 제공 버전은 최대 20개의 이미지, 최대 5MB만을 제공한다.
따라서 20개 이상의 이미지 압축이 필요할 경우 두 번에 걸쳐서 진행을 하도록 하자.
이미지 압축을 원하는 이미지들을 클릭한 뒤 열기 버튼을 클릭한다.
이미지 압축 진행
이미지 압축을 진행하고 있는 경우 ‘Compressing’ 이란 단어가 뜨며, 압축을 기다리는 상태라면 ‘Waiting’ 으로 표기가 된다.
압축 진행 시간은 굉장히 빠르며 압축이 완료 된 파일은 ‘Finished’ 란 문구가 뜬다.
압축 후엔 해당 이미지 용량이 얼마나 압축이 되었는 지 숫자와 퍼센트로 표기가 된다.
필자가 예시로 압축한 이미지들의 경우 최소 41% 최대 50%의 이미지 압축이 된 것을 확인 할 수 있다.
이는 블로그 이미지 로딩에 상당한 효과를 주며 특히 많은 자바스크립트와 애드센스 등이 포함 된 블로그의 경우엔 꼭 필요한 작업이라 할 수 있겠다.
이미지 압축 전후 비교
예시의 사진을 한장 보도록 하자.
「원본 이미지: 192.6KB」
「압축 후 이미지: 98.7KB」
첫번째 이미지가 원본, 두번째가 압축 후의 사진이다.
압축률은 원본 192.6KB에서 98.7KB로 상당한 이미지 압축이 진행 된 상태임에도 유관상으로 별 차이가 없어 보이지 않은가?
물론 이미지 압축을 한번 더 거치는 과정은 번거로운 일이 아닐 수 없다.
하지만, 내 포스팅의 로딩속도를 조금이라도 개선 시키려면 이미지 압축은 필수로 거쳐야 되지 않을까?
추천 콘텐츠
이 글을 공유하기