As imagens em uma Central de Ajuda aparecem desfocadas ou distorcidas

Sinais do problema

As imagens dentro de um artigo ou publicação da comunidade parecem muito menos legíveis do que o original. Se essa for uma captura de tela de um aplicativo, o texto pode estar ilegível. Se for uma foto, a clareza não é ideal.

Condições

A imagem parece normal e legível quando visualizada em uma nova aba do navegador ou em resolução máxima.
O problema se apresenta apenas na sua Central de Ajuda.

Etapas de resolução

Embora esse problema normalmente pareça o mesmo em todas as situações, pode haver alguns motivos para ele ocorrer.

CSS está causando o redimensionamento da imagem

As imagens são de todos os tamanhos, mas, normalmente, em uma Central de Ajuda, os limites são ditados por sua localização. Por exemplo, a maioria dos corpos de artigo na Central de Ajuda tem cerca de 700 px de largura. Se uma imagem de 2.000 px de largura for adicionada, é provável que a imagem fique distorcida, pois o navegador precisa fazer com que a imagem caiba no corpo mais estreito do artigo.

Para remediar isso, ajuste o CSS para permitir uma imagem maior ou salve a imagem em uma resolução muito próxima ao tamanho de sua localização relativa. No exemplo acima, salvar a imagem em uma resolução com uma largura de 700 px fornece uma representação mais fiel da imagem. Além disso, dimensione a altura para o novo tamanho apropriado em seu software de edição de fotos.

Dica: Algumas de nossas equipes internas tiveram sucesso ao comprimir a imagem em cores de 8 bits para downloads mais rápidos (sem redimensionar as dimensões da imagem) e usar o width atribua para dimensioná -los nos artigos (). Use um editor de imagem para criar os arquivos de cor de 8 bits.

Como alternativa, há algumas propriedades CSS mais experimentais, como image-rendering que afetam o modo como o navegador exibe suas imagens. CSS personalizado está fora do escopo do Suporte ao cliente Zendesk, mas você pode ter sucesso usando essas propriedades.

O nível de zoom do navegador está definido como um valor maior que 100%

Quando você usa a ferramenta de zoom em um navegador, se você navegar para outro site, essa configuração de zoom pode persistir e permanecer ampliada. Isso pode causar problemas na aparência das imagens, pois o navegador está trabalhando para decidir como uma imagem deve ficar após as considerações de CSS e também como ela deve ficar com uma configuração de zoom diferente. Para restaurar a aparência da imagem, volte para o zoom de 100% no navegador.

Aviso sobre a tradução: este artigo foi traduzido por um software de tradução automática para oferecer a você uma compreensão básica do conteúdo. Medidas razoáveis foram tomadas para fornecer uma tradução precisa, no entanto, a Zendesk não garante a precisão da tradução.

Em caso de dúvidas relacionadas à precisão das informações contidas no artigo traduzido, consulte a versão oficial do artigo em inglês.