Show Menu
화제×

이미지 품질 최적화 우수 사례

허용되는 결과를 렌더링하는 데 많은 요소가 기여하므로 이미지 품질 최적화는 시간이 많이 걸릴 수 있습니다. 개개인이 이미지 품질을 다르게 인지하기 때문에 그 결과는 부분적으로 주관적이다. 구조화된 실험이 핵심입니다.
AEM에는 이미지 조정 및 최적화 및 이미지 렌더링 결과를 위한 100개 이상의 Dynamic Media 이미지 제공 명령이 포함되어 있습니다. 다음 가이드라인은 몇 가지 필수 명령과 최상의 방법을 사용하여 프로세스를 간소화하고 좋은 결과를 신속하게 얻을 수 있도록 도와줍니다.

이미지 형식( &fmt= ) 우수 사례

  • JPG 또는 PNG는 이미지 품질을 향상시키고 관리하기 쉬운 크기와 무게로 제공할 수 있는 최상의 방법입니다.
  • URL에 형식 명령이 제공되지 않으면 Dynamic Media 이미지 배달은 기본적으로 JPG로 제공됩니다.
  • JPG는 10:1의 비율로 압축되며 일반적으로 이미지 파일 크기가 더 작아집니다. 이미지에 흰색 배경이 포함된 경우 등 일부 경우를 제외하고 PNG는 약 2:1의 비율로 압축됩니다. 일반적으로 PNG 파일 크기가 JPG 파일보다 큽니다.
  • JPG는 손실 압축을 사용합니다. 즉, 압축하는 동안 그림 요소(픽셀)가 삭제됩니다. 반면 PNG는 손실 없는 압축을 사용합니다.
  • JPG는 가장자리와 대비가 선명한 합성 이미지보다 해상도가 높은 사진 이미지를 압축합니다.
  • 이미지에 투명도가 포함된 경우 JPG는 투명도를 지원하지 않으므로 PNG를 사용하십시오.
이미지 포맷에 가장 일반적인 설정으로 시작하는 것이 좋습니다 &fmt=JPG .

이미지 크기에 대한 모범 사례

이미지 크기를 동적으로 줄이는 것은 가장 일반적인 작업 중 하나입니다. 여기에는 크기 지정 및 선택적으로 이미지 크기 조정에 사용되는 다운샘플링 모드가 포함됩니다.
  • 이미지 크기 조정을 위해 가장 간단하고 최상의 방법은 사용 &wid=<value> &hei=<value>, 또는 &hei=<value> 입니다. 이러한 매개 변수는 종횡비에 따라 이미지 너비를 자동으로 설정합니다.
  • &resMode=<value> 다운샘플링에 사용되는 알고리즘을 제어합니다. 시작하기 &resMode=sharp2 . 이 값은 최상의 이미지 품질을 제공합니다. 다운샘플링 사용 value =bilin 이 더 빨라지면 아티팩트의 앨리어스가 발생하는 경우가 많습니다.
이미지 크기 조정, 사용 &wid=<value>&hei=<value>&resMode=sharp2 또는 &hei=<value>&resMode=sharp2

이미지 선명하게 하기 우수 사례

이미지 선명하게 하기는 웹 사이트에서 이미지를 제어하는 데 가장 복잡한 측면이며 오류가 많이 발생하는 영역입니다. 다음 유용한 리소스를 참조하여 AEM에서 선명하게 하기 및 언샵 마스크가 작동하는 방식에 대해 자세히 알아보십시오.
Adobe Scene7 Publishing System 및 Image Server 의 우수 사례 백서 Sharpening images도 AEM에 적용됩니다.
AEM을 사용하면 인제스트, 전달 시 또는 둘 다에 따라 이미지를 선명하게 할 수 있습니다. 그러나 대부분의 경우 한 가지 방법 또는 다른 방법을 사용하여 이미지를 선명하게 해야 하지만 둘 다 선명하게 해야 합니다. 배달 시 URL에서 이미지를 선명하게 하면 최상의 결과를 얻을 수 있습니다.
두 가지 이미지 선명하게 하기 방법을 사용할 수 있습니다.
  • 간단한 선명하게 하기( &op_sharpen ) - Photoshop에서 사용되는 선명 효과 필터와 유사하게, 간단한 선명 효과는 동적 크기 조정 후 이미지의 최종 보기에 기본 선명 효과를 적용합니다. 하지만 이 방법은 사용자가 구성할 수 없습니다. 가장 좋은 방법은 &op_sharpen을 사용하지 않는 것입니다.
  • 언샵 마스킹( &op_USM ) - 언샵 마스크는 업계 표준의 선명하게 하기 필터입니다. 가장 좋은 방법은 아래 지침에 따라 언샵 마스킹으로 이미지를 선명하게 하는 것입니다. 언샵 마스킹을 사용하면 다음 세 가지 매개 변수를 제어할 수 있습니다.
    • &op_sharpen= amount,radius,임계값
      • 금액 (0-5, 효과의 강도)
      • radius (0-250, sharpening object 주위에 그려진 "sharpening lines"의 너비(픽셀 단위)
        매개 변수 반지름과 양이 서로 연동된다는 점을 명심하십시오. 반경을 줄이는 것은 양을 증가시켜 보상할 수 있습니다. Radius를 사용하면 값이 낮으면 가장자리 픽셀만 선명하게 되는 반면 값이 높으면 더 넓은 범위의 픽셀이 선명하게 됩니다.
      • 임계값 (0-255, 효과의 민감도)
        이 매개 변수는 Edge Pixels로 간주되고 필터가 선명하게 하기 전에 선명하게 된 픽셀이 주변 영역과 얼마나 달라야 하는지를 결정합니다. 임계값 매개 변수를 사용하면 피부 톤과 같이 유사한 색상의 과도하게 선명하게 하는 영역을 방지할 수 있습니다. 예를 들어 임계값 12는 "노이즈"를 추가하지 않도록 피부 톤 밝기에 약간의 변형을 무시하고 속눈썹이 피부와 만나는 경우와 같이 대비가 높은 영역에 가장자리 대비를 추가합니다. 필터와 함께 사용할 모범 사례를 비롯하여 이러한 세 매개 변수를 설정하는 방법에 대한 자세한 내용은 다음 리소스를 참조하십시오.
      이미지 선명하게 하기 관련 AEM 도움말 항목입니다.
    • AEM에서는 네 번째 매개 변수를 제어할 수도 있습니다. 단색(0,1) 이 매개 변수는 값 0을 사용하여 각 색상 구성 요소에 개별적으로 또는 값 1을 사용하여 이미지 명도/강도에 언샵 마스킹을 적용할지 여부를 결정합니다.
언샵 마스크 반경 매개 변수를 사용하는 것이 좋습니다. 시작할 수 있는 반경 설정은 다음과 같습니다.
  • 웹 사이트 : 0.2-0.3픽셀
  • 사진 인쇄(250-300ppi) : 0.3-0.5픽셀
  • 오프셋 인쇄(266-300ppi) : 0.7-1.0픽셀
  • 캔버스 인쇄(150ppi) : 1.5-2.0픽셀
1.75에서 4로 서서히 늘리세요. 선명하게 하기 기능이 여전히 원하는 방식이 아닌 경우 반경을 소수점으로 늘리고 양을 1.75에서 4로 다시 실행하십시오. 필요에 따라 반복합니다.
단색 매개 변수 설정을 0으로 둡니다.

JPEF 압축에 대한 우수 사례( &qlt= )

  • 이 매개 변수는 JPG 인코딩 품질을 제어합니다. 값이 높을수록 이미지 품질은 높지만 파일 크기는 커집니다. 또는 값이 낮으면 품질이 낮지만 파일 크기가 작다는 의미입니다. 이 매개 변수의 범위는 0-100입니다.
  • 품질에 맞게 최적화하려면 매개 변수 값을 100으로 설정하지 마십시오. 90 또는 95와 100 설정의 차이는 거의 감지할 수 없지만 100은 이미지 파일의 크기를 불필요하게 증가시킵니다. 따라서 품질을 위해 최적화하지만 이미지 파일이 너무 커지지 않도록 하려면 90 또는 95 qlt= value 로 설정합니다.
  • 작은 이미지 파일 크기에 맞게 최적화하지만 이미지 품질을 허용 가능한 수준으로 유지하려면 를 80 qlt= value 으로 설정합니다. 70-75 미만의 값은 상당한 이미지 품질 저하를 초래합니다.
  • 가운데 있으려면 85를 qlt= value 가운데로 놓아라.
  • 크로마 플래그 사용 qlt=
    • 매개 변수 qlt= 에는 값을 사용하여 RGB 색도 다운샘플링을 활성화하거나 값을 사용하여 ,1 해제할 수 있는 두 번째 설정이 있습니다 ,0 .
    • 간단하게 유지하려면 RGB 색도성 다운샘플링이 꺼진( ,0 )으로 시작하십시오. 이 설정을 사용하면 일반적으로 이미지 품질이 향상되며, 특히 가장자리와 대비가 선명한 합성 이미지의 경우 더욱 좋습니다.
JPG 압축 사용에 대한 우수 사례입니다 &qlt=85,0 .

JPEG 크기 조정 우수 사례( &jpegSize= )

jpegSize는 메모리가 제한된 장치에 이미지를 전달할 때 특정 크기를 초과하지 않도록 보장하기 위한 유용한 매개 변수입니다.
  • 이 매개 변수는 킬로바이트( jpegSize=&lt;size_in_kilobytes&gt; )로 설정됩니다. 이미지 배달에 대해 허용되는 최대 크기를 정의합니다.
  • &jpegSize= JPG 압축 매개 변수와 상호 작용합니다 &qlt= . 지정된 JPG 압축 매개 변수( &qlt= )가 있는 JPG 응답이 jpegSize 값을 초과하지 않으면 정의된 대로 이미지가 &qlt= 반환됩니다. 그렇지 않은 경우 이미지 &qlt= 가 허용되는 최대 크기에 맞추거나, 시스템이 이미지가 맞지 않는다고 판단하고 오류를 반환할 때까지 점진적으로 감소합니다.
JPG 이미지 &jpegSize= 를 메모리가 제한된 장치에 제공하는 &qlt= 경우 매개 변수를 설정하고 추가하는 것이 좋습니다.

모범 사례 요약

이미지 품질과 파일 크기가 작은 이미지를 만들려면 다음 매개 변수를 조합하여 시작하십시오.
fmt=jpg&qlt=85,0&resMode=sharp2&op_usm=1.75,0.3,2,0
이러한 설정 제품을 조합하면 대부분의 환경에서 탁월한 결과를 얻을 수 있습니다.
이미지를 보다 정밀하게 최적화해야 하는 경우 반지름을 0.2 또는 0.3으로 설정하여 선명하게 하기(언샵 마스킹) 매개 변수를 점진적으로 미세 조정한 다음 양을 1.75에서 최대 4개(Photoshop의 경우 400%에 해당)로 점진적으로 증가시킵니다. 원하는 결과가 달성되었는지 확인합니다.
선명하게 하기 결과가 여전히 만족스럽지 않으면 십진수 증분으로 반경을 늘리십시오. 소수점 이하 자릿수의 경우 1.75로 다시 시작하고 서서히 4로 늘리십시오. 원하는 결과를 얻을 때까지 이 과정을 반복합니다. 위의 값은 크리에이티브 스튜디오가 인증한 방법이지만 다른 값부터 시작하고 다른 전략을 따를 수 있습니다. 결과가 만족스러운지 아닌지는 주관적인 문제이므로 구조화된 실험이 핵심입니다.
또한 다음과 같은 일반적인 제안을 통해 워크플로우를 최적화할 수 있습니다.
  • 조정 작업을 위해 실시간 미리 보기를 제공하는 Scene7 Publishing System의 이미지 조정 기능을 사용하거나 URL에서 직접 다양한 매개 변수를 실시간으로 테스트해 보십시오.
  • Dynamic Media 이미지 제공 명령을 이미지 사전 설정으로 그룹화할 수 있는 것이 좋습니다. 이미지 사전 설정은 기본적으로 및 같은 사용자 정의 사전 설정 이름을 가진 URL 명령 매크로 $thumb_low$ 입니다 &product_high$ . URL 경로의 사용자 정의 사전 설정 이름은 이러한 사전 설정을 호출합니다. 이러한 기능은 웹 사이트에서 여러 이미지 사용 패턴에 대한 명령 및 품질 설정을 관리하고 URL의 전체 길이를 줄이는 데 도움이 됩니다.
  • 또한 AEM에서는 인제시에 선명하게 하기 이미지를 적용하는 등 이미지 품질을 조정하는 고급 방법을 제공합니다. 렌더링 결과를 더욱 세밀하게 조정하고 최적화하는 옵션일 수 있는 고급 사용 사례를 위해 Adobe 전문 서비스는 사용자 정의된 통찰력과 모범 사례를 활용할 수 있도록 지원합니다.