» web » service

이미지 사진 용량 줄이기 webp png jpg 용량 줄이기

오늘은 이미지 사진 용량 줄이기 작업을 할 수 있는 사이트를 하나 소개하겠습니다. 그리고 사진 용량 줄이기 작업을 해야 하는 이유를 간단하게 설명하겠습니다. 이미지 용량을 줄여야 하는 가장 큰 이유는 업로드 제한 또는 저장 공간 제약 때문입니다. 업로드 파일 크기 제한이 없거나, 하드디스크 등 사진을 저장할 저장 장치가 충분하다면 굳이 이미지 사진 용량 줄이기 작업을 하지 않아도 됩니다.

이미지 사진 용량 줄이기

사진이나 이미지 파일은 프로그램 등을 이용하여 용량을 줄일 경우 줄어든 용량만큼 화질이 저하될 수 있습니다. 추억이 깃든 사진은 가급적이면 원본 파일로 보관하는 것이 좋습니다.

이미지 사진 용량 줄이기

인터넷 커뮤니티 사이트 등의 게시판은 첨부 파일 크기에 제한이 있습니다. 이 때문에 제한된 한도에 맞게 이미지, 문서 등을 첨부해야 글을 등록할 수 있습니다. 어쩌다 한 번 이미지 사진 용량 줄이기 기능이 필요한 경우라면 웹서비스를 이용하면 됩니다. 오늘 소개하는 이미지 사진 용량 줄이기 사이트가 딱 이런 용도로 사용하기 좋습니다.

고화질 사진을 대량으로 첨부해야 하거나, 원본 이미지 파일을 보관해야 하는 경우라면 구글 드라이브 등을 이용하여 웹 페이지에 게재하면 될 것입니다.

 

검색 사이트를 타깃으로 하여 운영하는 블로그에 첨부할 이미지는 웹서비스보다는 프로그램으로 작업하는 것이 좋을 것입니다. 워터마크 삽입, 사진 크기 변경, 사진 용량 줄이기 등의 이미지 검색 최적화 작업을 병행하여 진행하는 것이 좋기 때문입니다. 무엇보다 프로그램을 이용하면 다량의 파일에 대해 이미지 크기 조절 파일명 일괄 변경 사진 워터마크 삽입을 한 번에 일괄 작업할 수 있습니다.

블로그 등 웹페이지의 리소스로 사용할 경우에는 반드시 이미지 사진 용량 줄이기 작업이 선행되어야 합니다. 이유는 구글 검색 엔진 최적화(SEO) 때문입니다. 검색 사이트를 타깃으로 운영하지 않는다면 굳이 이미지 최적화 작업을 할 필요는 없습니다.

 

구글 검색 엔진 최적화(SEO)에서 페이지 속도는 큰 비중을 차지하는 요소 중 하나입니다. 페이지 로딩 속도를 높이려면 페이지를 구성하는 모든 요소 및 리소스를 최적화해야 합니다. 방법도 쉽고 효과가 높은 것이 이미지 최적화입니다.

티스토리 블로그의 경우 SEO 목적으로 이미지 용량을 줄이고 최적화합니다. 설치형 워드프레스 등의 경우는 이미지 사진 용량 줄이기 작업을 통해 운영 비용까지 절감시킬 수 있습니다. 목적은 저마다 다르지만 티스토리나 워드프레스 블로그에서 사진 용량 줄이기 및 이미지 최적화 작업은 기본이자 기초입니다.

그렇다고 이미지 품질을 고려하지 않고 무턱대고 용량만 줄이면 안 됩니다. 이미지 품질 또한 순위 산정 요소 중 하나이기에 이미지 품질은 유지하고, 용량을 최대로 줄여야 합니다.

사진 용량 줄이기 사이트 tinypng

tinypng 사이트를 이용하면 이미지 사진 파일 크기를 큰 폭으로 줄일 수 있습니다.

투명 배경 이미지 사진 용량 줄이기 전과 후 차이점

KB 단위로는 눈길을 끌지 못합니다. 57KB 크기의 이미지를 15KB 크기로 줄여봐야 고작 42KB가 줄어든 것에 불과합니다.

단위를 MB 또는 GB로 바꿔야 비로써 압축 효과가 크게 느껴질 것입니다. 가장 좋은 것은 퍼센티지로 표시하는 것입니다. 70% 이상의 크기가 줄어든 것이기 때문에 사진 용량 줄이기 효과가 크게 느껴질 것입니다.

압축 효과를 설명하며 잘못된 예시를 들고 있는 문제가 있지만 사진 용량 줄이기 효과는 좋습니다.

다만 아쉽게도 Webp, png, jpg 이미지 확장만 지원합니다. 또한 이미지 품질 설정이 불가능합니다.

Webp PNG JPG 용량 줄이기

이미지 최적화 및 사진 용량 줄이기 tinypng

  1. 이미지 최적화 및 변환 사이트인 tinypng에 방문합니다.
  2. 마우스로 드래그 앤 드롭하여 이미지를 업로드합니다.
    • 단일 파일은 최대 5MB까지 업로드할 수 있습니다.한 번에 최대 20개의 이미지를 업로드할 수 있습니다.

  1. 이미지를 업로드하면 자동으로 최적화 작업이 진행됩니다.
    • 작업 속도는 다소 느린 편입니다.

다운로드 버튼 클릭 또는 드롭박스에 저장 버튼 클릭

  1. 작업 완료 후 표시된 Download all 버튼을 누르면 결과물 이미지 파일이 다운로드됩니다.
    • 단일 파일 작업 시 이미지 파일로 다운로드됩니다.
    • 다중 파일 작업 시 zip 압축 파일로 다운로드됩니다.
    • Save to Dropbox 버튼을 누르면 드롭박스로 저장할 수 있습니다.

업로드한 이미지 확장자와 상태에 따라 약 10 ~ 70% 수준으로 이미지 용량이 압축됩니다. png jpg 용량 줄이기 효과가 좋은 것 같고, webp 용량 줄이기 효과는 미미합니다.

그도 그럴 것이 이미 최적화되어 압축된 webp 이미지는 크기를 줄이거나, 화질을 떨어트리는 방식 외에는 용량을 줄이기 어렵습니다.

이미지 압축 등의 최적화 작업이 기본으로 선행되겠지만, 화질을 떨어트리는 방식의 사진 용량 줄이기 작업 또한 병행되기 때문에 약 10 ~ 20% 수준만 줄어들었다고 볼 수 있습니다.

만약 다른 이미지 최적화 사이트 혹은 이미지 일괄 변환 프로그램 등을 이용하여 이미지 용량을 줄일 경우에는 이미지 품질을 기본 설정으로 두거나, 80 ~ 90% 정도 수준으로 설정하여 진행하면 됩니다.

용량 줄일 때 품질 고려하여 적절히 줄여야 합니다. 70% 미만으로 설정하면 사진 이미지 품질이 크게 떨어져 미관상으로도 보기 흉하고 SEO에 역효과를 줄 수 있습니다.

부록 : 구글 SEO 이미지 최적화

이미지 최적화 작업은 사진 용량 줄이기 작업으로 끝나지 않습니다. 선행되어야 하는 작업은 맞지만, 시작 단계의 최적화 작업일 뿐입니다.

구글 SEO 문서를 보면 이미지 최적화와 관련된 내용들이 많습니다. 필수적으로 해야 하는 이미지 최적화 방법만 간단하게 설명하겠습니다.

네이버 블로그의 경우는 에디터에서 적용이 불가능 내용들이 있으니 참고만 하시기 바랍니다.

구글 검색 엔진 최적화 중 이미지 alt 속성 설정 안내

  • 이미지 대체 텍스트 (alt 속성) 설정
  • 이미지 크기 지정
  • 웹페이지에 맞는 크기의 이미지 사용
  • 오프 스크린 이미지 지연
  • *WebP 또는 AVIF 차세대 형식 이미지

이미지 대체 텍스트(alt 속성) 설정

alt 속성은 웹페이지에서 이미지가 표시되지 않을 때 대체되는 텍스트를 말합니다. 일명 엑박이라 불리는 상황에서 alt 속성으로 입력된 텍스트가 표시됩니다.

시각장애인을 위한 기능으로 이미지의 alt 속성을 읽어 줍니다.

첨부 이미지에 맞는 짧고 명료한 내용(예시: 구글 검색 엔진 최적화 작업 중인 웹 선생)을 입력하면 됩니다.

이미지 크기 지정

이미지 크기를 지정하는 이유는 웹페이지 레이아웃의 변화를 최소화하기 위함입니다.

모바일 디바이스 때문인데, 가로 x 세로 크기가 지정되지 않으면 페이지 크기에 따라 이미지 크기도 변합니다. 그에 따라 페이지 로딩 속도가 느려집니다.

웹페이지에 맞는 크기의 이미지 사용

크기에 맞는 이미지를 사용하는 것은 너무 당연한 것입니다. 블로그 글 작성 시 첨부하는 이미지는 게시물 본문에 맞는 크기를 사용해야 합니다.

페이지 본문 가로 최대 크기가 1000px이라면 첨부 이미지의 가로 크기도 최대 1000px를 넘지 않아야 합니다.

네이버 블로그의 경우 본문 영역(#content-area) 기준으로 사이드바 있는 스킨은 최대 787px, 사이드바 없는 스킨은 최대 966px입니다.

첨부 이미지 혹은 사진 크기가 이보다 작아도 됩니다. 사실 페이지 보다 더 큰 이미지를 사용할 이유도 필요도 없습니다.

*네이버 블로그의 본문 영역 크기에 대해 잘못 알고 있거나, 다른 방법이 있을 수 있습니다. 만약 다른 방법이 있다면 댓글로 알려주시길 부탁드립니다.

오프 스크린 이미지 지연

이미지 지연 로딩은 당장 보이지 않는 곳의 이미지는 표시하지 않는 방식으로 페이지 로딩 속도를 높이는 기술입니다.

페이지에서 보이지 않는 곳의 이미지는 표시되지 않게 차단하고, 스크롤을 끌어올려 화면이 보일 때 이미지를 표시하란 얘기입니다.

네이버 블로그에 적용된 화면 끌어올릴 때 이미지가 나타나는 것이 바로 오프 스크린 이미지 지연입니다.

줄여서 이미지 지연 로딩이라 하는데, 티스토리 블로거들은 페이지 로딩 속도를 끌어올리기 위해 직접 소스를 적용하기도 합니다.

 

WebP 차세대 형식 이미지

이 내용은 참고만 하세요. WebP 이미지는 구글이 선보인 이미지 형식입니다. SEO라는 것이 애당초 구글 검색을 대상으로 합니다.

구글이 표준으로 정하거나 기준을 세우면 검색 결과의 순위 요소도 그에 맞게 변합니다. 최근에 모바일 속도, 빠른 URL 및 좋은 URL이 SEO에서 높은 비중을 차지하는 순위 요소가 되었습니다.

이미지 Webp 변환

지금은 WebP 이미지가 표준이 아닙니다. 하지만 구글은 수년 동안 지속적으로 차세대 형식(WebP, AVIF) 이미지 사용을 권장하고 있습니다.

블로그에서의 사진 용량 줄이기 작업은 결국 구글 검색 엔진 최적화(SEO)를 하기 위함입니다. 다른 형식에 비해 파일 용량이 적은 포맷의 이미지를 사용하거나, 이미지 용량을 줄여 페이지 로딩 속도를 빠르게 해야 합니다. 답은 정해져 있지만, 선택은 본인이 해야 합니다.

이미지 편집 프로그램 포토스케이프 X 등을 이용하면 WebP 이미지로 일괄 변환할 수 있습니다. 소량의 이미지를 변환할 경우에는 꿀뷰 webp 변환 기능이나, XnView 셸 확장의 빠른 형식 변환을 이용하면 편합니다.

대량의 webp 이미지 변환 작업은 xnconvert 등의 프로그램을 이용하면 보다 안정적으로 할 수 있을 것입니다.

Leave a Comment