본문 바로가기
살림 노트/디지털 활용법

블로그에 올리는 이미지, 그냥 올리면 손해! 최적화 크기와 용량 줄이는 팁 총정리

by 살림킹 2025. 5. 17.
반응형

 

블로그에 올리는 이미지, 그냥 올리면 손해! 최적화 크기와 용량 줄이는 팁 총정리

블로그에 최적화된 이미지 크기와 용량 줄이기 팁

이미지 예쁘게 올렸는데, 블로그가 느려졌다구요?
그렇다면 이미지 크기와 용량을 한 번 점검해보세요.
사진은 블로그의 분위기를 살리는 중요한 요소지만,
너무 크거나 무거운 이미지는 로딩 속도와 검색 순위에 악영향을 줍니다.

오늘은 티스토리, 워드프레스 등 블로그에 꼭 필요한 이미지 최적화 방법을 쉽게 정리해드릴게요.


1. 왜 이미지 최적화가 중요한가요?

  • 페이지 로딩 속도 향상
    → 방문자가 이탈하지 않고 끝까지 읽을 확률 UP
  • SEO 최적화에 긍정적인 영향
    → 검색 노출 순위 개선
  • 모바일에서도 빠르고 부드러운 화면 제공
    → 특히 스마트폰 유저가 많은 티스토리 블로그에서는 필수!

2. 블로그에 적당한 이미지 크기 (해상도)

  • 가로 700~1000px 정도가 가장 적당해요.
  • 썸네일은 가로 600px 내외,
    본문 이미지도 최대 1200px을 넘기지 않는 게 좋습니다.

👉 너무 큰 이미지는 리사이징 후 업로드하세요!


3. 권장 이미지 파일 형식

용도 추천 포맷 이유
일반 사진 JPG/JPEG 용량이 작고 호환성 좋음
투명 배경 PNG 아이콘, 일러스트, 스티커에 적합
블로그 썸네일, 카드뉴스 WEBP 화질은 유지하고 용량은 매우 작음 (단, 일부 브라우저 호환성 확인 필요)

4. 이미지 용량 줄이는 방법 (무료 툴 소개)

온라인 압축 툴

맥북용 앱

  • ImageOptim: 드래그만 해도 고화질 유지하며 자동 압축
    👉 https://imageoptim.com/mac
  • Squash (유료): GUI 기반으로 쉽게 압축 가능
반응형

5. 리사이징도 함께 하기

크기와 용량, 둘 다 줄이면 효과가 배가됩니다!

  • Squooshhttps://squoosh.app
    원하는 가로세로 비율로 줄이면서 포맷도 변환 가능
  • 맥북 기본 미리보기 앱에서도 가능
    → 사진 열기 > 상단 메뉴 ‘도구’ > ‘크기 조정’

이미지를 최적화한 후 업로드 전 체크리스트

6. 이미지를 최적화한 후 업로드 전 체크리스트

파일명은 영어로 간단히 (예: blog-thumbnail.jpg)

alt 텍스트(대체 텍스트)를 설정하면 SEO에 더 좋아요

너무 많은 이미지를 한 글에 넣기보다는, 핵심만 사용


7. 이미지가 많을 땐 Lazy Load 기능 활용하기

워드프레스에서는 플러그인으로 쉽게 설정 가능해요.
티스토리는 기본적으로 Lazy Load가 적용되어 있지만,
직접 HTML을 편집할 경우엔 <img loading="lazy"> 속성 추가도 가능해요.


마무리하며

이미지는 블로그의 인상을 좌우하지만,
용량과 크기를 관리하지 않으면 오히려 독이 될 수 있어요.
오늘 소개해드린 무료 도구최적화 기준만 잘 지켜도
블로그 속도와 SEO 모두 확실히 개선됩니다.

다음 포스팅에서는 카드뉴스나 썸네일 만들 때 이미지 크기와 비율 설정하는 팁도 알려드릴게요!

 

 

 

2025.04.21 - [살림 노트/디지털 활용법] - 하트 이모티콘 특수문자 모음 – 감정 표현이 더 예뻐지는 순간

 

하트 이모티콘 특수문자 모음 – 감정 표현이 더 예뻐지는 순간

하트 이모티콘 특수문자 모음 – 감정 표현이 더 예뻐지는 순간요즘은 굳이 말로 다 하지 않아도, 이모티콘 하나만으로 마음을 충분히 전할 수 있는 시대입니다. 특히 하트 이모티콘은 누군가에

livingking.tistory.com

2025.03.21 - [살림 노트/디지털 활용법] - 미리캔버스 활용법: 무료 디자인 툴로 손쉽게 제작하는 방법

 

미리캔버스 활용법: 무료 디자인 툴로 손쉽게 제작하는 방법

미리캔버스 활용법: 무료 디자인 툴로 손쉽게 제작하는 방법미리캔버스(Miricanvas)는 초보자도 쉽게 디자인을 제작할 수 있는 무료 온라인 디자인 툴입니다. 별도의 프로그램 설치 없이 웹에서 바

livingking.tistory.com

2025.03.25 - [살림 노트/생활 꿀팁] - 닉네임, 블로그 이름 고민될 때 – 뜻도 좋고 느낌도 강한 영어 단어 10가지

 

닉네임, 블로그 이름 고민될 때 – 뜻도 좋고 느낌도 강한 영어 단어 10가지

닉네임, 블로그 이름 고민될 때 – 뜻도 좋고 느낌도 강한 영어 단어 10가지아이디 하나에도 마음을 담고 싶은 당신에게처음 블로그를 시작할 때, 또는 새로운 SNS 계정을 만들거나, 조용히 나만

livingking.tistory.com

 

반응형