images.tooling.report를 사용하여 사이트 사진을 완벽하게 만들기

이미지 도구의 상태를 확인합니다.

Patrick Kettner
Patrick Kettner

웹에 이미지를 게시하는 것은 쉽지만, 잘 게시하는 것은 어렵습니다. 올바른 형식, 압축, 인치당 도트 수 (DPI) 및 수백 개의 다른 설정을 직접 선택하면 쉽게 잊어버릴 수 있습니다.

다행히 요즘에는 이러한 작업을 모두 대신해 주는 도구와 서비스가 많이 있습니다. 안 좋은 소식은 이러한 사이트가 많다는 것입니다. 나에게 적합한 도구나 서비스를 선택하기란 쉽지 않을 수 있습니다. 이에 따라 프로덕션에서 이미지를 배포할 때 가장 중요하다고 생각되는 사항을 나열하고 유료 또는 무료, 호스팅 또는 셀프 호스팅 등 가장 인기 있는 소프트웨어와 서비스를 비교할 수 있는 사이트인 images.tooling.report를 출시합니다.

그 이유는 무엇인가요?

이미지는 전송되는 사이트의 바이트 중 상당 부분을 차지하며, 이러한 바이트는 누적됩니다. 실제로 최적화되지 않은 이미지가 페이지 총 크기의 거의 75%를 차지하는 것으로 나타났습니다. 낭비되는 모든 바이트에는 비용이 발생합니다. 실제 사용자 세션 수백만 개를 대상으로 한 연구에 따르면 전환된 페이지의 이미지 수가 전환되지 않은 페이지의 이미지 수보다 38% 적었습니다. 그렇다면 모든 이미지를 삭제해야 하나요? 물론 아닐 것입니다. 하지만 전송하는 이미지가 사용자가 사용하는 기기와 관계없이 모든 사용자에게 최적화되어 있는지 확인해야 합니다.

기본 설명

최적화된 이미지를 게재하는 것은 '웹용으로 저장'을 클릭하는 것 이상입니다. 그렇기 때문에 images.tooling.report는 다양한 기능을 확인합니다. 다양한 도구와 서비스가 제공하는 압축 정도와 같은 기본사항과 장기 캐시 헤더와 같은 네트워크 최적화를 다룹니다.

하지만 여기서 멈추지 않습니다. Google은 Save-Data, ECT, 기타 클라이언트 힌트 지원과 같은 고급 옵션을 검색하여 데이터 모델을 사용하여 이미지를 반복적으로 압축할 수 있는 자동화된 심리 시각적 분석을 찾고, 눈이 인식하는 방식을 변경하지 않고도 가장 적은 바이트가 소요되는 버전을 찾았습니다. 전송하기 전에 이미지에서 시각적이지 않은 모든 비트를 쥐어 짜고 있나요?

어두운 모드에서 images.tooling.report의 방문 페이지 스크린샷

물론 모든 사이트는 고유합니다. 원하는 모든 기능을 제공하는 도구나 서비스는 없었습니다. 이는 정상적인 동작입니다. 테스트한 내용을 여러 카테고리로 분류했습니다. 콘텐츠 전송 네트워크 (CDN), 셀프 호스팅 프로젝트, 콘텐츠 관리 시스템 (CMS) 플러그인, 사이트 빌더를 다룹니다. 다음은 다양한 옵션을 더 관련성 있게 비교하기 위해 마련된 상당히 느슨한 정의입니다.

  • CMS 플러그인은 WordPress와 같은 플랫폼에서 개발할 때 간편하게 사용할 수 있는 패키지입니다.
  • 사이트 빌더는 웹사이트를 만드는 데 사용할 수 있는 여러 서비스를 비교합니다.
  • 자체 호스팅은 git 프로젝트를 클론하거나 프로덕션에서 자체 Docker 이미지를 실행하는 데 익숙한 개발자를 위한 것입니다.
  • CDN은 조금 더 복잡합니다. 이러한 서비스 중 일부는 기존 의미의 CDN이지만, 엣지에서 이미지를 프록시하거나 호스팅하는 서비스도 있습니다.

모든 사용자를 만족시킬 수는 없지만 평가 중인 테스트와 기능을 확인하고 이미지 최적화 도구가 어떤지 살펴보세요. 아직 이미지 최적화를 위해 어떤 조치도 취하지 않고 있다면 어떻게 해야 하나요? 그렇다면 이미지 도구를 살펴보고 이미 사이트를 사용 중인 사용자에게 어떤 이점을 제공할 수 있는지 알아보세요.

다음 단계

누락된 이미지 도구나 서비스가 있다고 생각하시나요? Google에 알려주세요. 도구와 서비스, 테스트 자체 모두 실시간으로 업데이트됩니다. 이미지 전송의 최신 상태를 빠르게 확인할 수 있는 곳이 필요하면 먼저 images.tooling.report를 확인하세요.

Unsplash의 마이클 마센님이 제공한 히어로 이미지