80. 이미지 최적화

Mission: 이미지 최적화 관련 질문 정리

📌

이미지 최적화에 대해 설명해주시고 방법에 대해 설명해주세요.

• 이미지 최적화:
  • 개념: 이미지 최적화는 웹 페이지에서 사용되는 이미지의 용량을 최소화하고 화질을 유지하는 과정입니다. 이를 통해 웹 페이지의 로딩 속도를 개선하고 대역폭을 절약할 수 있습니다.
    
    
• 이미지 최적화 방법:
  1. 압축 (Compression):
  - 이미지 파일의 용량을 줄이는 과정으로, 손실 압축과 비손실 압축 두 가지 방법이 있습니다.
  - 손실 압축은 화질을 약간 손상시키지만 파일 크기를 크게 줄일 수 있으며, JPEG 이미지에 사용됩니다.
  - 비손실 압축은 화질 손상 없이 파일 크기를 줄입니다. PNG 및 GIF 이미지에 사용됩니다.
  2. 크기 조절 (Resizing):
  - 이미지의 실제 크기를 웹 페이지에 표시되는 크기에 맞게 조절합니다.
  - 큰 이미지를 작게 표시하면 파일 크기와 로딩 시간을 줄일 수 있습니다.
  3. 이미지 포맷 선택:
  - 적절한 이미지 포맷을 선택합니다. JPEG는 사진 및 복잡한 이미지에 적합하고, PNG는 투명 배경이나 비손실 이미지에 적합하며, GIF는 간단한 애니메이션에 사용됩니다.
  4. 이미지 스프라이트 (Image Sprites):
  - 여러 개의 작은 이미지를 하나의 이미지로 결합하여 서버 요청 수를 줄이고 로딩 속도를 높입니다.
  5. 레이지 로딩 (Lazy Loading):
  - 뷰포트에 보이지 않는 이미지를 로딩하지 않고, 사용자가 스크롤할 때 필요한 이미지만 로딩합니다.
  6. 웹P 포맷 사용:
  - 웹P는 JPEG 및 PNG에 비해 더 나은 압축률을 제공하며 웹P 지원 브라우저에서 사용하면 이미지 최적화에 도움이 됩니다.
  7. 이미지 CDN 사용:
  - 이미지 CDN(Content Delivery Network)을 활용하여 이미지를 전 세계에 분산 저장하고 로딩 속도를 향상시킬 수 있습니다.
  
  이미지 최적화는 웹 성능을 향상시키고 사용자 경험을 개선하는 데 중요한 요소입니다. 올바른 이미지 최적화 기법을 사용하면 웹 페이지의 로딩 속도를 향상시키고 대역폭을 절약할 수 있습니다.