이미지 용량 크기를 줄여 티스토리 페이지 이탈률을 낮추자

티스토리는 네이버 블로그랑 다르게 이미지 용량 크기를 줄여야 한다.

 

고화질 이미지의 단점을 발견하다.

그동안 포스팅해오면서 신경 안 썼던 부분입니다. 페이지에 글과 함께 사진 이미지 올릴 때 되도록 고화질 이미지를 올려 보는 사람들에게 만족도를 높이려고만 했지 페이지 로딩 속도를 위한 이미지 용량 경량화(줄이기) 작업은 생각도 하지 못하고 포스팅해 왔습니다.

 

대부분 와이파이로 접속해서 속도가 빨라 그 필요성을 느끼지 못한 것이 한 요인이었습니다. 그래서 이미지 용량이 페이지에 어떤 영향을 주는지 모르고 지내 왔습니다. 그러다 집 와이파이를 당분간 쓸 수 없는 사정이 생겨 모바일 핫스팟을 이용해 스마트폰을 와이파이로 사용하면서 이미지 용량 경량화의 중요성을 깨달았습니다.

 

좀 더 나은 인터넷 작업을 위해 모바일 요금제도 기본 7GB 다 쓰면 무제한 1Mbps 제공해주는 상품에서 11GB+매일2GB 추가 기본 데이터 한 달 총 71GB에 다 11GB와 매일 제공하는 2GB 소진 시 3 Mpbs 무제한 제공하는 요금제로 변경했습니다. 요금은 기존 16900원에서 35200원이 부담이 조금 증가했습니다.(네이버 페이로 5000원 페이백 해줘서 실질 30000만 원 정도입니다.)

 

그런데 기존 집 인터넷 와이파이 쓸 때는 몰랐는데 스마트폰 데이터 쓰다 보니 11GB 금방 다 쓰고 하루 2기가씩 제공하는 것 또한 금방 소모되는 것을 알았습니다. 결국 대부분의 시간을 3Mbps 속도로 이용하고 있습니다. 3Mbps는 일단 영상도 HD로 봐도 버퍼링 거의 없고 일반 웹서핑이나 인터넷 이용에 있어 기존 집 인터넷 와이파이에서 제공되는 초고속 인터넷과 비교해 일반 인터넷 이용 시 로딩 속도가 크게 밀리지 않는 것 같아 만족하며 쓰고 있습니다.

 

그런데 쓰다 보니 한 가지 단점을 발견했습니다. 좀 더 구체적으로 말하면 다른 웹사이트나 유튜브 이용 시 큰 불편함은 없었습니다. 그러니 티스토리 이용 시 단점이라고 해야겠습니다. 티스토리 포스팅 중 용량이 큰 이미지가 많은 페이지 같은 경우 텍스트는 금방 로딩돼서 잘 보이는데 이미지를 불러오는 데는 한참 걸립니다. 심지어 NO IMAGE(노 이미지)가 뜨는 것을 발견했습니다. 다른 사이트들은 사진이 많아도 로딩이 크게 지장이 없는데 유독 티스토리가 심하다는 것을 발견했습니다. 그래서 내 이미지 많은 포스팅 볼 때나 또는 다른 구독자님들 페이지 볼 때 사진이 많은 페이지들은 NO IMAGE가 많이 뜹니다. 아무래도 많은 분들이 이미지 경량화 작업을 안 하고 용량이 큰 이미지를 그대로 페이지에 올려서 그런 것 같습니다.

 

 

반응형

 

 

관찰한 결과 특이한 점은 다른 대부분의 일반 사이트들은 이미지 용량 최적화 작업이 되어 있는지 이미지가 많아도 3Mbps속도에서 이미지 로딩에 큰 불편함을 느낄 수가 없었습니다.

 

비교대상이 되는 네이버 블로그만 봐도 이미지 로딩을 기술적으로 처리하는지 똑같이 용량이 큰 이미지를 많이 올려도 무리 없이 이미지가 로딩되고 노 이미지도 안 뜹니다. 유튜브도 인터넷 속도가 느리면 자동으로 화질을 낮춰서 버퍼링이 생기지 않게 해 줍니다. 그런데 티스토리에는 그런 기술들이 적용되어 있지 않은 것 같습니다. 그래서 각자가 포스팅할 때 낮은 속도의 데이터로 접속하는 방문자들을 위해 NO IMAGE가 덜 생기게 이미지 용량 줄이는 작업을 해주어야 하는 걸 알았습니다.

 

물론 많은 분들이 집이든 공공장소든 와이파이를 이용해 빠른 인터넷망을 이용해 티스토리에 접속할 것입니다. 하지만 기본 데이터 다 쓰고 와이파이 접속 못하고 저속의 데이터로 접속할 때도 있을 겁니다. 그럴 때 자신의 티스토리 포스팅에 이미지가 많고 이미지 경량화를 하지 않았다면 대부분의 이미지가 NO IMAGE가 뜰 것입니다. 요리 여행 제품 등 이미지가 많이 들어가는 각종 리뷰 포스팅할 때 해당될 것 같습니다.

낮은 속도의 데이터로 접속할때 이미지 용량이 크면 위에처럼 노 이미지 뜰 확률이 높습니다.

 

대부분의 이미지가 NO IMAGE(노 이미지)로 뜨면 그로 인해 페이지 중간에 이탈하는 분들이 생길 것입니다. 이를 방지하기 위해서 할 수 있는 것 중에 하나는 이미지 용량을 수동으로 줄여서 올리는 방법입니다. 티스토리도 네이버처럼 아무 이미지나 올려도 무리 없이 로딩되는 기술을 적용해 주면 좋겠지만 현재로는 개인들이 각자 이미지 용량을 줄여 올리는 수 밖에는 없는 것 같습니다. 또한 구글 같은 곳에서 검색 노출 상위에 오르려면 페이지 로딩 속도도 관여하는 것 같아 구글 노출을 노리시는 분들은 신경을 써 주셔야 할 것 같습니다.

 

 

 

 

이미지 줄이는 방법은 쉽게 찾아볼 수 있지만 제가 요즘 하고 있는 이미지 용량 줄이는 방법을 소개해 드리겠습니다.

이미지 용량을 줄이는 방법은 프로그램을 이용해 확장자를 바꾸거나 이미지 사이즈를 줄이면 용량이 줄어듭니다. 거기에 이미지 용량 줄여주는 사이트를 이용하면 좋습니다.

 

이미지를 사용할 때 확장자 PNG가 JPG보다 용량이 비교적 클 때가 있습니다. 이때 이미지 툴을 이용해 PNG확장자를 JPG로 바꿔주시면 용량을 줄이는 데 도움이 됩니다. 또한 사이즈를 적당한 크기로 줄이면 다시 이미지 용량을 줄일 수 있습니다 거기에 이미지 줄여주는 프로그램이나 사이트를 이용하면 최종적으로 눈에 띄는 용량 크기로 줄어든 결과물을 확인 할 수 있습니다.(1/10 이상으로 줄일 수도 있음)

 

우선 저는 이미지 용량을 줄이려고 알씨 이미지 툴을 무료로 다운로드해서 설치했습니다.

인터넷으로 서치 해서 설치해 주시면 됩니다. 알씨를 통해 작업할 것은 확장자 변환과 이미지 사이즈 조정입니다. 그런데 많은 이미지 편집툴이 비슷한 기능을 제공하니 같은 기능을 제공하는 다른 툴을 사용해도 무방 할 것 같습니다.

 

확장자 변환

 

 

확장자 변환을 통해 1.10M->440KB로 이미지 크기가 줄었습니다.

 

이미지 확장자를 PNG->JPG로 변환합니다. 주의할 것은 변환 시 오히려 이미지 크기가 늘어날 수 있습니다. 그래서 변경하고 용량 크기가 늘었는지 줄었는지 확인하셔야 합니다. 용량 크기가 적을 때 변환하면 오히려 늘어나는 것 같습니다.

 

 

 

 

항상 jpg가 용량 크기가 더 작은 것은 아닌 것 같습니다.

다음은 사이즈 크기를 줄여 용량 크기를 줄여 보겠습니다.

사진크기를 줄이면 용량이 줄어 듭니다.

위에 보시는 것처럼 이미지 사이즈를 줄이면 용량 크기가 줄어듭니다.

 

전문 사이트 이용하기

사이트를 이용해 화질을 거의 비슷한 수준으로 유지하면서 이미지 용량 크기만 줄입니다. 

타이니 피엔지라는 이미지 용량 크기를 줄여주는 사이트입니다. 인터넷에서 찾아보면 비슷한 사이트들이 많이 있습니다. 적당한 것을 선택해서 이용해 보면 좋을 것 같습니다.

 

 

 

 

타이니피엔지 이용할 때 인터넷 창은 크롬보다는 마이크로소프트 엣지를 이용하시는 것이 좋을 것 같습니다.

이미지 확장자 변환과 사이즈 조정등을 거쳐 용량 크기를 줄이고 또 사이트를 이용해 용량 크기 줄이기

여러 단계를 거쳐 용량 크기를 줄인 결과

이미지 확장자 변환과 사이즈 조정 등을 거쳐 용량 크기를 줄이고 거기에 사이트를 이용해 더 줄이면 처음 크기보다 1/10보다도 더 작은 수준으로 줄일 수도 있습니다.

 

어느 것이 원본이고 용량을 줄인 결과물인지 그렇게 차이를 느끼기 힘듭니다.

제가 한 방법대로 이미지 용량 크기를 줄인다면 비교적 이미지 화질을 유지한 채 용량 크기가 줄어드는 것을 느낄 수 있습니다.

 

네이버 블로그는 신경 안 써도 되지만 티스토리에 이미지를 올릴 때는 이렇게 용량 크기를 줄여서 올리는 것이 좋을 것 같습니다.

 

그동안 이미지 용량 크기를 줄이지 않고 포스팅해서 시간 나는 데로 예전 포스팅 이미지를 수정 하고 있습니다. 처음부터 신경 써서 포스팅하셔서 저처럼 여러 번 일하는 수고를 하지 않으셨으면 좋겠습니다.

 

더 좋은 방법을 알고 계시면 제시한 것처럼 안 하셔도 됩니다. 용량 줄이는 방법은 많이 있으니 자신에게 적합한 방법을 찾아 하시면 될 것 같습니다.