Como Otimizar Imagens para Desempenho na Web Sem Perder Qualidade

Lidar com um site lento é incrivelmente frustrante. Depois de ajudar milhares de leitores do WPBeginner a acelerar seus sites, descobrimos que um problema aparece mais do que qualquer outro: imagens grandes e não otimizadas.

Muitos proprietários de sites se preocupam que reduzir o tamanho de suas imagens as fará parecer borradas e não profissionais. Entendemos. A boa notícia é que você não precisa escolher entre páginas de carregamento rápido e imagens bonitas e de alta qualidade.

Aperfeiçoamos um processo simples para otimização de imagens que usamos em todos os nossos próprios sites. Este guia o guiará por essas etapas exatas e amigáveis para iniciantes. Você aprenderá como tornar suas imagens menores sem sacrificar a qualidade.

Como Otimizar Facilmente Imagens para a Web (Sem Perder Qualidade)

Como este é um guia abrangente sobre otimização de imagens para a web, criamos um índice fácil de seguir:

  1. O que é Otimização de Imagem?
  2. Quais são os benefícios da otimização de imagens?
  3. Como Salvar e Otimizar Imagens para Desempenho na Web
  4. Melhores Ferramentas e Programas de Otimização de Imagem
  5. Melhores Plugins de Otimização de Imagem para WordPress
  6. Considerações Finais e Melhores Práticas para Otimização de Imagem
  7. Tutorial em Vídeo
  8. Perguntas frequentes sobre otimização de imagens
  9. Recursos adicionais sobre como melhorar o desempenho do WordPress

1. O que é Otimização de Imagem?

Otimização de imagem é o processo de salvar e entregar imagens no menor tamanho de arquivo possível sem reduzir a qualidade geral da imagem.

Embora o processo pareça complexo, na verdade é bastante fácil hoje em dia. Você pode usar um dos muitos plugins e ferramentas de otimização de imagem para comprimir automaticamente imagens em até 80% sem qualquer perda visível na qualidade da imagem.

Aqui está um exemplo de uma imagem otimizada versus não otimizada:

Imagens otimizadas vs. não otimizadas no WordPress

Como você pode ver, quando otimizada corretamente, a mesma imagem pode ser até 80% menor que a original sem nenhuma perda de qualidade. Neste exemplo, a imagem é 52% menor.

Como funciona a otimização de imagens?

Em termos simples, a otimização de imagens funciona usando tecnologia de compressão.

A compressão pode ser 'com perdas' ou 'sem perdas'.

A compressão sem perdas reduz o tamanho geral do arquivo sem nenhuma perda de qualidade da imagem. Com a compressão com perdas, pode haver uma pequena perda de qualidade, mas idealmente, ela não será perceptível para seus visitantes.

O que significa otimizar imagens?

Você pode ter recebido uma recomendação para otimizar imagens do suporte de hospedagem do seu WordPress ou de uma ferramenta de teste de velocidade e se perguntar o que precisa fazer.

Você precisará reduzir o tamanho do arquivo de suas imagens otimizando-as para a web. Mostraremos como fazer isso passo a passo.

2. Quais são os benefícios da otimização de imagens?

Embora existam muitos benefícios em otimizar suas imagens, aqui estão os principais que você deve saber:

  • Velocidade mais rápida do site
  • Melhoria no ranking de SEO
  • Uma taxa de conversão geral mais alta para vendas e leads
  • Menos armazenamento e largura de banda (o que pode reduzir os custos de hospedagem e CDN)
  • Backups de site mais rápidos (o que pode reduzir o custo de armazenamento de backup)

Imagens são o segundo item mais pesado em uma página da web depois de vídeos. De acordo com o HTTP Archive, imagens frequentemente compõem a maior parte do tamanho total do arquivo de uma página.

Como sabemos que sites rápidos têm melhor classificação nos motores de busca (SEO) e melhores conversões, a otimização de imagens é algo que todo site de negócios deve fazer se quiser ter sucesso online.

Agora você pode estar se perguntando o quão grande pode ser a diferença que a otimização de imagens realmente faz.

Um estudo fundamental da Strangeloop descobriu que um atraso de um segundo no tempo de carregamento poderia custar 7% das vendas, 11% menos visualizações de página e uma diminuição de 16% na satisfação do cliente. Hoje, com as expectativas dos usuários ainda mais altas, o impacto é ainda mais significativo.

Estudo de caso Strangeloop

Se estas não são razões suficientes para acelerar seu site, então você deve saber que motores de busca como o Google também dão tratamento de SEO preferencial a sites que carregam mais rápido.

Isso significa que, ao otimizar suas imagens para a web, você pode tanto melhorar a velocidade do site quanto impulsionar os rankings de SEO do WordPress.

3. Como Salvar e Otimizar Imagens para Desempenho Web

A chave para uma otimização de imagens bem-sucedida para desempenho web é encontrar o equilíbrio perfeito entre o menor tamanho de arquivo e a qualidade de imagem aceitável.

As três coisas que desempenham um papel enorme na otimização de imagens são:

  • Formato do arquivo de imagem (JPEG vs. PNG vs. GIF)
  • Compressão (maior compressão = menor tamanho de arquivo)
  • Dimensões da imagem (altura e largura)

Ao escolher a combinação certa das três, você pode reduzir o tamanho da sua imagem em até 80%.

Vamos analisar cada um deles com mais detalhes.

1. Formato do Arquivo de Imagem

Para a maioria dos proprietários de sites, os únicos três formatos de arquivo de imagem que realmente importam são JPEG, PNG e GIF. Escolher o tipo de arquivo correto desempenha um papel importante na otimização de imagens.

Para simplificar, você deve usar JPEGs para fotos ou imagens com muitas cores, PNGs para imagens simples ou transparentes e GIFs apenas para imagens animadas.

Para aqueles que não sabem a diferença entre cada tipo de arquivo:

  • O formato de imagem PNG usa compressão sem perdas. Isso significa que ele reduz o tamanho do arquivo sem nenhuma perda de qualidade, tornando-o uma ótima opção para logotipos, gráficos com muito texto e imagens onde você precisa de linhas nítidas e transparência.
  • Por outro lado, JPEG é um formato de arquivo compactado que reduz ligeiramente a qualidade da imagem para fornecer um tamanho de arquivo significativamente menor.
  • Enquanto o GIF usa apenas 256 cores juntamente com compressão sem perdas, o que o torna a melhor escolha para imagens animadas.

No WPBeginner, usamos uma combinação desses formatos. No entanto, muitos sites modernos agora estão usando o formato WebP. O WebP geralmente oferece uma compressão ainda melhor que JPEG e PNG (significando arquivos menores) com excelente qualidade. A maioria dos navegadores agora o suporta, e muitos plugins de otimização podem converter automaticamente suas imagens para WebP para um grande aumento de velocidade.

Para mais informações sobre formatos de imagem, consulte nosso guia sobre WebP vs. PNG vs. JPEG: qual é o melhor formato de imagem para WordPress.

2. Compressão

A próxima coisa é a compressão de imagem, que desempenha um papel enorme na otimização de imagens.

Existem diferentes tipos e níveis de compressão de imagem disponíveis. As configurações para cada um variam dependendo da sua ferramenta de compressão de imagem.

A maioria das ferramentas de edição de imagem como Adobe Photoshop, ON1 Photo, GIMP, Affinity Photo e outras possuem recursos de compressão de imagem integrados.

Você também pode salvar as imagens normalmente e depois usar uma ferramenta online como TinyPNG ou JPEGmini para uma compressão de imagem mais fácil.

Embora exijam algum esforço manual, esses dois métodos permitem que você comprima imagens antes de carregá-las no WordPress, e é isso que fazemos no WPBeginner.

Existem também vários plugins populares para WordPress como Optimole e EWWW Image Optimizer que podem comprimir automaticamente as imagens quando você as carrega pela primeira vez. Isso é conveniente, e muitos iniciantes e até grandes corporações preferem usar esses plugins de otimização de imagem.

Compartilharemos mais sobre o uso de plugins do WordPress mais adiante no artigo.

3. Dimensões da Imagem

Normalmente, quando você importa uma foto do seu telefone ou de uma câmera digital, ela tem uma resolução muito alta e grandes dimensões de arquivo (altura e largura).

Quando você obtém fotos do seu telefone ou de uma câmera digital, elas geralmente têm dimensões de pixels muito grandes (como 4000 pixels de largura) e podem ter uma configuração de 'resolução' de 300 DPI.

Aqui está uma dica fundamental para imagens da web: você pode ignorar completamente o DPI. Essa configuração é para impressão. Para a web, a única coisa que importa são as dimensões em pixels (altura e largura).

Reduzir as dimensões da imagem para algo mais razoável pode diminuir significativamente o tamanho do arquivo da imagem. Você pode simplesmente redimensionar imagens usando um software de edição de imagens no seu computador.

Por exemplo, tiramos uma foto com dimensões originais enormes de 4900 × 3200 pixels. O tamanho original do arquivo era de 1,8 MB.

Escolhemos o formato JPEG para maior compressão e alteramos as dimensões para 1200×795 pixels. O tamanho do arquivo foi reduzido para apenas 103 KB. Isso é 94% menor que o tamanho original do arquivo.

Agora que você conhece os três fatores importantes na otimização de imagens, vamos dar uma olhada em várias ferramentas de otimização de imagens para proprietários de sites.

4. Melhores Ferramentas e Programas de Otimização de Imagens

Como mencionamos anteriormente, a maioria dos softwares de edição de imagens vem com configurações de otimização e compressão de imagens.

Fora do software de edição de imagens, existem também várias ferramentas gratuitas e poderosas de otimização de imagens que você pode usar para otimizar imagens para a web (com apenas alguns cliques).

Recomendamos o uso dessas ferramentas para otimizar imagens antes de carregá-las no WordPress, especialmente se você for um perfeccionista.

Este método ajuda você a economizar espaço em disco na sua conta de hospedagem WordPress e garante a imagem mais rápida com a melhor qualidade, já que você revisa manualmente cada imagem.

Adobe Photoshop

Adobe Photoshop é um aplicativo premium de edição de imagens que permite exportar imagens com um tamanho de arquivo menor para a web.

Exportar imagem para a web

Usando a caixa de diálogo de exportação, você pode escolher um formato de arquivo de imagem (JPG, PNG, GIF) que resulte no menor tamanho de arquivo.

Você também pode reduzir a qualidade da imagem, cores e outras opções para diminuir ainda mais o tamanho do arquivo.

Otimizar imagem antes de salvar

GIMP

GIMP é uma alternativa gratuita e de código aberto ao Adobe Photoshop. Ele pode ser usado para otimizar suas imagens para a web. A desvantagem é que ele não é tão fácil de usar quanto algumas outras soluções nesta lista.

Primeiro, você precisa abrir sua imagem no GIMP e, em seguida, selecionar a opção Arquivo » Exportar Como…. Isso abrirá a caixa de diálogo Exportar Imagem, onde você pode dar um novo nome ao seu arquivo. Em seguida, você precisa clicar no botão ‘Exportar’.

Agora você verá as opções de exportação de imagem. Para arquivos JPEG, você pode usar o controle deslizante ‘Qualidade’ para selecionar o nível de compressão e reduzir o tamanho do arquivo.

Exportando uma Imagem no GIMP

Finalmente, você deve clicar no botão ‘Exportar’ para salvar o arquivo de imagem otimizado.

TinyPNG

TinyPNG é um aplicativo web gratuito que usa uma técnica inteligente de compressão com perdas para reduzir o tamanho de seus arquivos PNG e JPEG. Tudo o que você precisa fazer é ir ao site deles e fazer o upload de suas imagens usando um simples arrastar e soltar.

Otimize Suas Imagens

Eles comprimirão a imagem e fornecerão um link para download.

Eles também têm uma extensão para Adobe Photoshop, que é o que usamos como parte do nosso processo de edição de imagens, pois permite acessar o TinyPNG de dentro do Photoshop.

Para desenvolvedores, eles têm uma API para converter imagens automaticamente. Além disso, para iniciantes, eles têm um plugin para WordPress que fará isso por você. Falaremos mais sobre isso mais tarde.

JPEGmini

JPEGmini usa uma poderosa tecnologia de compressão com perdas que reduz significativamente o tamanho das imagens sem afetar sua qualidade percebida. Você também pode comparar a qualidade da imagem original e da imagem comprimida para ver por si mesmo.

Ferramenta online de compressão de imagem JPEGMini

Você pode usar a versão web deles gratuitamente ou comprar o programa para o seu computador. Eles também têm uma API paga para automatizar o processo para o seu servidor.

ImageOptim

O ImageOptim é um utilitário para Mac que permite comprimir imagens sem perder nenhuma qualidade, encontrando os melhores parâmetros de compressão e removendo perfis de cor desnecessários.

Otimizando Imagens Usando ImageOptim

Uma alternativa para Windows a esta é Trimage.

5. Melhores Plugins de Otimização de Imagem para WordPress

Acreditamos que a melhor maneira de otimizar suas imagens é fazê-lo antes de carregá-las no WordPress. No entanto, se você administra um site com vários autores ou precisa de uma solução automatizada, pode experimentar um plugin de compressão de imagem para WordPress.

Aqui está nossa lista dos melhores plugins de compressão de imagem para WordPress:

  1. Optimole, um plugin popular da equipe por trás da ThemeIsle
  2. Otimizador de Imagens EWWW
  3. Compressão de Imagem JPEG, PNG e WebP, um plugin da equipe TinyPNG mencionada acima
  4. Imagify, um plugin da popular equipe WP Rocket
  5. ShortPixel Image Optimizer
  6. Smush
  7. reSmush.it
  8. Envira Gallery é um plugin de galeria para WordPress com compressão de imagem integrada

Estes plugins de otimização de imagem para WordPress ajudarão você a acelerar seu site.

6. Considerações Finais e Melhores Práticas para Otimização de Imagem

Se você não está salvando imagens otimizadas para a web, então precisa começar a fazer isso agora. Isso fará uma grande diferença na velocidade do seu site, e seus usuários agradecerão por isso.

Sem mencionar que sites mais rápidos são ótimos para SEO, e você provavelmente verá um aumento em seus rankings nos motores de busca.

Fora da otimização de imagens, as duas coisas que ajudarão significativamente a acelerar seu site são o uso de um plugin de cache do WordPress e o uso de uma CDN do WordPress.

No WPBeginner, usamos WP Rocket porque ele combina recursos poderosos de cache e otimização de imagem, incluindo carregamento preguiçoso (o que significa que as imagens só carregam quando um visitante rola a página para vê-las) e suporte a WebP, em uma única solução.

Se você usa o plugin Envira Gallery, também recomendamos o serviço Envira CDN deles. É uma CDN específica para imagens que faz com que suas galerias de fotos carreguem incrivelmente rápido sem a complexidade de uma configuração de CDN tradicional.

Alternativamente, você pode usar uma empresa de hospedagem WordPress gerenciada, pois elas geralmente oferecem cache e CDN como parte da plataforma.

Tutorial em Vídeo

Inscreva-se no WPBeginner

Perguntas frequentes sobre otimização de imagens

Ao longo dos anos ajudando usuários a melhorar a velocidade de seus sites, respondemos a muitas perguntas sobre otimização de imagens. Aqui estão as respostas para algumas das mais comuns.

1. Qual é o melhor formato de imagem para a web?

Depende do tipo de imagem. Para fotografias com muitas cores, JPEG geralmente é a melhor escolha. Para gráficos simples, logotipos ou imagens que exigem um fundo transparente, PNG é ideal. GIFs só devem ser usados para animações. O formato mais novo, WebP, também é uma excelente opção que oferece ótima qualidade com tamanhos de arquivo pequenos.

2. A otimização de imagens reduz sua qualidade?

Nem sempre. A compressão ‘sem perdas’ (lossless) reduz o tamanho dos arquivos com zero perda de qualidade. Mesmo com a compressão ‘com perdas’ (lossy), o objetivo é encontrar um equilíbrio onde o tamanho do arquivo é drasticamente reduzido, mas qualquer alteração na qualidade é virtualmente invisível a olho nu.

3. Qual é um bom tamanho de arquivo para imagens da web?

Não existe um tamanho perfeito, mas um ótimo alvo para a maioria das imagens é abaixo de 150 KB. Para imagens grandes e de largura total, você pode chegar a 500 KB. O objetivo principal é sempre obter o menor arquivo possível, mantendo a imagem nítida e clara em seu site.

4. Como a otimização de imagens melhora o SEO?

Mecanismos de busca como o Google usam a velocidade da página como um fator de ranqueamento. Como as imagens são frequentemente os maiores arquivos em uma página, otimizá-las faz com que seu site carregue mais rápido. Essa melhoria de velocidade pode levar a melhores ranqueamentos de SEO e uma melhor experiência para seus visitantes.

5. Posso otimizar imagens já carregadas no WordPress?

Sim. A maioria dos plugins de otimização de imagens para WordPress inclui um recurso de ‘otimização em massa’. Essa ferramenta pode escanear toda a sua biblioteca de mídia e comprimir todas as suas imagens existentes, o que é perfeito para melhorar a velocidade de um site estabelecido.

Recursos adicionais sobre como melhorar o desempenho do WordPress

Esperamos que este artigo tenha ajudado você a aprender como otimizar suas imagens no WordPress. Você também pode querer ver outros artigos relacionados à melhoria do desempenho do WordPress:

Se você gostou deste artigo, por favor, inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.

Aviso: Nosso conteúdo é apoiado pelos leitores. Isso significa que, se você clicar em alguns de nossos links, poderemos ganhar uma comissão. Veja como o WPBeginner é financiado, por que isso importa e como você pode nos apoiar. Aqui está nosso processo editorial.

O Kit de Ferramentas Definitivo para WordPress

Obtenha acesso GRATUITO ao nosso kit de ferramentas - uma coleção de produtos e recursos relacionados ao WordPress que todo profissional deve ter!

Interações do Leitor

123 CommentsLeave a Reply

  1. Olá, redimensionar significa alterar o tamanho das imagens conforme elas são exibidas no site, ou redimensionar o tamanho do arquivo, por favor?
    E como sei qual é o tamanho ideal?

    • Dependeria do que você quer dizer, para compressão neste guia, é o tamanho do arquivo. Você também pode reduzir a largura e a altura de uma imagem se ela for muito grande. Seu tema específico determinaria o tamanho específico da imagem que você deseja usar.

      Admin

  2. Você mencionou em seu exemplo de otimização que sua foto original era de 300 dpi, depois você a otimizou para um tamanho de arquivo menor. Mas você não disse qual era o dpi alvo. É 72 para web? Ou maior? Obrigado pelo artigo informativo.

    • Isso dependeria de sua preferência pessoal e de quão grandes você deseja/precisa que as imagens sejam.

      Admin

  3. O que eu mais gosto no wpbeginner é como eles fornecem informações sobre o que implementar em seu próprio site, mas também dizem o que eles estão usando em seu próprio site. Isso realmente me ajuda a decidir mais rápido. Aprender com um mestre é sempre mais fácil. Obrigado.

  4. Eu comprimi imagens via TinyPNG e tentei substituir as imagens mais pesadas em meu site por estas (ou seja, deletei as fotos pesadas e fiz o upload das comprimidas). No entanto, a biblioteca de mídia ainda está fazendo o upload das imagens antigas e pesadas. Isso significa que não posso substituir as imagens antigas já carregadas? Ele só fará o upload das imagens comprimidas que ainda não foram carregadas?

    • Se você estiver substituindo as imagens mais pesadas, você deve garantir que não haja cache em seu site que esteja exibindo a imagem antiga e que, ao fazer o upload da nova imagem, você esteja fazendo o upload da imagem correta.

      Admin

  5. Obrigado pelo artigo informativo, Syed.

    Daqui para frente, vou garantir que sempre usarei imagens otimizadas. Você recomenda que eu volte a posts já publicados e substitua minhas imagens por outras otimizadas?

    • If possible we would recommend updating your older images, the plugins we recommended should handle that for you :)

      Admin

  6. Obrigado pela sua postagem. muitas ferramentas boas. Gostaria de saber se há algo que possa ser feito para redimensionar imagens que já foram carregadas e como excluir imagens que o WordPress não está mais usando.

  7. Sou um desenvolvedor WordPress. Estou escrevendo da Turquia.
    Muito difícil encontrar recursos de qualidade para WordPress.
    Eu descobri vocês. Eu não sabia inglês, mas aprendi inglês. Graças a vocês, tudo.

  8. Olá, parece que o WordPress incorporou parte disso ao seu processo atual de upload de imagens, pelo menos na faixa Premium?

    Pergunto porque agora tenho a opção de escolher o tamanho real ou algo maior ou menor?

    Ou esse processo não é uma otimização / redução do tamanho da imagem?

    Muito obrigado! Tópico muito importante e útil.

    Adan

  9. Informação muito útil!! Eu estava pesquisando como fazer isso quando seu e-mail chegou! Economizou meu tempo e esforço e tinha exatamente o conselho que eu estava procurando.

  10. Ao salvar no Photoshop, qual largura você sugere para um desempenho ideal na web?
    Meu tema está salvando 1600x1050 para o cabeçalho ideal, mas o que devo fazer para as imagens do corpo. O designer do tema não tem uma recomendação.

    • Se você estiver seguindo as outras etapas deste artigo, o tamanho da imagem seria o que melhor se encaixa nas dimensões do seu conteúdo, para que o WordPress não precise redimensionar a imagem.

      Admin

  11. Por favor, atualize aquele vídeo do YouTube. Em primeiro lugar, Jpegmini não é um aplicativo web e é um software que eu tenho que instalar no meu PC.

  12. Existe alguma forma de comprimir imagens já carregadas no WordPress? Ou preciso comprimir todas as minhas imagens e depois recarregá-las no WP? Agradeço desde já os conselhos.

  13. Olá,
    Preciso de um conselho: preciso fazer upload de imagens de baixa resolução e alta resolução (1200 pixels a 300 dpi) para que meus clientes possam baixá-las. Não tenho dúvidas sobre a otimização de imagens de baixa resolução. Como posso salvar imagens de alta resolução? O tamanho é de até 2 MB. Tenho centenas de milhares de imagens…

  14. Este post é incrível e realmente agrega valor ao meu site. No entanto, recentemente tentei salvar imagens do flipkart, mas elas foram salvas em formato de pixel muito baixo. Gostaria de saber se você pode me ajudar a descobrir como fazer isso.

  15. Já fiz o upload em massa de 1500 imagens de produtos que estavam conectadas a URLs de imagens que encontrei na internet.

    Agora que tenho essas 1500 imagens na minha Biblioteca de Mídia, como posso voltar e redimensioná-las e comprimi-las?

    Além disso, estou confuso sobre se redimensionar significa alterar o tamanho das imagens como elas são exibidas no site, ou redimensionar o tamanho do arquivo.

    Obrigado!

    • Olá Sara,

      Sim, é uma boa alternativa. No entanto, para obter melhores resultados, ainda recomendamos otimizar as imagens em seu programa de edição de imagens antes de fazer o upload para o WordPress.

      Admin

  16. Estarei viajando para um lugar onde a conectividade com a internet é limitada e cara. Portanto, quero reduzir o tamanho do arquivo das minhas fotos antes de ficar online para carregá-las no meu blog. Alguém pode me recomendar qual resolução e dpi seriam bons para usar? O aplicativo que pretendo usar pede três medidas:
    resolução – de 200 a 2048
    DPI – de 72×72 a 300×300
    qualidade jpeg (nível de compressão) – de 0,00 a 1,00

  17. No vídeo ela muda a foto dela. Entendo a tela no PS. Mas você não explicou qual deve ser a largura e a altura em pixels para o WP o limite é de 2 MB. Qual seria um bom padrão para sliders, etc. para um site WP?

  18. Desculpe por ser o leigo aqui, mas alguém poderia esclarecer uma coisa? Instalei o plugin WP Smush it e venho trabalhando lentamente em todas as fotos que carreguei no meu site nos últimos 2 anos. Estou fazendo 50 por vez, o limite gratuito. No entanto, agora que tenho o plugin, para futuros uploads de fotos, ter ele significa que não preciso usar nenhum outro programa para redimensionar minhas fotos antes de carregá-las no meu site WP? Se eu tiver uma foto de 8 MB e carregá-la no meu site, o plugin faz tudo por mim? Eu só quero confirmar que a foto original não é carregada e salva no meu servidor de hospedagem, SiteGround. Meu site está muito lento, fiz inúmeros diagnósticos e ainda não consigo descobrir o porquê, exceto que tudo aponta para minhas fotos. Obrigado!

    • Oi Carrie, eu definitivamente não sou um especialista de forma alguma, mas tenho experiência com WP Smush it e sim, os futuros uploads devem ser 'smushed' automaticamente. Há uma pequena notificação na galeria de mídia enquanto você faz isso.

      Para verificar as causas do seu site lento, você pode usar o GTmetrix e depois abrir a página waterfall, onde ele mostrará os tempos de carregamento dos itens individuais das páginas. Assim que você souber qual é o problema, poderá resolvê-lo.

      I hope that helps from one ‘dunce’ to another :)

      • Olá Tony,

        Thanks for weighing in! Unfortunately I uninstalled WP Smush and tried EWWW Image Optimizer along with the Thumbnail Regerate plugin (based on another bloggers suggestion) and royally messed up the photos on my site. I’m a newb with regards to how to manage my files through the FTP on my web host, so I ended up deleting a bunch of images (as in hundreds) and re-uploading them after resizing them manually in an image program. Turns out that too was a bad idea. Now I have a bunch of error messages when I render my site in my Google Console because when Google crawls my site, those files are now gone or moved. AGH! I’m on the verge of simply paying someone to revamp my site or quitting altogether. But I really appreciate that you took the time to leave a helpful comment. :)

        Feliz Ano Novo! Que 2017 seja melhor que 2016.

  19. Eu estava pensando, e se eu fizesse upload das minhas imagens para o Google Blogger e as usasse no meu site WordPress pela opção “Inserir de URL”?
    Alguma sugestão se essa é uma boa ideia ou não?
    Obrigado desde já

  20. Voltei aqui porque estou procurando por plugins que façam upload de uma imagem grande como uma imagem otimizada diretamente para o WordPress. Tenho certeza de que já vi isso em algum lugar aqui no WP Beginner, mas não consigo encontrar.

  21. O Photoshop é definitivamente o melhor, para serviços online, kraken.io e resizeimage.net são boas alternativas ao tinypng.

  22. Alguém mencionou RIOT em um comentário anterior. É o meu aplicativo preferido para minimizar imagens ANTES de fazer o upload delas. A taxa de compressão é quase fenomenal. Desculpem usuários de MAC, mas ele está disponível apenas para Windows.

  23. Olá WPBeginner,

    Eu estaria muito interessado na versão para Windows do Trimage que você aparentemente viu.

    Na página inicial do Trimage, você vê apenas um link pedindo ajuda com a porta para Windows…

  24. Acabei de verificar o site do Trimage e não vi a versão para Windows – apenas várias versões *nix. Por favor, me aponte na direção certa. Muito obrigado – artigo realmente ótimo!

  25. Eu estava me perguntando se havia alguma maneira de reduzir o tamanho das imagens já carregadas em um site? Mudei a forma como faço o upload delas, então, no futuro, todas as minhas imagens serão menores. Mas pensei que talvez fosse útil alterar o tamanho das já carregadas.

  26. Pesquisei muito na web para encontrar uma boa solução para otimizar imagens; mas a maioria delas, a maioria delas não, vamos ver se as ferramentas mencionadas neste post funcionam ou não.

  27. O artigo define PNG como um formato de arquivo não compactado, mas, até onde sei, PNGs padrão usam compressão sem perdas.
    E acho que seria útil mencionar por que você pode escolher um formato em vez de outro para imagens de tom contínuo (por exemplo, uma foto) versus imagens de paleta limitada (por exemplo, um logotipo).

  28. Por que não mencionar o Photoshop Elements, a versão simplificada para uso doméstico do Photoshop? Ele faz 90% das coisas que o Photoshop completo faz, incluindo compressão de imagem 'salvar para web', tudo por menos de US$ 100.

  29. Você recomendaria usar o Flickr para carregar suas imagens e depois copiar o código HTML para o seu site WordPress? O que você sugeriria para blogs de viagem que contêm muitas fotos? Obrigado.

    • Você pode adicionar fotos do Flickr no WordPress simplesmente colando o URL da foto em uma postagem. Normalmente, não recomendaríamos isso, porque as pessoas verão e encontrarão suas fotos no Flickr e talvez nunca tenham a chance de visitar seu site. No entanto, se você sentir que construir uma comunidade em torno de suas fotos no Flickr é mais útil para você, então vá em frente.

      Admin

  30. Você poderia adicionar kraken.io à sua lista. Ele faz a mesma coisa que o Jpegmini, mas também funciona com imagens PNG.

  31. Seu artigo é MUITO oportuno. Acabei de encontrar a necessidade de reduzir centenas de fotos para um showroom de cozinha e banheiro. Comprei o JPEGmini, pois só podia fazer 20 fotos por dia na versão gratuita, mas $19,99 não é nada pela capacidade de arrastar e soltar pastas inteiras no programa e tê-lo compactado em segundos/minutos. Muito obrigado pela ajuda!

  32. Ótimo artigo, no entanto, eu tinha a impressão de que qualquer imagem com texto deveria ser salva como arquivo PNG para melhor nitidez...?

    • PNG will definitely have a higher quality, but most folks won’t be able to tell the difference unless you put them side-by-side. If you can speed up your site with a non-noticeable difference, then why not :)

      Admin

  33. O Lightroom tem várias predefinições para exportar para o Facebook e para a Web – elas comprimem os arquivos de foto suficientemente ou devo ainda recorrer ao Photoshop?

    • O Lightroom é a ferramenta preferida dos fotógrafos; ele permite otimizar suas fotos em lotes e depois exportar o lote para o tamanho de pixel e compressão de sua preferência em vários formatos, incluindo jpeg. Ele também adiciona automaticamente sua mensagem de direitos autorais ao lote, se desejar.

      Não sei sobre processamento em lote no Photoshop, mas eu o uso apenas para manipulação de imagem importante.

      Acho que se você estiver fazendo gráficos ou manipulação pesada, use o Photoshop, mas se estiver usando muitas fotos e apenas quer que elas fiquem com a melhor aparência, use o Lightroom.

  34. Sou um grande defensor de muitos dos produtos que você mencionou. Agora posso adicionar este link aos meus recursos para quando os clientes me fizerem essa pergunta exata. Obrigado, Syed.

  35. Se você mesmo estiver tirando as fotos para o seu site… configure sua câmera para tirar uma foto em 800 x 600 e com menor resolução. Algumas câmeras têm uma configuração de resolução Bom – Melhor – O Melhor… use a configuração “BOM”. Você deve obter uma imagem que carregará rapidamente.

    Se você já tem algumas imagens… dê uma olhada GRATUITAMENTE em… http://www.getpaint.net ….. Eu o uso há anos. Eu pego as fotos ENORMES que os clientes me dão… depois as REDIMENSIONO para 800 x 600. Em seguida, uso a ferramenta de compressão integrada para comprimir a imagem.

    • Eu não recomendaria tirar fotos em baixa resolução.
      Você vai querer tirar suas fotos originais em resoluções mais altas, caso queira usá-las para outra coisa. Além disso, se você tirar fotos em uma resolução mais alta, terá a capacidade de cortar uma área, se desejar.
      Se as fotos forem de resolução mais baixa, você não terá essa opção e ficará preso com o que tirou como original.

      • Tenho que concordar com Steven. Recomendo fortemente tirar imagens de alta resolução em sua câmera. Você terá um arquivo grande com o qual poderá trabalhar. É muito fácil reduzir o tamanho do arquivo de uma imagem de alta resolução, mas impossível fazer o contrário. Ao tirar imagens de alta resolução, você também tem a opção de usá-las para trabalhos de impressão, se a necessidade surgir. Geralmente, eu acabo com a imagem grande e bruta, uma imagem impressa cortada e retocada, e uma imagem menor para trabalho na web.

      • Eu também concordaria sobre tirar fotos em alta resolução. Depois redimensione e comprima para fazer o upload para o seu site. Você sempre terá a foto original de alta resolução para outros usos.

  36. Ótimo artigo, Syed.

    No entanto, eu realmente acho que o Fireworks é o rei quando se trata de otimizar imagens para a web e é muito mais barato que o Photoshop.

    • Sim, se você fizer isso, provavelmente terá um dos melhores resultados de desempenho. No entanto, dependendo da imagem, algumas podem não ficar tão boas, então nesses casos tentamos o Muito Alto. Faça isso caso a caso, mas a maioria das imagens ficará bem.

      Admin

  37. Você discute o uso do Photoshop, que está muito além das necessidades ou do preço da maioria dos blogueiros – por que você não se refere ao Lightroom, que também tem uma excelente opção de exportação de imagem, incluindo uma opção para restringir o tamanho máximo do arquivo, bem como salvar por dimensão ou usando um dpi definido.

    Assim que alguém souber que as telas de computador funcionam a 72 dpi, o resto se torna muito mais fácil, e torna-se surpreendente como é fácil ter um modelo da web entre as opções de exportação sem precisar de nenhum conhecimento aprofundado do que precisa ser feito.

    • Andrew,

      Sim, entendemos que o Photoshop é caro, por isso mencionamos várias outras opções gratuitas. Acabamos de atualizar o artigo para adicionar um link para o GIMP logo abaixo do Photoshop.

      Quanto ao Lightroom, não o mencionamos porque não o usamos. Mesma razão pela qual o Fireworks foi deixado de fora.

      Admin

Deixe uma resposta

Obrigado por escolher deixar um comentário. Por favor, tenha em mente que todos os comentários são moderados de acordo com nossa política de comentários, e seu endereço de e-mail NÃO será publicado. Por favor, NÃO use palavras-chave no campo do nome. Vamos ter uma conversa pessoal e significativa.