이미지 최적화 프로그램이란? | 이미지 크기 축소 방법

이미지 최적화 프로그램을 사용하면 이미지가 인터넷에 최적화되고 빠르게 로드될 수 있도록 이미지 파일 크기를 줄일 수 있습니다.

학습 목표

이 글을 읽은 후에 다음을 할 수 있습니다:

  • '이미지 최적화' 정의
  • 이미지 속도를 추가로 높이는 방법 이해하기

관련 콘텐츠


계속 알아보시겠어요?

인터넷에서 가장 인기 있는 인사이트를 한 달에 한 번 정리하는 Cloudflare의 월간 요약본 theNET를 구독하세요!

Cloudflare가 개인 데이터를 수집하고 처리하는 방법은 Cloudflare의 개인정보 취급방침을 참조하세요.

글 링크 복사

이미지 최적화 프로그램이란?

이미지 최적화 도구는 이미지 파일을 더 작게 만드는 서비스, 제품, 라이브러리입니다. 일반적으로 이미지 최적화 도구는 이미지의 품질을 너무 많이 손상시키지 않으면서도 이미지를 압축하고 크기를 조정하여 이미지의 파일 크기를 줄입니다. 따라서 사용자의 브라우저에 로드하는 데 시간이 덜 걸리므로 웹에 맞게 이미지가 최적화되어 웹 사이트 속도와 성능이 향상됩니다.

이미지 크기를 줄여야 하는 이유는?

웹 페이지에 나타나는 모든 이미지는 표시되기 전에 사용자의 브라우저에서 다운로드해야 합니다. 이미지가 클수록(치수가 아닌 파일 크기 측면에서) 다운로드하는 데 시간이 오래 걸리고 더 많은 대역폭을 차지합니다. 사용자가 모바일 장치를 사용하는 경우 큰 이미지는 다운로드 할 때 많은 데이터가 사용됩니다.

따라서 이미지를 작게 유지하는 것은 웹 사이트 성능에 매우 중요하며, 웹 사이트의 성능은 SEO 및 웹 사이트에서 사용자의 참여와 활동을 유지하는 데 매우 중요합니다. Google에서는 빠르게 로드되는 사이트를 우선시하며, 웹페이지를 로드하는 데 시간이 오래 걸리는 경우 사용자가 이탈할 가능성이 높고 전환할 가능성이 적습니다.

이미지 파일 크기는 어떻게 줄일까요?

이미지 크기를 줄이는 첫 번째 단계는 치수를 줄이는 것입니다. 예를 들어 일반적인 웹 사이트에는 너비가 3,000픽셀 이상인 이미지가 필요하지 않습니다. (실제로 대부분의 데스크톱 디스플레이는 너비가 1,920픽셀 이하입니다.) 이미지의 크기를 조정하면 품질이 저하되지 않고 파일 크기가 줄어듭니다.

이미지를 압축할 수도 있습니다. 이미지 압축기(예: Photoshop의 '웹용으로 저장' 기능)는 JPEG 파일을 훨씬 낮은 해상도 수준으로 축소할 수 있으며, 축소된 이미지도 본질적으로 동일하게 보입니다. 그러나 이미지는 여전히 픽셀화되지 않고 전문적으로 보여야 합니다. 해상도가 너무 낮아져 그에 따른 성능 향상이 가치가 없게 되는 전환점이 있습니다. 테스트는 중요합니다. 이미지는 대형 모니터와 소형 스마트폰 화면 모두에서 전문적으로 보여야 합니다.

이미지 크기를 조정하거나 압축하는 것 외에 이미지를 최적화하는 다른 방법이 있을까요?

이미지에 사용되는 파일 형식은 파일 크기에 영향을 줍니다. 대부분의 웹용 이미지는 PNG이나 GIF가 아닌 JPEG 형식이어야 합니다. JPEG 파일로 품질을 조정(파일 크기에 영향을 미침)하는 것이 가장 쉽기 때문입니다. JPEG 파일은 손실이 있으므로 압축할 때 시각적 정보가 손실됩니다. 그 결과로 압축은 JPEG 파일을 원래 크기의 일부로 축소할 수 있으며, 이는 일반적으로 GIF 및 PNG 파일에서는 불가능합니다(둘 다 무손실).

CDN에서는 어떻게 이미지 속도를 높일까요?

CDN, 즉 콘텐츠 전송 네트워크는 전 세계에 분산된 서버 그룹으로, 이미지를 포함한 콘텐츠를 저장하고 최종 사용자에게 전달합니다.CDN 서버는 속도에 최적화되어 있으며 원본 서버 보다 최종 사용자와 더 가깝게 위치하여 대기 시간을 줄이고 인터넷을 통해 전송되는 이미지, 비디오 등 콘텐츠의 로드 시간을 줄입니다.Cloudflare CDN에 대해 자세히 알아보세요.

이미지 SEO 최적화란?

이미지 검색 엔진 최적화와 이미지 최적화는 별개이지만, 관련이 있습니다. 이미지 파일 크기를 줄이면 로드 시간이 줄어 검색을 위해 이미지를 최적화하는 데 도움이 되며, Google에서는 개발자에게 가능한 경우 이미지를 압축할 것을 권장합니다.

그러나 이미지를 검색에 최적화하려면 개발자는 다음을 수행해야 합니다.

  1. 이미지 파일에 관련성 있고 읽기 쉬운 이름을 지정하고 가능한 경우 관련 키워드를 포함합니다.
  2. 화면 읽기 프로그램을 사용하는 사이트 방문자에게 유용하고 하나 이상의 키워드를 포함하는 간단하고 설명이 포함된 이미지 대체 태그를 포함합니다.
  3. 반응형 및 모바일 친화적인 이미지 만들기
  4. 반응형 및 모바일 친화적인 이미지는 사용자 경험을 개선하고 사용자의 참여를 유지함
  5. 소셜 공유를 위한 오픈 그래프 및 트위터 카드 이미지 포함