블로그 이미지 최적화, 초보자가 몰라서 망친 CDN 트래픽 이야기

글쓴이 /

블로그 이미지 최적화를 제대로 하지 않아 QUIC.cloud 무료 트래픽을 모두 소진한 경험을 공유합니다.
초보자가 알아야 할 이미지 관리법과 WebP 활용법을 쉽게 설명합니다.

블로그 이미지 최적화

이미지 최적화의 중요성

워드프레스를 설치하고 글을 작성하기 시작했을 때, 저는 단순히 글만 잘 쓰면 블로그가 성장할 줄 알았습니다.
하지만 예상치 못한 문제는 바로 이미지 용량이었습니다.
처음에는 PNG와 JPG 파일을 그대로 올렸는데, 이게 얼마나 큰 실수였는지는 나중에 알게 되었습니다.
블로그 이미지 최적화가 부족하면 페이지 속도가 느려지고 방문자가 금방 이탈한다는 사실을 그때는 몰랐습니다.

무료 트래픽이 순식간에 소진된 이유

LiteSpeed Cache 플러그인을 설치하면 PNG나 JPG를 자동으로 WebP로 바꿔 주는 기능이 있습니다.
GPT의 안내를 통해 LiteSpeed Cache 플러그인을 설치했고 이제 플러그인이 자동으로 이미지를 변환해주면 용량이 적어져 가볍고 빨라질테니 ‘난 열심히 글만 쓰면 되겠구나’라고 생각했는데, 문제는 변환 과정에서 QUIC.cloud 무료 트래픽을 사용한다는 점이었습니다.

그 결과, 몇 장 되지도 않는 이미지를 올렸는데도 무료 0.3GB 트래픽이 금방 소진되었고, CDN 기능은 정지되어 버렸습니다.
블로그 이미지 최적화가 얼마나 중요한지 몸소 체험한 순간이었습니다.

해결책은 WebP 업로드

결국 방법을 바꾸었습니다.
앞으로는 PC에서 직접 이미지를 WebP로 변환한 후 올리기로 한 겁니다.
이렇게 하면 QUIC.cloud 서버가 추가로 트래픽을 쓸 일이 없으니 무료 한도를 걱정할 필요가 없습니다.

실제로 이렇게 바꾼 후에는 더 이상 무료 트래픽이 급격히 줄어들지 않았습니다.
블로그 이미지 최적화를 스스로 처리한 효과였습니다.

이미지 최적화를 위한 사이트 & 프로그램

온라인 사이트 (설치 불필요)
  1. TinyPNG
    • PNG, JPG 압축에 최적화
    • 1회 최대 20장, 5MB 이하 파일 무료
    • 드래그 앤 드롭만 하면 바로 용량 줄여줌
  2. Squoosh (구글 제공)
    • PNG/JPG → WebP, AVIF 등으로 변환 가능
    • 압축율과 품질을 직접 눈으로 비교하면서 조절 가능
  3. ILoveIMG
    • 이미지 압축, 크기 조절, 형식 변환 등 다양한 기능 제공
    • 간단한 편집까지 가능
  4. CompressJPEG/PNG
    • JPG/PNG/WebP 지원
    • 최대 20개 파일을 한 번에 처리 가능
PC 프로그램 (대량 처리 가능)
  1. XnConvert (윈도우/맥/리눅스)
    • PNG/JPG → WebP 일괄 변환 지원
    • 이미지 크기 조정, 리네이밍, 압축 등 자동화 가능
  2. ImageOptim (맥 전용)
    • 맥 유저 필수 이미지 최적화 툴
    • 드래그만 하면 자동 압축 & 메타데이터 제거
  3. IrfanView (윈도우)
    • 뷰어지만 일괄 변환/최적화 기능이 강력함
    • JPG/PNG → WebP 변환 지원
  4. GIMP (무료 포토샵 대체)
    • 이미지 편집 + 최적화 + WebP 내보내기 기능
    • 다소 학습 필요하지만 기능이 매우 풍부
워드프레스 플러그인 (자동 처리)
  • LiteSpeed Cache → QUIC.cloud 통해 자동 최적화 (이미 사용 중)
  • ShortPixel → 유료지만 강력, WebP/AVIF 지원
  • Imagify → 압축률 선택 가능, 초보자 친화적

호환성 걱정은 기우였다

“WebP만 올리면 구형 브라우저에서는 안 보이는 건 아닐까?”라는 걱정이 있었습니다.
하지만 LiteSpeed Cache가 자동으로 PNG/JPG 원본을 함께 제공해 주는 방식을 사용하기 때문에, 방문자 입장에서는 어떤 브라우저를 쓰든 이미지를 문제 없이 볼 수 있었습니다.

블로그 이미지 최적화가 단순히 빠른 속도뿐만 아니라 안정성도 함께 챙길 수 있다는 걸 확인한 순간이었습니다.

초보자가 배운 교훈

이번 경험에서 제가 얻은 교훈은 단순합니다.

  • 이미지는 반드시 최적화 후 업로드해야 한다.
  • PNG/JPG 원본은 무겁기 때문에 가능하면 WebP를 기본으로 사용한다.
  • LiteSpeed Cache의 변환 기능은 유용하지만, 무료 트래픽 한도를 고려해야 한다.
  • 블로그 이미지 최적화는 초보 블로거가 반드시 먼저 배워야 할 과제다.

블로그를 운영하면서 저는 글쓰기보다도 이미지 관리가 더 중요한 순간이 있다는 걸 배웠습니다.
블로그 이미지 최적화를 제대로 하지 않으면 속도는 느려지고, 방문자는 이탈하고, CDN 무료 트래픽까지 순식간에 소모됩니다.
반대로 WebP로 직접 관리하니 속도도 빨라지고 불필요한 비용도 들지 않았습니다.

※ karismamoon-life 블로그가 어떻게 발전해 나가는지 블로거 성장기를 통해 확인해 보세요.

관련 게시물

위로 스크롤