Passar para o conteúdo principal
Como Otimizar Imagens no Construtor de Páginas da Rockty

Melhore o desempenho da sua página otimizando imagens. Use formatos como WebP e ferramentas externas para compressão sem perda de qualidade

Sylas avatar
Escrito por Sylas
Atualizado há mais de uma semana

Introdução

A otimização de imagens é um fator crucial para garantir que suas páginas carreguem rapidamente e ofereçam uma boa experiência ao usuário. No construtor de páginas da Rockty, é essencial que as imagens sejam configuradas corretamente para garantir responsividade e performance.

Neste tutorial, abordaremos como otimizar suas imagens para uso no construtor da Rockty e melhorar o desempenho geral da sua página.


1. Limite de Tamanho das Imagens

No construtor da Rockty, o tamanho máximo permitido para imagens é de 1 MB. Para garantir que suas imagens carreguem rápido, é ideal manter os arquivos bem comprimidos.

💡 Dica Importante: Utilize ferramentas de compressão de imagem que não causem perda de qualidade, como o TinyPNG ou Squoosh, antes de fazer o upload.


2. Formatos Recomendados

O formato WebP é altamente recomendado para uso no construtor de páginas. Ele oferece compressão eficiente com qualidade visual elevada, garantindo que suas páginas carreguem mais rapidamente sem sacrificar a qualidade das imagens.

💡 Dica: Embora outros formatos como JPEG e PNG sejam comuns, o WebP é o preferido para otimização de performance. O Google PageSpeed penaliza o uso de formatos mais antigos.


📌 Observação: É importante que você adapte a imagem otimizada para todas as versões da página (desktop, tablet e mobile). Não adianta otimizar para desktop e usar um formato mais pesado no mobile, por exemplo.


3. Ajustes Manuais no Construtor

O construtor da Rockty permite que você ajuste diversos aspectos das imagens de forma nativa, incluindo:

  • Preenchimento e dimensões (largura e altura).

  • Para imagens de fundo em seções, colunas e linhas, você pode configurar o:

    • Tamanho: Auto, expandido, ou contraído.

    • Alinhamento: Centralizado ou alinhado de forma específica.

    • Repetição: Ativar ou desativar a repetição.

    • Background: Fluido ou Fixo.

💡 Dica: Ao ajustar o background ou o tamanho da imagem, pense na responsividade e faça os ajustes manuais para cada versão da página (desktop, tablet e mobile).


4. Redimensionamento e Edição Externa

É comum que os usuários façam upload de imagens que têm espaços ou margens desnecessárias, que impactam o ajuste no construtor. Para evitar isso, redimensione e edite as imagens corretamente antes de subi-las ao construtor.

💡 Dica Importante: Se a imagem possui elementos centrais importantes, certifique-se de cortar qualquer espaço desnecessário ao redor. Isso facilita o alinhamento e o ajuste no construtor, evitando problemas visuais e de desempenho.


5. Boas Práticas de Otimização

Aqui estão algumas práticas recomendadas para garantir a melhor performance no uso de imagens:

  • Compressão sem perda: Certifique-se de comprimir suas imagens para menos de 1 MB sem perder a qualidade visual.

  • Tamanho correto: Ajuste as dimensões da imagem de acordo com o layout da página para evitar redimensionamentos excessivos pelo navegador, o que pode impactar negativamente o tempo de carregamento.

  • Responsividade: Revise cada versão da página e carregue imagens otimizadas para desktop, tablet e mobile separadamente.

📌 Observação: Cada versão da página pode exigir imagens com tamanhos e configurações diferentes para maximizar a performance e garantir que a visualização seja perfeita em qualquer dispositivo.


Considerações Finais

Imagens bem otimizadas são fundamentais para garantir uma experiência de usuário rápida e fluida. Ao seguir essas dicas, você pode garantir que suas páginas no construtor da Rockty tenham um excelente desempenho e sejam mais eficientes para todos os visitantes.


Precisa de Ajuda?

Se tiver dúvidas ou precisar de suporte adicional, não hesite em entrar em contato com nosso suporte. Nossa equipe está sempre pronta para ajudar você a aproveitar ao máximo a Rockty!

Respondeu à sua pergunta?