스마트 이미징

스마트 이미징이란 무엇입니까?

스마트 이미징 기술은 Adobe Sensei AI 기능을 적용하고 기존 "이미지 사전 설정"과 함께 작동하여 클라이언트 브라우저 기능을 기반으로 이미지 형식, 크기 및 품질을 자동으로 최적화하여 이미지 전달 성능을 향상시킵니다.

스마트 이미징은 또한 Adobe의 동급 최강의 프리미엄 CDN 서비스와 완전히 통합되는 향상된 성능 증대의 이점을 제공합니다. 이 서비스는 서버, 네트워크 및 피어링 지점 간의 최적의 인터넷 경로를 찾습니다. 인터넷에서 기본 경로를 사용하는 대신 지연 시간이 가장 짧고 패킷 손실률이 가장 낮은 경로를 찾습니다.

다음 이미지 자산 예는 추가된 스마트 이미징 최적화를 보여줍니다.

이미지 (URL)	썸네일	크기 (JPEG)	크기(WebP) (스마트 이미징 포함)	% 감소
이미지 1		73.75KB	45.92KB	38%
이미지 2		191KB	70.66KB	63%
이미지 3		96.64KB	39.44KB	59%
이미지 4		315.80KB	178.19KB	44%
				평균 = 51%

위와 유사하게, Adobe은 라이브 고객 사이트에서 7009 URL을 사용하는 테스트도 실행했습니다. JPEG에 대해 평균 38%의 파일 크기 최적화를 수행할 수 있었습니다. WebP 포맷의 PNG의 경우 평균 31% 더 많은 파일 크기 최적화를 수행할 수 있었습니다. 스마트 이미징의 기능 때문에 이러한 유형의 최적화가 가능합니다.

모바일 웹에서는 두 가지 요소로 인해 이러한 문제가 더 복잡해집니다.

• 폼 팩터와 고해상도 디스플레이가 서로 다른 다양한 장치입니다.
• 제한된 네트워크 대역폭입니다.

이미지 측면에서 볼 때, 가장 좋은 품질의 이미지를 가능한 효율적으로 제공하는 것이 목표입니다.

장치 픽셀 비율 최적화 기본 정보

CSS 픽셀 비율이라고도 하는 DPR(장치 픽셀 비율)은 장치의 실제 픽셀과 논리 픽셀 간의 관계입니다. 특히 최신 모바일 기기들의 화소 해상도는 망막 스크린의 출현으로 빠른 속도로 높아지고 있다.

장치 픽셀 비율 최적화를 활성화하면 이미지가 화면의 기본 해상도로 렌더링되어 선명하게 표시됩니다.

스마트 이미징 DPR 구성을 켜면 요청이 제공되는 디스플레이의 픽셀 밀도를 기반으로 요청된 이미지가 자동으로 조정됩니다. 현재 디스플레이의 픽셀 밀도는 Akamai CDN 헤더 값에서 가져옵니다.

이미지 작업 시 및 스마트 자르기 작업 시를 참조하십시오.

네트워크 대역폭 최적화 기본 정보

네트워크 대역폭을 켜면 실제 네트워크 대역폭을 기반으로 제공되는 이미지 품질이 자동으로 조정됩니다. 낮은 네트워크 대역폭의 경우 이미 켜져 있어도 DPR 최적화가 자동으로 꺼집니다.

원하는 경우 회사는 이미지 URL에 network=off을 추가하여 개별 이미지 수준에서 네트워크 대역폭 최적화를 옵트아웃할 수 있습니다.

최신 스마트 이미징의 주요 이점은 무엇입니까?

이미지가 페이지 로드 시간의 대부분을 구성하므로 성능 향상은 높은 전환, 사이트에서 보낸 시간, 낮은 사이트 바운스 비율 등과 같이 비즈니스에 큰 영향을 줄 수 있습니다.

최신 버전의 스마트 이미징 개선 사항:

• 최신 스마트 이미징을 사용하는 웹 페이지의 Google SEO 등급을 개선했습니다.
• 최적화된 컨텐츠를 런타임 시 즉시 제공합니다.
• Adobe Sensei 기술을 사용하여 이미지 요청에 지정된 품질(qlt)에 따라 변환합니다.
• 스마트 이미징은 "bfc" URL 매개 변수를 사용하여 해제할 수 있습니다.
• TTL(Time To Live)과 독립적입니다. 이전에는 스마트 이미징이 작동하려면 최소 TTL이 12시간이었습니다.
• 이전에는 원본 이미지와 파생 이미지가 모두 캐시되었으며 캐시를 무효화하는 2단계 프로세스였습니다. 최신 Smart Imaging에서는 파생자만 캐시되므로 단일 단계 캐시 무효화 프로세스를 허용합니다.
• 규칙 세트에 사용자 지정 헤더를 사용하는 고객은 이전 버전의 Smart Imaging과 달리 이러한 헤더가 차단되지 않으므로 최신 Smart Imaging을 활용할 수 있습니다. 예를 들어, 이미지 응답에 사용자 지정 헤더 값을 추가합니다|Dynamic Media Classic에 설명된 "Timing Allow Origin", "X-Robot"이 있습니다.

스마트 이미징과 관련된 라이센스 비용이 있습니까?

아니오. 스마트 이미징은 Dynamic Media Classic 또는 Adobe Experience Manager - Dynamic Media(온-프레미스, AMS 및 Adobe Experience Manager as a Cloud Service)의 기존 라이센스에 포함되어 있습니다.

스마트 이미징은 어떻게 작동합니까?

소비자가 이미지를 요청하면 스마트 이미징은 사용자 특성을 확인하고 사용 중인 브라우저를 기반으로 적절한 이미지 형식으로 변환합니다. 이러한 형식 변환은 시각적 품질을 저하시키지 않는 방식으로 수행됩니다. 스마트 이미징은 다음과 같은 방식으로 브라우저 기능에 따라 이미지를 다른 형식으로 자동으로 변환합니다.

• 다음 브라우저의 경우 자동으로 WebP로 변환합니다.

  • Chrome
  • Firefox
  • Microsoft® Edge
  • Safari(iOS, macOS, iPadOS에서), WebP를 지원하는 브라우저 및 OS 버전 제공
  • Android™
  • Opera

• 기존 브라우저는 다음을 지원합니다.

  브라우저	브라우저/OS 버전	형식
  Safari	iOS/iPad 14.0 또는 macOS BigSur 이전	JPEG2000
  Edge	18보다 이전	JPEGXR
  Internet Explorer	9+	JPEGXR

• 이러한 형식을 지원하지 않는 브라우저의 경우 원래 요청한 이미지 형식이 제공됩니다.

원본 이미지 크기가 스마트 이미징에서 만드는 이미지 크기보다 작으면 원본 이미지가 제공됩니다.

지원되는 이미지 형식은 무엇입니까?

스마트 이미징에 대해 다음 이미지 형식이 지원됩니다.

• JPEG
• PNG

이미 사용 중인 기존 이미지 사전 설정에서 스마트 이미징은 어떻게 작동합니까?

스마트 이미징은 기존 "이미지 사전 설정"에서 작동하며 요청된 파일 형식이 JPEG 또는 PNG인 경우 품질(qlt) 및 형식(fmt)을 제외한 모든 이미지 설정을 준수합니다. 형식 변환을 위해 스마트 이미징은 이미지 사전 설정 설정에 정의된 대로 전체 시각적 품질을 유지하지만 더 작은 파일 크기로 유지합니다. 원본 이미지 크기가 스마트 이미징에서 만드는 이미지 크기보다 작은 경우 원본 이미지가 제공됩니다.

URL, 이미지 사전 설정을 변경하거나 스마트 이미징을 위해 내 사이트에 새 코드를 배포해야 합니까?

기존 사용자 지정 도메인에서 스마트 이미징을 구성하는 경우 스마트 이미징이 기존 이미지 URL 및 이미지 사전 설정과 원활하게 작동합니다. 또한 스마트 이미징에서는 사용자의 브라우저를 감지하기 위해 웹 사이트에 코드를 추가할 필요가 없습니다. 모두 자동으로 처리됩니다.

스마트 이미징을 사용하도록 새 사용자 지정 도메인을 구성해야 하는 경우 이 사용자 지정 도메인을 반영하도록 URL을 업데이트해야 합니다.

스마트 이미징의 사전 요구 사항을 이해하려면 스마트 이미징을 사용할 수 있습니까? 를 참조하십시오.

스마트 이미징이 HTTPS에서 작동합니까? HTTP/2는 어떻습니까?

스마트 이미징은 HTTP 또는 HTTPS를 통해 전달된 이미지에서 작동합니다. 또한 HTTP/2에서도 작동합니다.

스마트 이미징을 사용할 수 있습니까?

스마트 이미징을 사용하려면 회사의 Dynamic Media Classic 또는 Experience Manager 계정의 Dynamic Media이 다음 요구 사항을 충족해야 합니다.

• Adobe 번들 CDN(Content Delivery Network)을 라이센스의 일부로 사용합니다.
• 일반 도메인(예: s7d1.scene7.com, s7d2.scene7.com 또는 s7d13.scene7.com)이 아닌 전용 도메인(예: images.company.com 또는 mycompany.scene7.com)을 사용하십시오.

도메인을 찾으려면 Dynamic Media Classic 데스크탑 응용 프로그램을 연 다음 회사 계정 또는 계정에 로그인합니다.

설치 > 응용 프로그램 설정 > 일반 설정​게시된 서버 이름​이라는 필드를 찾습니다. 현재 일반 도메인을 사용 중인 경우 기술 지원 티켓을 제출할 때 이 전환의 일부로 고유한 사용자 지정 도메인으로 이동을 요청할 수 있습니다.

첫 번째 사용자 지정 도메인은 Dynamic Media 라이센스를 통해 추가 비용이 들지 않습니다.

내 계정에 대해 스마트 이미징을 활성화하는 프로세스는 무엇입니까?

스마트 이미징 사용 요청을 시작합니다. 자동으로 활성화되지 않습니다.

기본적으로 Dynamic Media 회사 계정에 대해 스마트 이미징 DPR 및 네트워크 최적화가 비활성화(꺼짐)됩니다. 이러한 기본 개선 사항 중 하나 또는 둘 다 활성화(켜기)하려면 아래 설명된 지원 사례를 만드십시오.

1. Admin Console을 사용하여 지원 사례를 만듭니다.

2. 지원 사례에 다음 정보를 제공하십시오.

   1. 기본 연락처 이름, 이메일, 전화

   2. 스마트 이미징에 대해 활성화할 모든 도메인(즉, images.company.com 또는 mycompany.scene7.com)입니다.

      도메인을 찾으려면 Dynamic Media Classic 데스크탑 응용 프로그램을 연 다음 회사 계정 또는 계정에 로그인합니다.

      설정 > 응용 프로그램 설정 > 일반 설정​으로 이동합니다.

      게시된 서버 이름​이라는 레이블이 지정된 필드를 찾습니다.

   3. Adobe을 통해 CDN을 사용하고 있으며 직접 관계로 관리하지 않는지 확인합니다.

   4. images.company.com 또는 mycompany.scene7.com 등의 전용 도메인을 사용하고 있고 s7d1.scene7.com, s7d2.scene7.com, s7d13.scene7.com 등의 일반 도메인이 아닌지 확인합니다.

      도메인을 찾으려면 Dynamic Media Classic 데스크탑 응용 프로그램을 연 다음 회사 계정 또는 계정에 로그인합니다.

      설정 > 응용 프로그램 설정 > 일반 설정​으로 이동합니다.

      게시된 서버 이름​이라는 레이블이 지정된 필드를 찾습니다. 현재 일반 Dynamic Media Classic 도메인을 사용 중인 경우, 이 전환의 일부로 고유한 사용자 지정 도메인으로 이동을 요청할 수 있습니다.

   5. HTTP/2에서 작업하기 위해 스마트 이미징이 필요한지 여부를 나타냅니다.

3. Adobe 고객 지원 팀에서는 요청이 제출된 순서에 따라 스마트 이미징 고객 대기 목록에 추가합니다.

4. Adobe이 요청을 처리할 준비가 되면 지원 담당자가 대상 날짜를 조정하고 설정해야 합니다.

5. 선택 사항 - Adobe이 새 기능을 프로덕션에 푸시하기 전에 스테이징에서 스마트 이미징을 선택적으로 테스트할 수 있습니다.

6. 고객 지원 센터에서 이 작업을 완료하면 알림을 받게 됩니다.

7. 스마트 이미징의 성능 향상을 극대화하려면 Adobe에서 TTL(Time To Live)을 24시간 이상으로 설정하는 것이 좋습니다. TTL은 CDN에 의해 자산이 캐시되는 기간을 정의합니다. 이 설정을 변경하려면 다음을 수행하십시오.

   1. Dynamic Media Classic을 사용하는 경우 설정 > 애플리케이션 설정 > 게시 설정 > 이미지 서버​로 이동합니다. 기본 클라이언트 캐시 시간을 Live 값으로 24 이상으로 설정합니다.
   2. Dynamic Media을 사용하는 경우 다음 지침을 따르십시오. 만료 값을 24시간 이상 설정합니다.

언제 내 계정이 스마트 이미징으로 활성화될 수 있습니까?

요청은 대기 목록에 따라 고객 지원에서 수신하는 순서로 처리됩니다.

스마트 이미징을 사용하도록 전환하면 어떤 위험이 있습니까?

고객 웹 페이지에는 위험이 없습니다. 하지만 스마트 이미징으로 전환하면 Experience Manager 시 Dynamic Media Classic 또는 Dynamic Media의 새 구성으로 이동해야 하므로 CDN에서 캐시를 지웁니다.

초기 전환 중에 캐싱되지 않은 이미지는 캐시가 다시 빌드될 때까지 Adobe의 원본 서버에 직접 연결됩니다. 따라서 Adobe은 한 번에 몇 개의 고객 전환을 처리하여 오리진에서 요청을 가져올 때 허용 가능한 성능이 유지되도록 할 계획입니다. 대부분의 고객의 경우 캐시가 1~2일 내에 CDN에서 다시 완전히 빌드됩니다.

스마트 이미징이 예상대로 작동하는지 확인하려면 어떻게 해야 합니까?

1. 계정이 스마트 이미징으로 구성된 후 브라우저에서 Dynamic Media Classic 또는 Adobe Experience Manager - Dynamic Media 이미지 URL을 로드합니다.

2. 브라우저에서 보기 > 개발자 > 개발자 도구​로 이동하여 Chrome 개발자 창을 엽니다. 또는 원하는 브라우저 개발자 도구를 선택합니다.

3. 개발자 도구가 열려 있을 때 캐시가 비활성화되어 있는지 확인합니다.

   • Windows®에서 개발자 도구 창의 설정으로 이동한 다음 캐시 비활성화(devtools가 열려 있는 동안) 확인란을 선택합니다.
   • macOS의 개발자 창의 네트워크 탭에서 캐시 비활성화​를 선택합니다.

4. 컨텐츠 유형이 적절한 형식으로 변형됩니다. 다음 스크린샷은 Chrome에서 WebP로 동적으로 변환되는 PNG 이미지를 보여줍니다.

5. 다른 브라우저 및 사용자 조건에서 이 테스트를 반복합니다.

요청에 대해 스마트 이미징을 끌 수 있습니까?

예. URL에 수정자 bfc=off을 추가하여 스마트 이미징을 끌 수 있습니다.

회사 수준에서 DPR 및 네트워크 최적화를 끄도록 요청할 수 있습니까?

예. 회사에서 DPR 및 네트워크 최적화를 비활성화하려면 이 주제의 앞부분에서 설명한 대로 지원 사례를 만드십시오.

"조정"은 무엇입니까? 정의할 수 있는 설정이나 동작이 있습니까? (#tuning-settings)

현재 선택적으로 스마트 이미징을 활성화하거나 비활성화할 수 있습니다. 다른 튜닝은 사용할 수 없습니다.

스마트 이미징이 품질 설정을 관리하는 경우 설정할 최소 및 최대 수가 있습니까? 예를 들어 "60보다 크지 않음" 및 "80보다 크지 않음"을 설정할 수 있습니까? (#minimum-maximum)

현재 Smart Imaging에는 이러한 프로비저닝 기능이 없습니다.

경우에 따라 JPEG 이미지가 WebP 이미지 대신 Chrome으로 반환됩니다. 왜 이런 변화가 일어납니까? (#jpeg-webp)

스마트 이미징은 전환이 유용한지 여부를 결정합니다. 비교 가능한 품질과 함께 파일 크기가 더 작은 경우에만 새 이미지를 반환합니다.

스마트 이미징 DPR 최적화는 Adobe Experience Manager Sites 구성 요소 및 Dynamic Media 뷰어와 어떻게 작동합니까?

• Experience Manager 사이트 핵심 구성 요소는 기본적으로 DPR 최적화를 위해 구성됩니다. 서버측 스마트 이미징 DPR 최적화로 인해 큰 이미지가 발생하지 않도록 하기 위해 항상 dpr=off이 Sites 핵심 구성 요소 Dynamic Media 이미지에 추가됩니다.
• 서버측 스마트 이미징 DPR 최적화로 인해 큰 이미지가 발생하지 않도록 DPR 최적화에 대해 Dynamic Media 기초 구성 요소가 기본적으로 구성되어 있으므로 dpr=off이 항상 Dynamic Media Foundation 구성 요소 이미지에 추가됩니다. 고객이 DM 기초 구성 요소에서 DPR 최적화를 선택 취소하더라도 서버측 스마트 이미징 DPR이 시작되지 않습니다. 요약하면 DM 기초 구성 요소에서 DPR 최적화는 DM 기초 구성 요소 수준 설정에만 적용됩니다.
• 모든 뷰어 측 DPR 최적화는 서버 측 스마트 이미징 DPR 최적화와 함께 작동하며 과도한 크기의 이미지를 생성하지 않습니다. 즉, 확대/축소 지원 뷰어의 기본 보기처럼 DPR이 뷰어에 의해 처리되는 모든 위치에서 서버 측 스마트 이미징 DPR 값이 트리거되지 않습니다. 마찬가지로 색상 견본 및 축소판과 같은 뷰어 요소에 DPR 처리가 없으면 서버측 스마트 이미징 DPR 값이 트리거됩니다.

이미지 작업 시 및 스마트 자르기 작업 시를 참조하십시오.