Imagem inteligente

O que é "Smart Imaging"?

A tecnologia Smart Imaging aplica os recursos do Adobe Sensei AI e funciona com "predefinições de imagens" existentes. Funciona para aprimorar o desempenho da entrega de imagens, otimizando automaticamente o formato, o tamanho e a qualidade da imagem com base nos recursos do navegador do cliente.

E agora, obtenha uma melhor pontuação Google Core Web Vital para LCP (Grande Pintor Contentível) com Smart Imaging aprimorado que agora vem com suporte para AVIF e WebP.

IMPORTANTE

A Smart Imaging requer o uso da CDN (Content Delivery Network) pronta para uso que é fornecida com o Adobe Experience Manager - Dynamic Media. Nenhum outro CDN personalizado é compatível com esse recurso.

O Smart Imaging se beneficia do aumento de desempenho adicional de ser totalmente integrado ao melhor serviço premium CDN (Content Delivery Network) do Adobe. Esse serviço encontra a rota ideal da Internet entre servidores, redes e pontos de peering. Ele encontra uma rota que tem a latência mais baixa e a menor taxa de perda de pacotes em vez de usar a rota padrão na Internet.

Os seguintes exemplos de ativos de imagem representam a otimização adicionada da imagem inteligente:

Imagem (URL) Miniatura Tamanho (JPEG) Tamanho (WebP) com Smart Imaging Tamanho (AVIF) com Smart Imaging % de redução com WebP % de redução com AVIF
Imagem 1 picture1 145 KB 106 KB 90.2 KB 26,89% 37,79%
Imagem 2 picture2 412 KB 346 KB 113 KB 16,01% 72,57%
Imagem 3 picture3 221 KB 189 KB 87.1 KB 14,47% 60,58%
Imagem 4 picture4 594 KB 545 KB 286 KB 8,25% 51,85%

Semelhante ao acima, o Adobe também executou um teste com um conjunto de amostras maior. O formato AVIF proporcionou uma redução extra de tamanho de 20% em relação ao WebP, o que proporcionou uma redução de 27% em relação ao JPEG. Tudo com a mesma qualidade visual. No total, a AVIF fornece até 41% de redução média do tamanho em relação ao JPEG.

Compare WebP e AVIF com PNG, você pode observar uma redução de 84% no tamanho com WebP e 87% com AVIF. E, como os formatos WebP e AVIF são compatíveis com transparência e várias animações de imagem, é uma boa substituição para arquivos PNG e GIF transparentes.

Consulte também Otimização de imagem com formatos de imagem de próxima geração (WebP e AVIF)

Quais são os principais benefícios do último Smart Imaging?

O Smart Imaging fornece um desempenho de entrega de imagem melhor, otimizando automaticamente o tamanho do arquivo de imagem com base no navegador do cliente em uso, a exibição do dispositivo e as condições da rede. Como as imagens constituem a maior parte do tempo de carregamento de uma página, qualquer melhoria de desempenho pode ter um impacto profundo nos KPIs de negócios, como taxas de conversão mais altas, tempo gasto em um site e taxas de rejeição do site mais baixas.

Os principais benefícios mais recentes do Smart Imaging incluem:

  • Agora oferece suporte ao formato AVIF da próxima geração.
  • O PNG para WebP e AVIF agora oferecem suporte para conversão com perdas. Como o PNG é um formato sem perdas, a WebP e a AVIF anteriores eram entregues sem perdas.
  • Conversão do formato do navegador (bfc)
  • Proporção de pixels do dispositivo (dpr)
  • Largura de banda de rede (network)

Sobre a conversão de formato do navegador (bfc)

Ativar a conversão de formato do navegador ao anexar bfc=on para o URL da imagem, converte automaticamente o JPEG e o PNG em AVIF com perdas, WebP com perdas, JPEGXR com perdas, JPEG2000 com perdas para navegadores diferentes. Para navegadores que não aceitam esses formatos, a Imagem inteligente continua a servir o JPEG ou PNG. Junto com o formato , a qualidade do novo formato é recalculada pelo Smart Imaging.

A imagem inteligente também pode ser desativada ao anexar bfc=off ao URL da imagem.

Consulte também bfc na API de disponibilização e renderização de imagens do Dynamic Media.

Sobre a otimização da taxa de pixels do dispositivo (dpr)

Proporção de pixels do dispositivo (DPR) - também conhecida como proporção de pixels CSS - é a relação entre os pixels físicos e os pixels lógicos de um dispositivo. Especialmente com o advento das telas de retina, a resolução de pixels dos dispositivos móveis modernos está crescendo a um ritmo rápido.

Ativar a otimização da taxa de pixels do dispositivo renderiza a imagem na resolução nativa da tela, o que a faz parecer nítida.

Atualmente, a densidade de pixels da exibição vem dos valores do cabeçalho Akamai CDN.

Valores permitidos no URL de uma imagem Descrição
dpr=off Desative a otimização do DPR em um nível de URL de imagem individual.
dpr=on,dprValue Substitua o valor do DPR detectado pelo Smart Imaging, com um valor personalizado (como detectado por qualquer lógica do lado do cliente ou outros meios). Valor permitido para dprValue é qualquer número maior que 0.
OBSERVAÇÃO
  • Você pode usar dpr=on,dprValue mesmo que a configuração do DPR no nível da empresa esteja desativada.
  • Devido à otimização do DPR, quando a imagem resultante é maior que a configuração MaxPix Dynamic Media , a largura MaxPix é sempre reconhecida pela manutenção da proporção da imagem. —>
Tamanho da imagem solicitada Valor da Proporção de pixels do dispositivo (dpr) Tamanho da imagem entregue
816 x 500 1 816 x 500
816 x 500 2 1632 x 1000

Consulte também Ao trabalhar com imagens e Ao trabalhar com o Recorte inteligente.

Sobre a otimização da largura de banda da rede

Ativar a Largura de Banda da Rede ajusta automaticamente a qualidade da imagem veiculada com base na largura de banda real da rede. Para uma largura de banda de rede ruim, a otimização do DPR (Device Pixel Ratio) é automaticamente desativada, mesmo que já esteja ativada.

Se desejar, sua empresa pode recusar a otimização da largura de banda da rede no nível de imagem individual ao anexar network=off ao URL da imagem.

Valor permitido no URL de uma imagem Descrição
network=off Desativa a otimização de rede em um nível de URL de imagem individual.

O DPR e os valores de largura de banda da rede são baseados nos valores detectados do lado do cliente do CDN empacotado. Esses valores às vezes são imprecisos. Por exemplo, iPhone5 com DPR=2 e iPhone12 com dpr=3, ambos exibem dpr=2. Ainda, para dispositivos de alta resolução, envio dpr=2 é melhor do que enviar dpr=1. A melhor maneira de superar essa imprecisão, no entanto, é usar o DPR do lado do cliente para fornecer valores 100% precisos. E funciona para qualquer dispositivo, seja Apple ou qualquer outro dispositivo que foi iniciado. Consulte Usar imagem inteligente com relação de pixels de dispositivo do lado do cliente.

Principais benefícios do Smart Imaging

  • Melhoria na classificação de SEO do Google para páginas da Web que usam o Smart Imaging mais recente.
  • Atua conteúdo otimizado imediatamente (no tempo de execução).
  • Usa a tecnologia Adobe Sensei para conversão de acordo com a qualidade (qlt) especificado na solicitação de imagem.
  • TTL (Tempo de vida útil) independente. Anteriormente, um TTL mínimo de 12 horas era obrigatório para que a Smart Imaging funcionasse.
  • Anteriormente, as imagens original e derivada eram armazenadas em cache e era um processo de duas etapas para invalidar o cache. No último Smart Imaging, somente os derivados são armazenados em cache, permitindo um processo de invalidação de cache de uma única etapa.
  • Os clientes que usam cabeçalhos personalizados em seus conjuntos de regras se beneficiam do Smart Imaging mais recente, pois esses cabeçalhos não estão bloqueados, ao contrário da versão anterior do Smart Imaging. Por exemplo, "Timing Allow Origin", "X-Robot", conforme sugerido em Adicionar um valor de cabeçalho personalizado às respostas da imagem|Dynamic Media Classic.

Há algum custo de licenciamento associado ao Smart Imaging?

Não. A Smart Imaging está incluída em sua licença existente. Essa regra é verdadeira para o Dynamic Media Classic ou o Experience Manager - Dynamic Media (No local, AMS e Experience Manager as a Cloud Service).

OBSERVAÇÃO

O Smart Imaging não está disponível para Dynamic Media - Clientes híbridos.

Como funciona a Smart Imaging?

Quando uma imagem é solicitada por um consumidor, o Smart Imaging verifica as características do usuário e a converte para o formato de imagem apropriado, com base no navegador em uso. Essas conversões de formato são feitas de maneira que não degrade a fidelidade visual. A geração de imagens inteligentes converte automaticamente imagens em diferentes formatos com base na capacidade do navegador da seguinte maneira.

  • Converter automaticamente para AVIF se o navegador suportar o formato
  • Converter automaticamente para WebP se a conversão de AVIF não tiver sido benéfica ou o navegador não oferecer suporte a AVIF
  • Converter automaticamente para JPEG2000 se o Safari não suportar WebP
  • Converta automaticamente em JPEGXR para IE 9+ ou se o Edge não for compatível com WebP
    | Formato de imagem | Navegadores compatíveis | |—|—| | AVIF | https://caniuse.com/avif | | WebP | https://caniuse.com/webp | | JPEG 2000 | https://caniuse.com/jpeg2000 | | JPEGXR | https://caniuse.com/jpegxr |
  • Para navegadores que não aceitam esses formatos, o formato de imagem solicitado originalmente é exibido.

Se o tamanho da imagem original for menor do que o produzido pela Imagem inteligente, a imagem original será veiculada.

Quais formatos de imagem são compatíveis?

Os formatos de imagem a seguir são compatíveis com a Smart Imaging:

  • JPEG
  • PNG

Para o formato de arquivo de imagem JPEG, a qualidade do novo formato é recalculada pelo Smart Imaging.

Para formatos de arquivo de imagem que oferecem suporte à transparência como PNG, você pode configurar o Smart Imaging para fornecer AVIF e WebP com perdas. Para a conversão de formato com perdas, o Smart Imaging usa a qualidade mencionada no URL da imagem ou a qualidade configurada na conta da empresa do Dynamic Media.

Como o Smart Imaging funciona com minhas predefinições de imagem existentes que já estão em uso?

O Smart Imaging funciona com suas predefinições de imagem existentes e observa todas as suas configurações de imagem. O que muda é o formato da imagem, ou a configuração de qualidade, ou ambos. Para conversão de formato, o Smart Imaging mantém a fidelidade visual completa conforme definido pelas configurações predefinidas da imagem, mas em um tamanho de arquivo menor.

Por exemplo, suponha que uma predefinição de imagem seja definida com formato JPEG, tamanho 500 x 500, qualidade=85 e máscara de nitidez=0,1,1,5. Quando a Smart Imaging detecta que um usuário está em um navegador Chrome, a imagem é convertida para o formato WebP, com tamanho 500 x 500, e a nitidez da máscara=0,1,1,5 em uma qualidade WebP que corresponde a uma qualidade de JPEG de 85 o mais próximo possível. O impacto dessa conversão da WebP é comparado ao JPEG, e o menor dos dois é retornado.

Preciso alterar quaisquer URLs, predefinições de imagens ou implantar qualquer novo código no meu site para Smart Imaging?

Não. O Smart Imaging funciona perfeitamente com seus URLs de imagem e predefinições de imagem existentes. Além disso, o Smart Imaging não requer que você adicione código ao seu site para detectar o navegador de um usuário. Toda essa funcionalidade é manipulada automaticamente.

O Smart Imaging funciona com HTTPS? E HTTP/2?

O Smart Imaging funciona com imagens entregues por HTTP ou HTTPS. Além disso, também funciona por HTTP/2.

Posso usar a Smart Imaging?

Para usar a Smart Imaging, a Dynamic Media Classic ou Dynamic Media na Experience Manager deve atender aos seguintes requisitos:

  • Use a CDN (Content Delivery Network) fornecida pelo Adobe como parte de sua licença.
  • Usar um domínio dedicado (por exemplo, images.company.com ou mycompany.scene7.com), não um domínio genérico (por exemplo, s7d1.scene7.com, s7d2.scene7.comou s7d13.scene7.com).

Para localizar seus domínios, abra o Aplicativo de desktop do Dynamic Media Classic, em seguida, faça logon em sua conta ou contas da empresa.

Ir para Configuração > Configuração do aplicativo > Configurações gerais. Procure o campo rotulado Nome do servidor publicado. Se você usa um domínio genérico no momento, é possível solicitar a transferência para seu próprio domínio personalizado. Faça essa solicitação de transição ao enviar um caso de suporte.

Seu primeiro domínio personalizado não tem custo adicional com uma licença do Dynamic Media.

Qual é o processo para ativar a Smart Imaging na minha conta?

Você inicia uma solicitação para usar a Smart Imaging; ele não é ativado automaticamente.

Crie um caso de suporte conforme descrito abaixo. No seu caso de suporte, certifique-se de mencionar quais dos seguintes recursos de Smart Imaging (um ou mais) você deseja ativar em sua conta:

  • WebP
  • AVIF
  • Otimização do DPR e da largura de banda da rede
  • PNG para AVIF com perdas ou WebP com perdas

Se você já tiver o Smart Imaging ativado com o WebP, mas desejar outros novos recursos, conforme listado acima, é necessário criar um caso de suporte.

Para criar um caso de suporte para ativar o Smart Imaging em sua conta:

  1. Use o Admin Console para iniciar a criação de um novo caso de suporte.

  2. Forneça as seguintes informações no caso de suporte:

    • Nome do contato principal, email, telefone.

    • Liste quais dos seguintes recursos de Smart Imaging (um ou mais) você deseja ativar em sua conta:

      • WebP
      • AVIF
      • Otimização do DPR e da largura de banda da rede
      • PNG para AVIF com perdas ou WebP com perdas
    • Todos os domínios a serem ativados para Smart Imaging (ou seja, images.company.com ou mycompany.scene7.com).

      Para localizar seus domínios, abra o Aplicativo de desktop do Dynamic Media Classic, em seguida, faça logon em sua conta ou contas da empresa.

      Ir para Configuração > Configuração do aplicativo > Configurações gerais.

      Procure o campo rotulado Nome do servidor publicado.

    • Verifique se você está usando a CDN por meio do Adobe e não é gerenciada com uma relação direta.

    • Verifique se você está usando um domínio dedicado como images.company.com ou mycompany.scene7.come não um domínio genérico, como s7d1.scene7.com, s7d2.scene7.com, s7d13.scene7.com.

      Para localizar seus domínios, abra o Aplicativo de desktop do Dynamic Media Classic, em seguida, faça logon em sua conta ou contas da empresa.

      Ir para Configuração > Configuração do aplicativo > Configurações gerais.

      Procure o campo rotulado Nome do servidor publicado. Se você estiver usando um domínio genérico do Dynamic Media Classic no momento, poderá solicitar a mudança para seu próprio domínio personalizado como parte dessa transição.

    • Indique se deseja que funcione em HTTP/2.

  3. O Suporte ao cliente do Adobe adiciona você à Lista de espera do cliente de Smart Imaging com base na ordem em que as solicitações são enviadas.

  4. Quando o Adobe estiver pronto para lidar com sua solicitação, o Suporte ao cliente entrará em contato com você para coordenar e definir uma data de destino.

  5. Opcional: Como opção, você pode testar a Imagem inteligente na Preparação antes do Adobe colocar o novo recurso em produção.

  6. Você será notificado após a conclusão pelo Suporte ao cliente.

  7. Para maximizar os aprimoramentos de desempenho do Smart Imaging, o Adobe recomenda definir o Time To Live (TTL) para 24 horas ou mais. O TTL define quanto tempo os ativos são armazenados em cache pela CDN. Para alterar essa configuração:

    1. Se você usar o Dynamic Media Classic, acesse Configuração > Configuração do aplicativo > Configuração de publicação > Servidor de imagem. Defina as Tempo de Vida do Cache do Cliente Padrão para 24 ou mais.
    2. Se você usar o Dynamic Media, siga estas instruções. Defina as Expiração 24 horas ou mais.

Quando posso esperar que minha conta seja ativada com a Smart Imaging?

As solicitações são processadas na ordem em que são recebidas pelo Suporte ao cliente, de acordo com a Lista de espera.

OBSERVAÇÃO

Pode haver um longo lead time, pois a ativação da Imagem inteligente envolve a limpeza do cache pelo Adobe. Portanto, apenas algumas transições de clientes podem ser tratadas a qualquer momento.

Quais são os riscos ao mudar para usar a Smart Imaging?

Não há risco para uma página da Web do cliente. No entanto, a transição para o Smart Imaging limpa o cache CDN. Essa operação envolve mover para uma nova configuração do Dynamic Media Classic ou Dynamic Media no Experience Manager.

Durante a transição inicial, as imagens não armazenadas em cache acessam diretamente os servidores de origem do Adobe até que o cache seja recriado. Dessa forma, o Adobe pretende lidar com algumas transições de clientes de cada vez, para que o desempenho aceitável seja mantido ao puxar solicitações da origem. Para a maioria dos clientes, o cache é totalmente criado novamente na CDN dentro de 1 a 2 dias.

Como posso verificar se a Smart Imaging está funcionando como esperado?

  1. Depois que sua conta for configurada com Smart Imaging, carregue um URL de imagem Dynamic Media Classic ou Adobe Experience Manager - Dynamic Media no navegador.

  2. Abra o painel do desenvolvedor do Chrome acessando Exibir > Desenvolvedor > Ferramentas do desenvolvedor no navegador. Ou escolha qualquer ferramenta de desenvolvedor de navegador de sua escolha.

  3. Certifique-se de que o cache esteja desativado quando as ferramentas do desenvolvedor estiverem abertas.

    • No Windows®, navegue até as configurações no painel de ferramentas do desenvolvedor e selecione Desabilitar cache (enquanto as ferramentas do dispositivo estão abertas) caixa de seleção.
    • No macOS, no painel do desenvolvedor, em Rede guia , selecione desativar cache.
  4. Observe que o Tipo de conteúdo é transformado no formato apropriado. A captura de tela a seguir mostra uma imagem PNG sendo convertida dinamicamente em WebP no Chrome. Se o seu domínio tiver o AVIF ativado, você também pode esperar ver o AVIF no Tipo de conteúdo.

  5. Repita esse teste em navegadores e condições de usuário diferentes.

OBSERVAÇÃO

Nem todas as imagens são convertidas. O Smart Imaging decide se a conversão pode melhorar o desempenho. Às vezes, onde não há ganho de desempenho esperado ou o formato não é JPEG ou PNG, a imagem não é convertida.

image2017-11-14_15398

Como saber o ganho em desempenho? Existe uma maneira de conhecer os benefícios do Smart Imaging?

O cabeçalho Smart Imaging determina os benefícios do Smart Imaging. Quando a Smart Imaging estiver ativada, depois de solicitar uma imagem, sob a Cabeçalhos de resposta título, você pode ver -X-Adobe-Smart-Imaging como visto no exemplo destacado a seguir:

Cabeçalho de imagem inteligente

Esse cabeçalho informa o seguinte:

  • O Smart Imaging está funcionando para a empresa.
  • Um valor positivo significa que a conversão é bem-sucedida. Nesse caso, uma nova imagem da WebP é retornada.
  • Um valor negativo significa que a conversão não foi bem-sucedida. Nesse caso, a imagem original solicitada é retornada (JPEG por padrão, se não especificada).
  • Um valor positivo mostra a diferença em bytes entre a imagem solicitada e a nova imagem. No exemplo acima, os bytes salvos são 75048 ou aproximadamente 75 KB para uma imagem.
  • Um valor negativo significa que a imagem solicitada é menor que a nova imagem. A diferença de tamanho negativo é mostrada, mas a imagem veiculada é somente a imagem solicitada original.
OBSERVAÇÃO

X-Adobe-Smart-Imaging = -1 com WebP sendo entregue

Se o valor de X-Adobe-Smart-Imaging for -1 e o WebP ainda estiver sendo entregue, significa que o Smart Imaging está funcionando, mas os benefícios de tamanho não foram calculados devido ao cache antigo. Você pode usar cache=update (somente uma vez) no URL da imagem para corrigir esse problema.
Um exemplo de uso do modificador:
https://smartimaging.scene7.com/is/image/SmartImaging/sample1?cache=update
Para invalidar o cache inteiro, você deve criar um caso de suporte.

Como posso desativar a otimização de AVIF no Smart Imaging?

Se quiser voltar a servir o WebP por padrão, crie um caso de suporte para o mesmo. Como de costume, você pode desativar o Smart Imaging adicionando o parâmetro bfc=off ao URL da imagem. No entanto, você não pode selecionar WebP ou AVIF no modificador de URL para Smart Imaging. Essa capacidade é mantida no nível da conta da sua empresa.

A Smart Imaging pode ser desativada para qualquer solicitação?

Sim. Você pode desativar a Smart Imaging adicionando um dos seguintes modificadores:

Que "ajuste" está disponível? Existem configurações ou comportamentos que podem ser definidos?

A Imagem inteligente tem três opções que você pode ativar ou desativar.

Tenho um URL com fmt=tif no navegador web Chrome. Mas minha solicitação falha com um erro do ImageServer. Por quê?

Esse erro não ocorre se a Imagem inteligente não estiver ativada em sua conta. A Imagem inteligente funciona somente com formatos JPEG ou PNG.

Para evitar esse erro, é possível:

  • Especifique JPEG ou PNG, ou
  • Não use o fmt modificador, ou
  • Use um formato preferencial do navegador definido pelo Smart Imaging. Por exemplo, você pode usar o WebP para navegador da Web Chrome.

Quero baixar uma imagem TIFF do URL de uma imagem. Como faço isso?

Adicionar fmt=tif e bfc=off para o caminho do URL da imagem.

O Smart Imaging só gerencia o formato de imagem ou também gerencia as configurações de qualidade de imagem para obter melhores resultados?

O Smart Imaging usa formato e qualidade. O restante dos parâmetros permanecem os mesmos, se solicitado no URL da imagem.

Se o Smart Imaging gerenciar as configurações de qualidade, há mínimos e máximos que eu posso definir? Ou seja, uma qualidade que não é inferior a 60 e não é superior a 80?

Atualmente, não há esse provisionamento.

O Smart Imaging ajusta automaticamente a configuração de saída de porcentagem de qualidade ou é uma configuração que é ajustada manualmente e se aplica a todas as imagens? Dentro de que intervalo?

A Smart Imaging ajusta automaticamente a porcentagem de qualidade. Esse percentual de qualidade é determinado por meio de um algoritmo de aprendizado de máquina desenvolvido pelo Adobe. Essa porcentagem não é específica do intervalo.

Com a Smart Imaging, quais comandos de veiculação de imagens são suportados ou ignorados?

Os únicos comandos que são ignorados são fmt e qlt. Todos os comandos restantes são suportados.

As imagens de JPEG são substituídas apenas por Imagens inteligentes? E se eu solicitar um WebP, PNG ou algo mais?

Essa funcionalidade funciona somente para JPEG e PNG.

Por que uma imagem JPEG às vezes é retornada ao Chrome em vez de WebP?

O Smart Imaging determina se a conversão é benéfica ou não. Ele retorna a nova imagem somente da conversão que é benéfica.

Por que a funcionalidade da Proporção de pixels do dispositivo (dpr) não funciona conforme o esperado com imagens compostas?

Se uma imagem composta envolver muitas camadas, a funcionalidade do dpr pode ser afetada ao usar um modificador de posição. Esse problema é conhecido e será corrigido em versões futuras do Smart Imaging. Se outra funcionalidade de Smart Imaging não estiver funcionando como esperado, você pode criar um caso de suporte para relatar o problema.

Por que o PNG do Smart Imaging ainda é convertido em WebP/AVIF sem perdas?

Como o PNG é um formato sem perdas, o WebP e o AVIF anteriores eram entregues sem perdas, resultando em um tamanho maior do que o esperado. O Smart Imaging agora suporta conversão com perdas. Você pode usar o modificador cache=update (somente uma vez) em uma solicitação de imagem para corrigir esse problema. Um exemplo de uso deste modificador:

https://smartimaging.scene7.com/is/image/SmartImaging/sample1?cache=update

Para invalidar o cache inteiro, você deve criar um caso de suporte solicitando esse esforço.

Como posso continuar usando o PNG para conversão sem perdas no Smart Imaging?

O Smart Imaging agora oferece suporte à conversão com perdas com base no nível de qualidade. Para continuar usando a conversão sem perdas, você pode usar a qualidade 100 definida pela configuração da sua empresa ou pelo URL da imagem usando qlt=100 no caminho.

Nesta página