워드프레스 이미지 압축 & 최적화 플러그인 TinyPNG 설치와 리뷰
TinyPNG 설치와 리뷰
전송량의 문제
워드프레스를 넘어오게 되면 티스토리같은 CMS 플랫폼에 비해 여러가지 고려해야 할 것들이 많은데, 그 중에 서버 비용과 직결되는 것이 전송량입니다. 대역폭(Bandwidth)라고도 하지요. 쉽게 말하면 워드프레스를 보러 들어온 사용자가 얼마나 다운로드(혹은 업로드) 할 수 있는가 - 에 대한 것 입니다. 당연히 가격에 따라 차이가 나겠지요.
이거는 우리나라 통신사들이 넷플릭스 등 대용량 전송을 사용하는 OTT에게 망사용료를 내라는 소송을 예를 들면 컴퓨터를 잘 모르는 사람도 이해하기가 편할 겁니다. 한 컴퓨터에다가 넷플릭스의 고화질 동영상을 하나 다운로드 받는데 수백메가에서 수기가의 전송이 필요한데 그 전송이 되는 망이 바로 이동통신사들의 네트워크 설비로 이루어진 것이지요.
우리가 티스토리를 사용할 때는 이미지도 많이 올리고 동영상같은 것도 가끔 올려도 아무 개념이 필요없었습니다. 그런데 워드프레스로 넘어가는 순간부터는 내가 쓴 글의 용량이 얼마나 되는지 적극적으로 알아내고 관리할 필요가 있습니다. 전송량이 제한되어 있으니까요. 한편 전송량이 적절한 워드프레스는 자동적으로 구글 SEO에 좀 더 높은 점수를 받을 수 있습니다.
대략적인 전송량
전송량은 호스팅이나 클라우드 서버를 대여할 때 알 수 있습니다. 이걸 100%는 아니더라도 어느 정도는 계산할 줄 알아야 관리가 될 겁니다. 예를 들어 벌쳐 같은 경우 가장 기본적인 세팅의 클라우드 컴퓨터가 1TB 부터 시작합니다. 1테라 바이트면 1000기가이고 1기가는 1000메가입니다. (정확히는 2의10승인 1024로 해야하는데 편의상 1000개로 계산)
아래 벌쳐의 플랜을 보면 1테라 전송량이라고 써있는데 이는 한달 기준입니다. 벌쳐의 전송량 정책은 한달을 672시간으로 계산합니다(28일) 1TB는 1000GB로 이를 672시간으로 나누면 한시간에 약 1.5GB의 전송이 가능하다는 뜻입니다. 무슨말이냐면 하나의 조회수에 전송량이 1메가라면 한시간에 1500회 조회가 가능하다는 것 이지요. 하루는 36GB로 일조회수 3만6천명이 방문할 수 있다는 말입니다. 상당한 숫자긴 한데 이건 모든 포스트의 크기가 1메가라고 가정했을 때의 이야기고 이보다 더 많은 전송을 하게되면 그만큼 줄어들게 되겠지요.
암튼 이건 웹사이트가 아니라 개인의 블로그에 관한 이야기니까 한달 1TB, 2TB의 전송량은 충분하고도 넘칠 것이다 - 라는 감각은 있습니다. 근데 동영상 페이지를 운영하는 경우 완전히 다르게 접근해야 할 겁니다. 그래서 많은 웹사이트들이 유튜브에 올리고 링크를 다는 방식을 많이 씁니다. 심지어 관공서들도 자체 서버에 동영상을 올리느게 아니라 유튜브에 올리고 엠베드 시키는 경우가 많습니다.
하나의 포스트를 전송하는데 1메가 정도라고 가정해봅니다. 이 1메가에는 워드프레스 블로그의 구조에 관한 것도 있겠고, 폰트를 다운로드 하거나 플러그인 관련된 전송이 있을 수 있습니다. 그것들은 어느 정도 고정된 전송량이라 보면 되고, 가변성이 가장 큰 것은 본문 관련 파일입니다. 블로그니까 이미지가 가장 좀 영향을 많이 미친다고 할 수 있겠지요. 사진은 고화질 저화질에 따라 용량이 천차만별이 될 수 있습니다. 그래서 이미지 관리 필요성이 있을 때, 또 그걸 해결해주는 플러그인이 있습니다.
이 포스트에서 설명하는 것들이 티스토리와의 중요한 차이점에 들어갑니다. 이미지 최적화는 티스토리를 사용하더라도 원래 해야하는 것이 맞는 것인데 워드프레스에 가면 전송량까지 관리하면서 더 알뜰하게 해야 한다는 말이지요.
설치하기
이미지 압축 & 최적화 플러그인도 여러개가 있는데 사용자가 많은 TinyPNG 써보겠습니다. 플러그인은 사용자가 많고 오래된 것들이 아무래도 안정성이 있지요.
플러그인 검색으로 TinyPNG를 '지금설치'합니다.
설치 후에 계정을 등록합니다. 간단한 이메일 인증으로 free plan에 등록됩니다. free plan은 매달 500개의 압축이 가능하고 추가 압축을 위해서는 비용을 부담해야 합니다.
새로 업로드하는 것은 자동으로 압축하는게 기본 설정이니까 그건 놔두고 기존의 이미지를 최적화 해봅니다.
메뉴의 미디어 -> Bulk Optimization 으로 가서 기존의 이미지를 압축해보겠습니다. 대략 168개 이미지가 업로드되었고 설정에서 선택한 Original Image와 Thumbnail 두개를 압축하는데 비용이 0달러입니다. 아직 500개를 사용하지 않았으니까요.
최적화를 시작하면 프로그래스바가 진행되면서 압축이 시작됩니다. 필자는 이미지를 올릴 때 ShareX로 캡쳐하기 때문에 이미지 용량 자체를 적게 업로드하는 편입니다만, 그래도 10% 이상의 절약효과가 있네요. 이 워드프레스 블로그는 최근에 개설하고 아직 글이 100개도 안되기 때문에 아직 용량문제는 없습니다만, 시간이 지날 수록 점점 늘어나겠지요. 몇십메가의 용량일 때와 몇백메가, 그리고 기가단위로 용량이 커질 수록 그 절약효과는 더 커지게 됩니다. 장기적으로 워드프레스 블로그를 운영하려면 필수적으로 관리해줘야 한다는 뜻입니다.
작업이 끝나자 무려 29%나 절약했습니다. 고화질 사진이나 스크린샷을 쓰는 블로거들은 체감적으로 압축의 효과를 더 크게 느낄겁니다. 화질은 조금 다운그레이드할 수 있겠지만 웹에서 보는 것에는 충분한 정도입니다. 화질이 조금 낮춰서 SEO 점수를 잘받아서 조회수를 늘리는게 더 좋습니다.
추가로 고려할 플러그인
최적화 플러그인 (optimize)로 검색해보면 다양한 플러그인이 있습니다. 보통은 캐싱 기능으로 최적화를 하고 이미지 압축 기능도 제공하는데요. 이런 기능들이 중복되면 사이트의 스피드에 또 영향을 미칠 수 있습니다. 그래서 기능을 겹치지 않게 플러그인을 설치해서 사용하는 요령도 필요합니다. 안 그러면 이미지만 압축하고 다른 종합 최적화 플러그인으로 바꿀 수도 있지요. 여러가지 플러그인을 써보면서 배우는 것도 많습니다.
