{"id":28780,"date":"2022-08-30T13:08:20","date_gmt":"2022-08-30T16:08:20","guid":{"rendered":"\/tutoriais\/?p=28780"},"modified":"2025-12-18T11:44:53","modified_gmt":"2025-12-18T14:44:53","slug":"otimizar-imagens","status":"publish","type":"post","link":"\/br\/tutoriais\/otimizar-imagens\/","title":{"rendered":"Como otimizar imagens: guia completo para melhorar o desempenho do seu site"},"content":{"rendered":"<p class=\"wp-block-paragraph\">Quando se fala em otimizar imagens, em geral, o objetivo &eacute; reduzir o tamanho e tornar as imagens mais eficientes para uso na internet. Isso porque imagens adequadamente otimizadas melhoram os tempos de carregamento de p&aacute;gina, garantindo que o site seja executado sem problemas e melhorando a acessibilidade para os usu&aacute;rios em todos os tipos de dispositivos.<\/p><p class=\"wp-block-paragraph\">Este artigo ser&aacute; seu guia para otimizar o desempenho das imagens do seu site. Exploraremos por que isso &eacute; essencial, apresentaremos t&eacute;cnicas de otimiza&ccedil;&atilde;o e recomendaremos ferramentas que ajudam a simplificar o processo. Para melhorar ainda mais o desempenho do seu site e garantir que ele funcione sem problemas, considere explorar outras&nbsp;ferramentas de otimiza&ccedil;&atilde;o para aumentar a velocidade do site.<\/p><figure class=\"wp-block-image size-large\"><a href=\"https:\/\/assets.hostinger.com\/content\/tutorials\/pdf\/Speed-Up-Your-Website-BR.pdf\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" width=\"1024\" height=\"283\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/12\/eBook_-Speed-Up-your-website-BR.png\/w=1024,h=1024,fit=scale-down\" alt=\"\" class=\"wp-image-30339\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/12\/eBook_-Speed-Up-your-website-BR.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/12\/eBook_-Speed-Up-your-website-BR.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/12\/eBook_-Speed-Up-your-website-BR.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/12\/eBook_-Speed-Up-your-website-BR.png\/w=768,fit=scale-down 768w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/12\/eBook_-Speed-Up-your-website-BR.png\/w=1536,fit=scale-down 1536w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure><p>\n\n\n\n\n\n\n<\/p><p class=\"wp-block-paragraph\"><\/p><p>\n\n\n<div class=\"protip\"><div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                   O Que &eacute; Otimiza&ccedil;&atilde;o de Imagem\n                <\/p>\n            <\/div>\n            <p class=\"protip__content\">A otimiza&ccedil;&atilde;o de imagens &eacute; um processo de modifica&ccedil;&atilde;o dos arquivos de imagem para garantir que elas sejam carregadas rapidamente e exibidas corretamente em todos os dispositivos. Otimizar imagens tamb&eacute;m ajuda a manter o engajamento do usu&aacute;rio, pois envolve um equil&iacute;brio entre taxa de compress&atilde;o, tamanho de arquivo a qualidade. Algumas t&eacute;cnicas de otimiza&ccedil;&atilde;o de imagens incluem redimensionamento, altera&ccedil;&atilde;o de formatos, compacta&ccedil;&atilde;o e ajuste de resolu&ccedil;&atilde;o.<\/p><\/div>\n\n\n\n<\/p><h2 class=\"wp-block-heading\" id=\"h-por-que-e-importante-otimizar-imagens\"><strong>Por Que &Eacute; Importante Otimizar Imagens?<\/strong><\/h2><p class=\"wp-block-paragraph\">Al&eacute;m de ajudar os sites a garantir que seu conte&uacute;do visual seja atraente para os visitantes, aqui est&atilde;o alguns outros benef&iacute;cios da otimiza&ccedil;&atilde;o de imagens.<\/p><h3 class=\"wp-block-heading\"><strong>Experi&ecirc;ncia de Usu&aacute;rio Aprimorada<\/strong><\/h3><p class=\"wp-block-paragraph\">Os sites com imagens otimizadas carregam muito mais r&aacute;pido, o que ajuda a aumentar as taxas de engajamento, a reter os visitantes por per&iacute;odos mais longos e a reduzir as taxas de rejei&ccedil;&atilde;o.<\/p><p class=\"wp-block-paragraph\">Al&eacute;m dos tempos de carregamento, as imagens otimizadas garantem transi&ccedil;&otilde;es mais suaves entre as p&aacute;ginas e menos atrasos quando os usu&aacute;rios interagem com os recursos ou componentes do seu site. Isso contribui para uma experi&ecirc;ncia de navega&ccedil;&atilde;o mais agrad&aacute;vel e menos interrompida.<\/p><p class=\"wp-block-paragraph\">Em suma, um site que carrega rapidamente e funciona sem problemas reflete positivamente em sua marca. &Eacute; prov&aacute;vel que os usu&aacute;rios associem o desempenho do seu site a uma&nbsp;<a href=\"\/br\/tutoriais\/como-criar-uma-marca\/\"><strong>estrat&eacute;gia de marca s&oacute;lida<\/strong><\/a>, melhorando a percep&ccedil;&atilde;o geral da sua empresa.<\/p><h3 class=\"wp-block-heading\"><strong>SEO Aprimorado<\/strong><\/h3><p class=\"wp-block-paragraph\">Uma boa experi&ecirc;ncia do usu&aacute;rio geralmente resulta em um&nbsp;site mais amig&aacute;vel para SEO.<\/p><p class=\"wp-block-paragraph\">Al&eacute;m disso, o uso de textos alternativos descritivos e nomes de arquivos para imagens aumenta as chances de indexa&ccedil;&atilde;o e exibi&ccedil;&atilde;o nos resultados dos mecanismos de busca, especialmente para pesquisas de imagens. Eles ajudam a atrair tr&aacute;fego adicional, pois os usu&aacute;rios que pesquisam imagens espec&iacute;ficas encontram seu conte&uacute;do otimizado com mais facilidade.<\/p><p class=\"wp-block-paragraph\">Vamos dar uma olhada nesta imagem:<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"479\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/detalhes-midia-wp.png\/w=1024,h=1024,fit=scale-down\" alt=\"detalhes de imagem no wordpress\" class=\"wp-image-43968\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/detalhes-midia-wp.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/detalhes-midia-wp.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/detalhes-midia-wp.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/detalhes-midia-wp.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">O tamanho da imagem (de apenas 74 KB), o arquivo nomeado apropriadamente e a descri&ccedil;&atilde;o no texto alternativo (<em>alt text<\/em>) melhoram a otimiza&ccedil;&atilde;o da imagem e, com isso, aprimoram a experi&ecirc;ncia do usu&aacute;rio e o SEO.<\/p><h3 class=\"wp-block-heading\"><strong>Melhor Uso de Recursos<\/strong><\/h3><p class=\"wp-block-paragraph\">A otimiza&ccedil;&atilde;o das imagens reduz os dados transferidos entre o servidor web e o navegador do usu&aacute;rio, o que leva a um menor uso da largura de banda. Esse fator &eacute; especialmente ben&eacute;fico para sites com alto volume de tr&aacute;fego ou um grande n&uacute;mero de imagens.<\/p><p class=\"wp-block-paragraph\">A redu&ccedil;&atilde;o do peso das imagens tamb&eacute;m significa menor consumo de energia durante a transmiss&atilde;o de dados, contribuindo para pr&aacute;ticas mais sustent&aacute;veis do ponto de vista ambiental. Esse aspecto est&aacute; se tornando fundamental &agrave; medida que as pegadas de carbono digitais est&atilde;o sujeitas a uma an&aacute;lise mais minuciosa.<\/p><h2 class=\"wp-block-heading\" id=\"h-9-tecnicas-para-otimizar-imagens-na-web\"><strong>9 T&eacute;cnicas para Otimizar Imagens na Web<\/strong><\/h2><p class=\"wp-block-paragraph\">Ter imagens de qualidade alta demais n&atilde;o &eacute; indicado se elas afetarem negativamente o desempenho do seu site. Vamos descobrir nove dicas sobre como otimizar imagens para uso na internet.<\/p><h3 class=\"wp-block-heading\"><strong>1. Escolha o Formato de Arquivo Certo<\/strong><\/h3><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"1001\" height=\"482\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-17.jpg\/public\" alt=\"ilustra&ccedil;&atilde;o comparando tamanhos e formatos de imagem\" class=\"wp-image-43969\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-17.jpg\/w=1001,fit=scale-down 1001w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-17.jpg\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-17.jpg\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-17.jpg\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1001px) 100vw, 1001px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\"><a href=\"\/br\/tutoriais\/formatos-de-imagem\/\"><strong>A escolha do formato de imagem correto<\/strong><\/a>&nbsp;&eacute; fundamental para a otimiza&ccedil;&atilde;o de imagens, pois cada um deles &eacute; projetado com usos espec&iacute;ficos em mente. Portanto, ao usar o formato apropriado, voc&ecirc; mant&eacute;m um bom equil&iacute;brio entre manter a qualidade da imagem e minimizar o tamanho do arquivo.<\/p><p class=\"wp-block-paragraph\">Aqui est&aacute; uma r&aacute;pida vis&atilde;o geral dos formatos de arquivo de imagem populares para uso em sites:<\/p><ul class=\"wp-block-list\">\n<li><strong>JPEG\/JPG.<\/strong>&nbsp;Ideal para fotografias e reprodu&ccedil;&otilde;es devido ao seu compressor que reduz significativamente o tamanho dos arquivos, ao mesmo tempo que mant&eacute;m uma qualidade razo&aacute;vel.<\/li>\n\n\n\n<li><strong>PNG.<\/strong>&nbsp;Mais adequado para imagens que exigem um plano de fundo transparente, como imagens vetoriais com texto, desenhos de linha e &iacute;cones. Os arquivos PNG mant&ecirc;m uma qualidade superior, mas geralmente t&ecirc;m tamanhos de arquivo maiores em compara&ccedil;&atilde;o com as imagens JPEG.<\/li>\n\n\n\n<li><strong>GIF.<\/strong>&nbsp;Usado principalmente para imagens animadas. Embora n&atilde;o seja ideal para imagens de alta qualidade devido &agrave; paleta de cores limitada, os formatos GIF s&atilde;o perfeitos para armazenar anima&ccedil;&otilde;es simples.<\/li>\n\n\n\n<li><strong>WebP.<\/strong>&nbsp;Um formato moderno adaptado para plataformas online, o que o torna cada vez mais a melhor op&ccedil;&atilde;o para uso na web. O&nbsp;<a href=\"\/br\/tutoriais\/webp\/\"><strong>formato WebP<\/strong><\/a>&nbsp;oferece tamanhos de arquivo menores do que as imagens JPEG e PNG, com qualidade compar&aacute;vel.<\/li>\n<\/ul><h3 class=\"wp-block-heading\"><strong>2. Comprima Seus Arquivos de Imagem<\/strong><\/h3><p class=\"wp-block-paragraph\">O m&eacute;todo mais f&aacute;cil e mais popular para otimizar imagens &eacute; a compacta&ccedil;&atilde;o, que pode ser obtida por meio de duas abordagens: com ou sem perdas.<\/p><p class=\"wp-block-paragraph\"><strong>Compress&atilde;o com Perdas (<em>Lossy<\/em>)<\/strong><\/p><p class=\"wp-block-paragraph\">A compacta&ccedil;&atilde;o com perdas funciona removendo alguns dos dados da imagem, especificamente detalhes que t&ecirc;m menos probabilidade de serem notados. Ela pode reduzir significativamente o tamanho dos arquivos, tornando as imagens muito mais leves e r&aacute;pidas de carregar.<\/p><p class=\"wp-block-paragraph\">Esse m&eacute;todo de compacta&ccedil;&atilde;o de imagens &eacute; ideal para fotos grandes ou imagens detalhadas usadas como planos de fundo ou elementos decorativos, em que uma resolu&ccedil;&atilde;o mais alta n&atilde;o &eacute; essencial. O formato JPEG\/JPG normalmente emprega compress&atilde;o com perdas.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"508\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-24.png\/w=1024,h=1024,fit=scale-down\" alt=\"ilustra&ccedil;&atilde;o comparando imagem jpg comprimida e em resolu&ccedil;&atilde;o completa\" class=\"wp-image-43970\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-24.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-24.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-24.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-24.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Entretanto, lembre-se de n&atilde;o reeditar e salvar imagens em um formato com perdas repetidamente, pois esse processo pode degradar a qualidade delas com o tempo. Por esse motivo, recomendamos ter um backup da imagem original para edi&ccedil;&otilde;es futuras.<\/p><p class=\"wp-block-paragraph\"><strong>Compress&atilde;o sem Perdas (<em>Lossless<\/em>)<\/strong><\/p><p class=\"wp-block-paragraph\">A compacta&ccedil;&atilde;o sem perdas comprime imagens otimizando os pr&oacute;prios dados da imagem. Todos os detalhes originais s&atilde;o preservados e podem ser totalmente restaurados ap&oacute;s a descompress&atilde;o.<\/p><p class=\"wp-block-paragraph\">Apesar da perda m&iacute;nima de qualidade, as redu&ccedil;&otilde;es no tamanho do arquivo geralmente s&atilde;o menos dr&aacute;sticas. Portanto, esse m&eacute;todo de otimiza&ccedil;&atilde;o &eacute; mais adequado para imagens em que a precis&atilde;o e a clareza s&atilde;o fundamentais, como &iacute;cones e logotipos. O formato de imagem PNG &eacute; conhecido por usar esse tipo de compacta&ccedil;&atilde;o.<\/p><p class=\"wp-block-paragraph\">Por fim, vamos analisar algumas dicas pr&aacute;ticas para a compacta&ccedil;&atilde;o de imagens:<\/p><ul class=\"wp-block-list\">\n<li><strong>Ferramentas e software.&nbsp;<\/strong>Utilize um software de edi&ccedil;&atilde;o de imagens que ofere&ccedil;a controle refinado sobre as configura&ccedil;&otilde;es de compacta&ccedil;&atilde;o, como o<strong>&nbsp;GIMP<\/strong>. Essas ferramentas permitem que voc&ecirc; compare visualmente a imagem original e a imagem compactada para garantir que a qualidade seja aceit&aacute;vel.<\/li>\n\n\n\n<li><strong>Compacta&ccedil;&atilde;o automatizada.&nbsp;<\/strong>Cheque com o seu provedor de hospedagem se ele oferece uma ferramenta de servidor que comprima automaticamente as imagens ap&oacute;s o upload. Voc&ecirc; tamb&eacute;m pode instalar um plugin WordPress, como o Smush, para otimizar automaticamente os novos uploads.<\/li>\n\n\n\n<li><strong>Testes.<\/strong>&nbsp;Ap&oacute;s a compacta&ccedil;&atilde;o, tente acessar seu conte&uacute;do em diferentes dispositivos e tamanhos de tela. Esse processo garante que suas imagens mantenham uma qualidade aceit&aacute;vel e carreguem com efici&ecirc;ncia.<\/li>\n<\/ul><h3 class=\"wp-block-heading\"><strong>3. Posicione suas Imagens Estrategicamente<\/strong><\/h3><p class=\"wp-block-paragraph\">Uma otimiza&ccedil;&atilde;o eficaz tamb&eacute;m envolve o posicionamento cuidadoso da imagem.<\/p><p class=\"wp-block-paragraph\">As imagens devem complementar e aprimorar o conte&uacute;do textual, e n&atilde;o apenas servir como uma pausa em longas passagens de texto. Certifique-se de que cada imagem tenha uma conex&atilde;o clara com o material escrito, refor&ccedil;ando a mensagem ou as informa&ccedil;&otilde;es que est&atilde;o sendo transmitidas.<\/p><p class=\"wp-block-paragraph\">Por exemplo, se voc&ecirc; tem uma loja virtual, considere incluir os seguinte na p&aacute;gina de um t&ecirc;nis de corrida tecnol&oacute;gico:<\/p><ul class=\"wp-block-list\">\n<li>Imagens do produto de alta qualidade do cal&ccedil;ado em v&aacute;rios &acirc;ngulos para chamar a aten&ccedil;&atilde;o.<\/li>\n\n\n\n<li>Fotos de estilo de vida mostrando os cal&ccedil;ados em uso, que ajudam os clientes a visualizar o produto no dia a dia.<\/li>\n\n\n\n<li>Fotos em close-up de recursos exclusivos, como a sola ou o cadar&ccedil;o, ao lado da descri&ccedil;&atilde;o do recurso. Esses elementos adicionam um elemento visual aos benef&iacute;cios do produto.<\/li>\n<\/ul><h3 class=\"wp-block-heading\"><strong>4. Considere a Acessibilidade da Imagem<\/strong><\/h3><p class=\"wp-block-paragraph\">A acessibilidade &eacute; outro fator crucial para imagens otimizadas. Os leitores de tela, como o&nbsp;<strong>Narrator&nbsp;<\/strong>e o&nbsp;<strong>JAWS&nbsp;<\/strong>(<strong>Job Access With Speech<\/strong>), n&atilde;o conseguem interpretar o texto dentro das imagens. Portanto, &eacute; essencial fornecer textos alternativos descritivos para todas as imagens do seu site.<\/p><p class=\"wp-block-paragraph\">O chamado&nbsp;<em>alt text<\/em>&nbsp;&eacute; a descri&ccedil;&atilde;o concisa de uma imagem. No&nbsp;<a href=\"\/br\/criador-de-sites\"><strong>Criador de Sites da Hostinger<\/strong><\/a>, voc&ecirc; pode&nbsp;<a href=\"https:\/\/support.hostinger.com\/pt\/articles\/6466460-criador-de-sites-como-adicionar-texto-alternativo-alt-text-as-suas-imagens\" target=\"_blank\" rel=\"noopener\"><strong>adicionar texto alternativo<\/strong><\/a>&nbsp;clicando na imagem desejada. Na janela pop-up&nbsp;<strong>Configura&ccedil;&otilde;es da imagem<\/strong>, preencha o campo&nbsp;<strong>Texto alternativo<\/strong>, assim:<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"648\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/alt-text.png\/w=1024,h=1024,fit=scale-down\" alt=\"editando alt text (texto alternativo) em imagem no criador de sites da hostinger\" class=\"wp-image-42890\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/alt-text.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/alt-text.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/alt-text.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/03\/alt-text.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">J&aacute; no WordPress, voc&ecirc; pode adicionar um texto alternativo &agrave;s suas imagens clicando na imagem e preenchendo o campo&nbsp;<strong>Texto alternativo&nbsp;<\/strong>no painel direito:<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"411\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/alt-text-wordpress.png\/w=1024,h=1024,fit=scale-down\" alt=\"editando texto alternativo no wordpress\" class=\"wp-image-43971\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/alt-text-wordpress.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/alt-text-wordpress.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/alt-text-wordpress.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/alt-text-wordpress.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Al&eacute;m de ajudar os visitantes do site que dependem de tecnologias assistivas, os textos alternativos contribuem para o SEO, pois tornam os elementos visuais mais detect&aacute;veis nos resultados de pesquisa de imagens do Google.<\/p><p class=\"wp-block-paragraph\">O Google usa textos alternativos como parte de seu processo de indexa&ccedil;&atilde;o. Quando voc&ecirc; inclui textos alternativos nas suas imagens, essas descri&ccedil;&otilde;es ajudam o mecanismo de pesquisa a entender do que elas se tratam. Como resultado, &eacute; mais prov&aacute;vel que as imagens apare&ccedil;am em buscas relevantes.<\/p><h3 class=\"wp-block-heading\"><strong>5. Exiba Suas Imagens via CDN<\/strong><\/h3><p class=\"wp-block-paragraph\">Uma&nbsp;<a href=\"\/br\/tutoriais\/o-que-e-cdn\/\"><strong>rede de distribui&ccedil;&atilde;o de conte&uacute;do (CDN)<\/strong><\/a>&nbsp;&eacute; um sistema de servidores distribu&iacute;dos globalmente que fornecem conte&uacute;do, inclusive imagens, aos usu&aacute;rios com base em suas localiza&ccedil;&otilde;es. Ao fornecer imagens a partir de um local mais pr&oacute;ximo do usu&aacute;rio, as CDNs reduzem o tempo de carregamento.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"1024\" height=\"887\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/05\/Como-Funciona-uma-CDN.png\/public\" alt=\"\" class=\"wp-image-36937\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/05\/Como-Funciona-uma-CDN.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/05\/Como-Funciona-uma-CDN.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/05\/Como-Funciona-uma-CDN.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/05\/Como-Funciona-uma-CDN.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\"><a href=\"\/br\/tutoriais\/melhorando-o-desempenho-do-site-usando-cdn\/\"><strong>Integrar uma CDN<\/strong><\/a>&nbsp;em seu site geralmente envolve a altera&ccedil;&atilde;o dos URLs das imagens para que elas apontem para a CDN:<\/p><ol class=\"wp-block-list\">\n<li>Em geral, voc&ecirc; come&ccedil;a inscrevendo-se em um provedor de CDN, como a Cloudflare.<\/li>\n\n\n\n<li>Em seguida, fa&ccedil;a upload do conte&uacute;do est&aacute;tico de seu site, incluindo imagens, para a CDN.<\/li>\n\n\n\n<li>Quando o upload estiver conclu&iacute;do, voc&ecirc; precisar&aacute; atualizar o c&oacute;digo do seu site para que os URLs das imagens apontem para a CDN em vez de para o seu servidor.<\/li>\n<\/ol><p class=\"wp-block-paragraph\">Para obter instru&ccedil;&otilde;es detalhadas, consulte a documenta&ccedil;&atilde;o ou os recursos de suporte do provedor de CDN escolhido.<\/p><p class=\"wp-block-paragraph\">Assine nossos&nbsp;<strong><a href=\"\/br\/hospedagem-de-sites\">planos de Hospedagem Business<\/a><\/strong>, <a href=\"\/br\/hospedagem-cloud\"><strong>Cloud<\/strong><\/a>&nbsp;ou superior para ativar&nbsp;<a href=\"https:\/\/support.hostinger.com\/pt\/articles\/7935917-hostinger-cdn-otimizacao-de-sites\" target=\"_blank\" rel=\"noopener\"><strong>a CDN pr&oacute;pria da Hostinger<\/strong><\/a>. Veja como:<\/p><ol class=\"wp-block-list\">\n<li>No hPanel, navegue at&eacute; a se&ccedil;&atilde;o&nbsp;<strong>Sites&nbsp;<\/strong>e clique na op&ccedil;&atilde;o&nbsp;<strong>Gerenciar&nbsp;<\/strong>ao lado do site desejado.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"272\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/gerenciar-site-hpanel.png\/w=1024,h=1024,fit=scale-down\" alt=\"\" class=\"wp-image-42833\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/gerenciar-site-hpanel.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/gerenciar-site-hpanel.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/gerenciar-site-hpanel.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/gerenciar-site-hpanel.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><ol start=\"2\" class=\"wp-block-list\">\n<li>Na se&ccedil;&atilde;o&nbsp;<strong>Desempenho<\/strong>, procure a op&ccedil;&atilde;o&nbsp;<strong>CDN&nbsp;<\/strong>para ativ&aacute;-la.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"515\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/ativando-cdn-hostinger.png\/w=1024,h=1024,fit=scale-down\" alt=\"ativando cdn pr&oacute;pria da hostinger no hpanel\" class=\"wp-image-42188\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/ativando-cdn-hostinger.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/ativando-cdn-hostinger.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/ativando-cdn-hostinger.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/ativando-cdn-hostinger.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><h3 class=\"wp-block-heading\"><strong>6. Use as Dimens&otilde;es Apropriadas e a Propor&ccedil;&atilde;o Certa<\/strong><\/h3><p class=\"wp-block-paragraph\">As dimens&otilde;es da imagem s&atilde;o a largura e a altura de uma imagem medidas em pixels. Uma imagem pode ter dimens&otilde;es de 1920&times;1080 pixels, em que 1920 &eacute; a largura e 1080 &eacute; a altura.<\/p><p class=\"wp-block-paragraph\">As dimens&otilde;es de uma imagem afetam diretamente sua resolu&ccedil;&atilde;o e seus detalhes, sendo que dimens&otilde;es maiores normalmente oferecem a possibilidade de mais detalhes e clareza. Elas tamb&eacute;m influenciam significativamente o tamanho do arquivo de imagem e a forma como ele aparece em diferentes dispositivos.<\/p><p class=\"wp-block-paragraph\">Consequentemente, as dimens&otilde;es ideais garantem que a imagem se encaixe bem no layout de uma p&aacute;gina sem redimensionamentos desnecess&aacute;rios.<\/p><p class=\"wp-block-paragraph\">Adapte as imagens para resolu&ccedil;&otilde;es comuns de desktop, como 1920&times;1080 pixels, para garantir que elas sejam impactantes e otimizadas para desempenho. Para um excelente desempenho em dispositivos m&oacute;veis, uma largura m&aacute;xima de 800 pixels pode garantir que as imagens sejam claras.<\/p><p class=\"wp-block-paragraph\">A raz&atilde;o de aspecto, por outro lado, &eacute; a propor&ccedil;&atilde;o entre a largura e a altura de uma imagem, independentemente de seu tamanho real em pixels.<\/p><p class=\"wp-block-paragraph\">Expressas como dois n&uacute;meros separados por dois pontos, as raz&otilde;es de aspecto comuns incluem 4:3, 16:9 e 1:1. Elas s&atilde;o essenciais para garantir que as imagens sejam exibidas corretamente, sem distor&ccedil;&atilde;o, em diferentes dispositivos e plataformas. Por exemplo:<\/p><ul class=\"wp-block-list\">\n<li>4:3 &eacute; uma raz&atilde;o de aspecto tradicional, usada em televisores antigos e nos primeiros monitores de computador.<\/li>\n\n\n\n<li>O formato 16:9 &eacute; amplamente usado em televisores de alta defini&ccedil;&atilde;o, monitores widescreen e smartphones.<\/li>\n\n\n\n<li>1:1 &eacute; a propor&ccedil;&atilde;o quadrada, popular em plataformas de rede social para fotos de perfil e determinados tipos de publica&ccedil;&otilde;es.<\/li>\n<\/ul><h3 class=\"wp-block-heading\"><strong>7. Fa&ccedil;a SEO de Imagem<\/strong><\/h3><p class=\"wp-block-paragraph\">O SEO de imagens envolve uma s&eacute;rie de pr&aacute;ticas criadas para tornar suas imagens mais f&aacute;ceis de serem descobertas e para aumentar a visibilidade geral do seu site nos resultados de pesquisa.<\/p><p class=\"wp-block-paragraph\">Al&eacute;m dos textos alternativos, &eacute; essencial nomear os arquivos de imagem de forma descritiva e com palavras-chave. Esses nomes de arquivos fornecem aos mecanismos de pesquisa contexto adicional sobre o seu conte&uacute;do, auxiliando em uma indexa&ccedil;&atilde;o mais precisa. Por exemplo, um arquivo chamado&nbsp;<strong>carro-vermelho-antigo.jpg&nbsp;<\/strong>&eacute; mais informativo para os mecanismos de pesquisa do que&nbsp;<strong>imagem1.jpg<\/strong>.<\/p><p class=\"wp-block-paragraph\">Os dados estruturados, como nome do criador e a licen&ccedil;a de uso da imagem, tamb&eacute;m desempenham uma fun&ccedil;&atilde;o importante na otimiza&ccedil;&atilde;o de imagens.&nbsp;<a href=\"\/br\/tutoriais\/o-que-e-schema\/\">O uso do schema markup<\/a>&nbsp;para dados estruturados ajuda os mecanismos de pesquisa a indexar suas imagens com efici&ecirc;ncia, aumentando as chances de elas aparecerem em&nbsp;<em>rich snippets<\/em>.<\/p><h3 class=\"wp-block-heading\"><strong>8. Utilize Lazy Loading<\/strong><\/h3><p class=\"wp-block-paragraph\">No carregamento lento (lazy loading), as imagens s&atilde;o carregadas somente quando est&atilde;o prestes a aparecer na &aacute;rea vis&iacute;vel do dispositivo. Isso significa que as imagens mais abaixo na p&aacute;gina n&atilde;o ser&atilde;o carregadas at&eacute; que o usu&aacute;rio role at&eacute; onde elas est&atilde;o.<\/p><p class=\"wp-block-paragraph\">Para implementar o carregamento lento em seu site, voc&ecirc; pode utilizar o atributo&nbsp;<strong>HTML loading=&rdquo;lazy&rdquo;<\/strong>. Veja como fazer isso:<\/p><ol class=\"wp-block-list\">\n<li>No painel do WordPress, v&aacute; at&eacute; a p&aacute;gina em que voc&ecirc; deseja ativar o lazy loading. Por exemplo,&nbsp;<strong>Posts&nbsp;<\/strong>&rarr;&nbsp;<strong>Editar<\/strong>.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"731\" height=\"114\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editar-wordpress.png\/public\" alt='bot&atilde;o \"editar\" na p&aacute;gina posts do wordpress' class=\"wp-image-43972\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editar-wordpress.png\/w=731,fit=scale-down 731w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editar-wordpress.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editar-wordpress.png\/w=150,fit=scale-down 150w\" sizes=\"(max-width: 731px) 100vw, 731px\" \/><\/figure>\n<\/div><ol start=\"2\" class=\"wp-block-list\">\n<li>Abra o editor de c&oacute;digo clicando nos&nbsp;<strong>tr&ecirc;s pontos<\/strong>&nbsp;no canto superior direito.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1037\" height=\"689\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editor-codigo.png\/w=1024,h=1024,fit=scale-down\" alt=\"selecionando editor de c&oacute;digo no editor Gutenberg do wordpress\" class=\"wp-image-43973\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editor-codigo.png\/w=1037,fit=scale-down 1037w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editor-codigo.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editor-codigo.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editor-codigo.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/editor-codigo.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1037px) 100vw, 1037px\" \/><\/figure>\n<\/div><ol start=\"3\" class=\"wp-block-list\">\n<li>Pressione&nbsp;<strong>Ctrl + F&nbsp;<\/strong>(ou<strong>&nbsp;Cmd + F<\/strong>, no Mac)<strong>&nbsp;<\/strong>e digite&nbsp;<strong>&lt;img&nbsp;<\/strong>para localizar todas as tags &lt;img&gt;.<\/li>\n<\/ol><ol start=\"4\" class=\"wp-block-list\">\n<li>Adicione&nbsp;<strong>loading=&rdquo;lazy&rdquo;<\/strong>&nbsp;&agrave;s tags &lt;img&gt;. No editor de c&oacute;digo do WordPress, fica assim:<\/li>\n<\/ol><p class=\"wp-block-paragraph\">Para uma solu&ccedil;&atilde;o mais direta, voc&ecirc; pode ativar o lazy loading autom&aacute;tico com um otimizador de imagens como o&nbsp;<strong>Smush<\/strong>. O processo &eacute; simples e geralmente requer ativar um bot&atilde;o.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"494\" height=\"500\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/smush-automatico.png\/public\" alt=\"compress&atilde;o autom&aacute;tica de imagens com o plugin wp-smush\" class=\"wp-image-43975\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/smush-automatico.png\/w=494,fit=scale-down 494w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/smush-automatico.png\/w=296,fit=scale-down 296w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/smush-automatico.png\/w=148,fit=scale-down 148w\" sizes=\"(max-width: 494px) 100vw, 494px\" \/><\/figure>\n<\/div><h3 class=\"wp-block-heading\"><strong>9. Teste e Monitore o Desempenho do Site<\/strong><\/h3><p class=\"wp-block-paragraph\">Testar e monitorar o desempenho do site ap&oacute;s a otimiza&ccedil;&atilde;o das imagens &eacute; fundamental para garantir que seus esfor&ccedil;os resultem em impactos positivos. Utilize ferramentas de teste para obter insights sobre a velocidade do site, os tempos de resposta do servidor e o desempenho geral do site.<\/p><p class=\"wp-block-paragraph\"><strong>O Google PageSpeed Insights<\/strong>, por exemplo, fornece informa&ccedil;&otilde;es sobre o desempenho do seu site em dispositivos m&oacute;veis e desktop. Ele tamb&eacute;m oferece recomenda&ccedil;&otilde;es espec&iacute;ficas para aprimoramento, incluindo a otimiza&ccedil;&atilde;o de imagens.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"387\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/page-speed.png\/w=1024,h=1024,fit=scale-down\" alt=\"site do pagespeed insights para teste de velocidade de site\" class=\"wp-image-28783\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/page-speed.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/page-speed.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/page-speed.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/page-speed.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Depois de executar o teste, procure melhorias nas principais m&eacute;tricas. Por exemplo, a&nbsp;<a href=\"\/br\/tutoriais\/largest-contentful-paint\/\"><strong>pontua&ccedil;&atilde;o da maior tinta de conte&uacute;do (LCP)<\/strong><\/a>&nbsp;indica a rapidez com que o conte&uacute;do principal de uma p&aacute;gina fica vis&iacute;vel para os usu&aacute;rios.<\/p><p class=\"wp-block-paragraph\">Voc&ecirc; tamb&eacute;m pode verificar as recomenda&ccedil;&otilde;es que a ferramenta faz em rela&ccedil;&atilde;o &agrave;s imagens. Elas podem incluir mais compacta&ccedil;&atilde;o, altera&ccedil;&otilde;es de formato ou o uso de formatos modernos, como o WebP.<\/p><p class=\"wp-block-paragraph\">Al&eacute;m disso, o&nbsp;<strong>Google Analytics<\/strong> pode fornecer insights&nbsp;sobre as experi&ecirc;ncias dos visitantes do site antes e depois da otimiza&ccedil;&atilde;o das imagens. Preste aten&ccedil;&atilde;o a m&eacute;tricas como tempo de carregamento da p&aacute;gina, visualiza&ccedil;&otilde;es de p&aacute;gina por sess&atilde;o e taxa de rejei&ccedil;&atilde;o, pois as melhorias na otimiza&ccedil;&atilde;o de imagens podem afet&aacute;-las positivamente.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"492\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2019\/01\/1-google-analytics.png\/w=1024,h=1024,fit=scale-down\" alt=\"p&aacute;gina do google analytics na web\" class=\"wp-image-40608\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2019\/01\/1-google-analytics.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2019\/01\/1-google-analytics.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2019\/01\/1-google-analytics.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2019\/01\/1-google-analytics.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Al&eacute;m disso, tenha em mente que a otimiza&ccedil;&atilde;o de imagens &eacute; um processo cont&iacute;nuo. &Agrave; medida que voc&ecirc; adiciona novo conte&uacute;do ou que as tecnologias da web evoluem, o monitoramento cont&iacute;nuo &eacute; fundamental para manter e melhorar o desempenho.<\/p><p class=\"wp-block-paragraph\">Examine regularmente o desempenho do seu site usando as ferramentas mencionadas acima e mantenha-se a par das novas pr&aacute;ticas recomendadas de otimiza&ccedil;&atilde;o de imagens para implementar novas t&eacute;cnicas assim que elas estiverem dispon&iacute;veis.<\/p><h2 class=\"wp-block-heading\" id=\"h-as-6-melhores-ferramentas-de-otimizacao-de-imagens\"><strong>As 6 Melhores Ferramentas de Otimiza&ccedil;&atilde;o de Imagens<\/strong><\/h2><p class=\"wp-block-paragraph\">Para facilitar o processo de otimiza&ccedil;&atilde;o de imagens, aqui est&aacute; uma r&aacute;pida lista com seis das melhores ferramentas de otimiza&ccedil;&atilde;o que voc&ecirc; pode considerar.<\/p><h3 class=\"wp-block-heading\" id=\"h-1-nbsp-gimp\"><strong>1.&nbsp;<\/strong><a href=\"https:\/\/www.gimp.org\/\" target=\"_blank\" rel=\"noopener\"><strong>GIMP<\/strong><\/a><\/h3><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"346\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-19.png\/w=1024,h=1024,fit=scale-down\" alt=\"site do gimp\" class=\"wp-image-43976\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-19.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-19.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-19.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-19.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">O GIMP, um software de edi&ccedil;&atilde;o de imagens de c&oacute;digo aberto, oferece uma alternativa poderosa e gratuita &agrave;s ferramentas premium, como o Adobe Photoshop. Quando se trata de compacta&ccedil;&atilde;o, o GIMP oferece t&eacute;cnicas avan&ccedil;adas de manipula&ccedil;&atilde;o, incluindo a possibilidade de ajustar os n&iacute;veis de compacta&ccedil;&atilde;o.<\/p><p class=\"wp-block-paragraph\">Para otimizar imagens usando o GIMP, voc&ecirc; pode come&ccedil;ar redimensionando o arquivo de imagem usando o m&eacute;todo de largura e altura fixas. Veja como:<\/p><ol class=\"wp-block-list\">\n<li>Importe sua imagem para o GIMP clicando em&nbsp;<strong>Arquivo&nbsp;<\/strong>&rarr;&nbsp;<strong>Abrir&nbsp;<\/strong>e escolha uma imagem de seu computador.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"643\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-6.png\/w=1024,h=1024,fit=scale-down\" alt=\"otimizando imagens no GIMP\" class=\"wp-image-43977\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-6.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-6.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-6.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-6.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><ol start=\"2\" class=\"wp-block-list\">\n<li>V&aacute; at&eacute;&nbsp;<strong>Imagem&nbsp;<\/strong>&rarr;&nbsp;<strong>Redimensionar imagem&nbsp;<\/strong>e ajuste a largura e a altura e<strong>amanho da imagem<\/strong>. Por exemplo, alteramos a largura para 1920, e a altura se ajusta automaticamente. Em seguida, clique em&nbsp;<strong>Redimensionar<\/strong>.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"445\" height=\"455\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-2.png\/public\" alt=\"otimizando imagens no GIMP\" class=\"wp-image-43980\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-2.png\/w=445,fit=scale-down 445w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-2.png\/w=293,fit=scale-down 293w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-2.png\/w=147,fit=scale-down 147w\" sizes=\"(max-width: 445px) 100vw, 445px\" \/><\/figure>\n<\/div><ol start=\"3\" class=\"wp-block-list\">\n<li>Aguarde at&eacute; que o processo seja conclu&iacute;do, e sua imagem ser&aacute; redimensionada no editor da seguinte forma:<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1140\" height=\"710\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-32.png\/w=1024,h=1024,fit=scale-down\" alt=\"otimizando imagens no GIMP\" class=\"wp-image-43979\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-32.png\/w=1140,fit=scale-down 1140w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-32.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-32.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-32.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-32.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1140px) 100vw, 1140px\" \/><\/figure>\n<\/div><ol start=\"4\" class=\"wp-block-list\">\n<li>Exporte a imagem redimensionada acessando&nbsp;<strong>Arquivo&nbsp;<\/strong>&rarr;&nbsp;<strong>Exportar Como<\/strong>.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"840\" height=\"545\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-15.png\/public\" alt=\"otimizando imagens no GIMP\" class=\"wp-image-43978\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-15.png\/w=840,fit=scale-down 840w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-15.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-15.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-15.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 840px) 100vw, 840px\" \/><\/figure>\n<\/div><ol start=\"5\" class=\"wp-block-list\">\n<li>Renomeie a imagem e digite o formato de sua prefer&ecirc;ncia ao exportar. Por exemplo, aqui, renomeamos a imagem como&nbsp;<strong>smoky-quartz-compressed.webp<\/strong>.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"945\" height=\"700\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-30.png\/public\" alt=\"otimizando imagens no GIMP\" class=\"wp-image-43982\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-30.png\/w=945,fit=scale-down 945w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-30.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-30.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-30.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 945px) 100vw, 945px\" \/><\/figure>\n<\/div><ol start=\"6\" class=\"wp-block-list\">\n<li>Ajuste o n&iacute;vel de compacta&ccedil;&atilde;o na se&ccedil;&atilde;o&nbsp;<strong>Qualidade da imagem<\/strong>, por exemplo, 80. Clique em&nbsp;<strong>Exportar<\/strong>.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"340\" height=\"475\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-11.png\/public\" alt=\"otimizando imagens no GIMP\" class=\"wp-image-43981\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-11.png\/w=340,fit=scale-down 340w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-11.png\/w=215,fit=scale-down 215w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-11.png\/w=107,fit=scale-down 107w\" sizes=\"(max-width: 340px) 100vw, 340px\" \/><\/figure>\n<\/div><ol start=\"7\" class=\"wp-block-list\">\n<li>Agora, vamos verificar o resultado. V&aacute; para a pasta do seu computador local onde salvou as imagens de antes e depois. Em seguida, compare os tamanhos.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1085\" height=\"165\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-5.png\/w=1024,h=1024,fit=scale-down\" alt=\"compara&ccedil;&atilde;o entre imagem original e imagem webp comprimida pelo gimp\" class=\"wp-image-43992\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-5.png\/w=1085,fit=scale-down 1085w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-5.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-5.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-5.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-5.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1085px) 100vw, 1085px\" \/><\/figure>\n<\/div><h3 class=\"wp-block-heading\" id=\"h-2-nbsp-kraken-io\"><strong>2.&nbsp;<\/strong><a href=\"http:\/\/kraken.io\/\" target=\"_blank\" rel=\"noopener\"><strong>Kraken.io<\/strong><\/a><\/h3><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"500\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-8.png\/w=1024,h=1024,fit=scale-down\" alt=\"\" class=\"wp-image-43985\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-8.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-8.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-8.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-8.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">O&nbsp;Kraken.io&nbsp;&eacute; uma plataforma de otimiza&ccedil;&atilde;o de imagens que permite compactar imagens PNG, GIF, GIF animado, SVG e JPEG. Ele usa algoritmos avan&ccedil;ados para obter o equil&iacute;brio perfeito entre a qualidade e a compacta&ccedil;&atilde;o da imagem.<\/p><p class=\"wp-block-paragraph\">A plataforma oferece uma compara&ccedil;&atilde;o lado a lado das imagens originais e otimizadas, garantindo que a compacta&ccedil;&atilde;o mantenha uma qualidade de imagem aceit&aacute;vel.<\/p><p class=\"wp-block-paragraph\">A ferramenta de compacta&ccedil;&atilde;o gratuita do&nbsp;Kraken.io&nbsp;tem um limite de tamanho de arquivo de 1 MB. Para compactar imagens, selecione seu modo de otimiza&ccedil;&atilde;o preferido &ndash;&nbsp;<strong>com perdas<\/strong>,&nbsp;<strong>sem perdas&nbsp;<\/strong>ou&nbsp;<strong>expert<\/strong>. Em seguida, carregue as imagens ou arraste e solte-as na interface de compacta&ccedil;&atilde;o da plataforma.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1290\" height=\"685\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-26.png\/w=1024,h=1024,fit=scale-down\" alt=\"usando o kraken.io para otimizar imagens\" class=\"wp-image-43986\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-26.png\/w=1290,fit=scale-down 1290w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-26.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-26.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-26.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-26.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1290px) 100vw, 1290px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Fa&ccedil;a upgrade para a vers&atilde;o premium (a partir de&nbsp;<strong>US$ 5\/m&ecirc;s<\/strong>) para desbloquear mais recursos, como compacta&ccedil;&atilde;o em massa e redimensionamento de imagens.<\/p><h3 class=\"wp-block-heading\" id=\"h-3-nbsp-imagify\"><strong>3.&nbsp;<\/strong><a href=\"https:\/\/imagify.io\/\" target=\"_blank\" rel=\"noopener\"><strong>Imagify<\/strong><\/a><\/h3><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"520\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-31.png\/w=1024,h=1024,fit=scale-down\" alt=\"otimiza&ccedil;&atilde;o de imagens do imagify\" class=\"wp-image-43987\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-31.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-31.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-31.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-31.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">O Imagify, compat&iacute;vel com o formato WebP, oferece uma variedade de op&ccedil;&otilde;es de compacta&ccedil;&atilde;o, incluindo modos com e sem perdas e ultracompacta&ccedil;&atilde;o.<\/p><p class=\"wp-block-paragraph\">A preserva&ccedil;&atilde;o dos dados EXIF &eacute; um recurso exclusivo. Ele ret&eacute;m os metadados da imagem, como as configura&ccedil;&otilde;es da c&acirc;mera, a data e a hora da captura e o local onde a fotografia foi tirada, ap&oacute;s a compacta&ccedil;&atilde;o.<\/p><p class=\"wp-block-paragraph\">As imagens rasterizadas, como aquelas em JPEG,&nbsp;<a href=\"https:\/\/www.adobe.com\/br\/creativecloud\/file-types\/image\/raster\/tiff-file.html#:~:text=TIFF%2C%20que%20significa%20Tag%20Image,raster%20e%20informa%C3%A7%C3%B5es%20de%20imagem.\" target=\"_blank\" rel=\"noopener\"><strong>TIFF<\/strong><\/a>&nbsp;e alguns formatos de arquivo&nbsp;<a href=\"https:\/\/www.adobe.com\/br\/creativecloud\/file-types\/image\/raw.html\" target=\"_blank\" rel=\"noopener\"><strong>RAW<\/strong><\/a>, podem conter dados EXIF. Ao preservar os dados EXIF, o Imagify permite que voc&ecirc; acesse os metadados da imagem para fins de p&oacute;s-processamento, arquivamento ou an&aacute;lise de t&eacute;cnicas fotogr&aacute;ficas.<\/p><p class=\"wp-block-paragraph\">O plano gratuito da Imagify permite compactar at&eacute; 200 imagens por m&ecirc;s, mas limita o tamanho do arquivo a 2 MB. Adquira o plano premium (a partir de&nbsp;<strong>US$ 5,99\/m&ecirc;s<\/strong>) para desbloquear op&ccedil;&otilde;es de backup de seus arquivos, tamanho de upload ilimitado e capacidade de processamento para cerca de 5.000 imagens, entre outros recursos.<\/p><h3 class=\"wp-block-heading\" id=\"h-4-nbsp-smush\"><strong>4.&nbsp;<\/strong><a href=\"https:\/\/br.wordpress.org\/plugins\/wp-smushit\/\" target=\"_blank\" rel=\"noopener\"><strong>Smush<\/strong><\/a><\/h3><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"322\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-28.png\/w=1024,h=1024,fit=scale-down\" alt=\"plugin wp-smush para wordpress\" class=\"wp-image-43988\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-28.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-28.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-28.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-28.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">O Smush &eacute; uma das ferramentas de otimiza&ccedil;&atilde;o de imagens mais usadas pelos propriet&aacute;rios de sites WordPress. Seu recurso de destaque &eacute; a compacta&ccedil;&atilde;o em massa, que permite otimizar todas as suas imagens ao mesmo tempo.<\/p><p class=\"wp-block-paragraph\">Depois de ativar o plugin, voc&ecirc; poder&aacute; ver a detec&ccedil;&atilde;o em massa de suas imagens n&atilde;o otimizadas. Veja como proceder:<\/p><ol class=\"wp-block-list\">\n<li>Clique no bot&atilde;o&nbsp;<strong>Smush em Massa.<\/strong><\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"809\" height=\"351\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/smush-massa.png\/public\" alt=\"recurso smush em massa do plugin wp-smush para wordpress\" class=\"wp-image-43993\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/smush-massa.png\/w=809,fit=scale-down 809w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/smush-massa.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/smush-massa.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/smush-massa.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 809px) 100vw, 809px\" \/><\/figure>\n<\/div><ol start=\"2\" class=\"wp-block-list\">\n<li>&Agrave;s vezes, o plugin pode solicitar uma nova verifica&ccedil;&atilde;o. Pressione o bot&atilde;o&nbsp;<strong>Re-check Images&nbsp;<\/strong>para iniciar o processo e, em seguida, clique em&nbsp;<strong>Resume Bulk Smush<\/strong>.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1250\" height=\"180\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-4.png\/w=1024,h=1024,fit=scale-down\" alt=\"\" class=\"wp-image-43995\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-4.png\/w=1250,fit=scale-down 1250w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-4.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-4.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-4.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-4.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1250px) 100vw, 1250px\" \/><\/figure>\n<\/div><ol start=\"3\" class=\"wp-block-list\">\n<li>Quando a otimiza&ccedil;&atilde;o em massa estiver conclu&iacute;da, voc&ecirc; receber&aacute; um relat&oacute;rio como este:<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1160\" height=\"445\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-21.png\/w=1024,h=1024,fit=scale-down\" alt=\"smush em massa no plugin wp-smush\" class=\"wp-image-43994\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-21.png\/w=1160,fit=scale-down 1160w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-21.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-21.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-21.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-21.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1160px) 100vw, 1160px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Embora a vers&atilde;o gratuita do Smush ofere&ccedil;a uma boa gama de recursos, a vers&atilde;o paga oferece op&ccedil;&otilde;es mais avan&ccedil;adas. Os planos do<strong>&nbsp;Smush Pro&nbsp;<\/strong>(a partir de&nbsp;<strong>US$ 3\/m&ecirc;s<\/strong>) incluem compacta&ccedil;&atilde;o ilimitada, convers&atilde;o de imagens WebP e uploads de arquivos de imagem de tamanho ilimitado.<\/p><h3 class=\"wp-block-heading\" id=\"h-5-nbsp-tinypng\"><strong>5.&nbsp;<\/strong><a href=\"https:\/\/br.wordpress.org\/plugins\/tiny-compress-images\/\" target=\"_blank\" rel=\"noopener\"><strong>TinyPNG<\/strong><\/a><\/h3><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"328\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-12.png\/w=1024,h=1024,fit=scale-down\" alt=\"plugin tinypng\" class=\"wp-image-43989\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-12.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-12.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-12.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-12.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">O TinyPNG oferece t&eacute;cnicas inteligentes de compacta&ccedil;&atilde;o com perdas para reduzir significativamente os arquivos JPEG e PNG. O grande diferencial aqui &eacute; sua capacidade de diminuir seletivamente o n&uacute;mero de cores na imagem sem afetar significativamente a qualidade.<\/p><p class=\"wp-block-paragraph\">Com o TinyPNG, voc&ecirc; pode carregar, compactar ou redimensionar imagens no site da plataforma ou por meio de plugins dispon&iacute;veis em v&aacute;rios sistemas de gerenciamento de conte&uacute;do. O plugin do WordPress, por exemplo, pode automatizar a otimiza&ccedil;&atilde;o de imagens logo ap&oacute;s o upload.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1490\" height=\"790\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-7.png\/w=1024,h=1024,fit=scale-down\" alt=\"usando o plugin tinypng no wordpress\" class=\"wp-image-43990\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-7.png\/w=1490,fit=scale-down 1490w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-7.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-7.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-7.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-7.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1490px) 100vw, 1490px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Apesar de seu nome, o TinyPNG funciona em v&aacute;rios formatos, incluindo imagens WebP, JPEG\/JPG e PNG. A ferramenta tamb&eacute;m oferece suporte &agrave; transpar&ecirc;ncia em PNGs, o que &eacute; particularmente &uacute;til para ilustra&ccedil;&otilde;es e elementos gr&aacute;ficos.<\/p><p class=\"wp-block-paragraph\">Embora o TinyPNG ofere&ccedil;a uma vers&atilde;o gratuita, h&aacute; limita&ccedil;&otilde;es quanto ao tamanho do arquivo e ao n&uacute;mero de imagens que podem ser compactadas de uma s&oacute; vez. A vers&atilde;o premium (a partir de&nbsp;<strong>US$ 39\/ano<\/strong>) vem com mais cr&eacute;ditos, suporte para tamanhos de imagem maiores e acesso &agrave; API para fluxos de trabalho automatizados.<\/p><h3 class=\"wp-block-heading\" id=\"h-6-nbsp-imagerecycle\"><strong>6.&nbsp;<\/strong><a href=\"https:\/\/www.imagerecycle.com\/\" target=\"_blank\" rel=\"noopener\"><strong>ImageRecycle<\/strong><\/a><\/h3><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1370\" height=\"830\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-10.png\/w=1024,h=1024,fit=scale-down\" alt=\"plataforma de otimiza&ccedil;&atilde;o imagerecycle\" class=\"wp-image-43991\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-10.png\/w=1370,fit=scale-down 1370w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-10.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-10.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-10.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2022\/08\/otimizar-imagens-10.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1370px) 100vw, 1370px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">O ImageRecycle &eacute; compat&iacute;vel com v&aacute;rios&nbsp;formatos de imagem, incluindo JPEG, PNG, GIF e SVG, al&eacute;m de documentos PDF.<\/p><p class=\"wp-block-paragraph\">Utilize essa ferramenta para realizar uma varredura no site e obter insights sobre imagens n&atilde;o otimizadas. Tudo o que voc&ecirc; precisa fazer &eacute; inserir o endere&ccedil;o de seu site e seu endere&ccedil;o de e-mail. O otimizador de imagens enviar&aacute; um relat&oacute;rio gratuito para seu e-mail.<\/p><figure class=\"wp-block-image size-large\"><a href=\"\/br\/\" target=\"_blank\" rel=\"noreferrer noopener\"><img decoding=\"async\" width=\"1024\" height=\"300\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=1024,h=1024,fit=scale-down\" alt=\"\" class=\"wp-image-32927\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=768,fit=scale-down 768w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2023\/02\/BR-Web-hosting_in-text-banner.png\/w=1536,fit=scale-down 1536w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure><h2 class=\"wp-block-heading\" id=\"h-conclusao\"><strong>Conclus&atilde;o<\/strong><\/h2><p class=\"wp-block-paragraph\">Otimizar imagens &eacute; fundamental para melhorar o desempenho de seu site. Com internautas cada vez mais exigentes e mecanismos de pesquisa que priorizam sites de carregamento r&aacute;pido, a otimiza&ccedil;&atilde;o de imagens &eacute; uma habilidade essencial em sua lista de tarefas de manuten&ccedil;&atilde;o.<\/p><p class=\"wp-block-paragraph\">Aqui est&aacute; uma recapitula&ccedil;&atilde;o das estrat&eacute;gias de otimiza&ccedil;&atilde;o de imagens abordadas neste artigo:<\/p><ol class=\"wp-block-list\">\n<li><strong>Escolha o formato apropriado.&nbsp;<\/strong>Selecione JPEG para fotos, PNG para imagens que exigem transpar&ecirc;ncia, GIF para anima&ccedil;&otilde;es e WebP para obter um equil&iacute;brio entre qualidade e tamanho da imagem.<\/li>\n\n\n\n<li><strong>Comprima suas imagens.<\/strong>&nbsp;Otimize as imagens usando a compacta&ccedil;&atilde;o com perdas quando a qualidade perfeita n&atilde;o for crucial e a compacta&ccedil;&atilde;o sem perdas para imagens em que os detalhes s&atilde;o fundamentais.<\/li>\n\n\n\n<li><strong>Posicione sua imagem estrategicamente.<\/strong>&nbsp;Posicione as imagens estrategicamente para complementar o texto de forma eficaz sem causar distra&ccedil;&otilde;es.<\/li>\n\n\n\n<li><strong>Considere a acessibilidade de suas imagens.<\/strong>&nbsp;Certifique-se de que todas as imagens tenham textos alternativos descritivos para ajudar os visitantes que dependem de tecnologias assistivas e melhorar o SEO.<\/li>\n\n\n\n<li><strong>Sirva imagens via CDN.<\/strong>&nbsp;Use uma rede de fornecimento de conte&uacute;do para fornecer arquivos de m&iacute;dia, inclusive imagens, mais rapidamente aos usu&aacute;rios. Ela funciona carregando suas imagens a partir de servidores mais pr&oacute;ximos do local do usu&aacute;rio.<\/li>\n\n\n\n<li><strong>Use as dimens&otilde;es e a propor&ccedil;&atilde;o corretas da imagem.&nbsp;<\/strong>Adapte a largura e a altura da imagem para garantir a exibi&ccedil;&atilde;o adequada em todos os dispositivos.<\/li>\n\n\n\n<li><strong>Implemente o SEO de imagens.<\/strong>&nbsp;Cuide da qualidade da imagem, do texto alternativo, do nome do arquivo e dos dados estruturados para otimizar as imagens em pesquisas de texto e imagens.<\/li>\n\n\n\n<li><strong>Utilize o carregamento lento.&nbsp;<\/strong>Defina as imagens para serem carregadas somente quando estiverem prestes a entrar na janela de visualiza&ccedil;&atilde;o, reduzindo o tempo de carregamento inicial da p&aacute;gina.<\/li>\n\n\n\n<li><strong>Teste e monitore o desempenho do site.<\/strong>&nbsp;Preste aten&ccedil;&atilde;o a m&eacute;tricas como a pontua&ccedil;&atilde;o LCP e os dados do Google Analytics para melhorar a experi&ecirc;ncia do usu&aacute;rio.<\/li>\n<\/ol><p class=\"wp-block-paragraph\">Lembre-se de que a otimiza&ccedil;&atilde;o de imagens n&atilde;o &eacute; uma tarefa &uacute;nica. O monitoramento e o refinamento cont&iacute;nuos das imagens do seu site garantir&atilde;o que ele permane&ccedil;a competitivo, envolvente e alinhado com as pr&aacute;ticas recomendadas de desempenho online. Boa sorte!<\/p><h2 class=\"wp-block-heading\" id=\"h-como-otimizar-imagens-perguntas-frequentes\"><strong>Como Otimizar Imagens: Perguntas Frequentes<\/strong><\/h2><p class=\"wp-block-paragraph\">Abaixo, vamos responder a quatro perguntas frequentes sobre otimiza&ccedil;&atilde;o de imagens.<\/p><div id=\"rank-math-faq\" class=\"rank-math-block\">\n<div class=\"rank-math-list \">\n<div id=\"faq-question-694413651a4cc\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>Por Que Devo Otimizar Imagens no Meu Site?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>A otimiza&ccedil;&atilde;o de imagens &eacute; fundamental para melhorar o tempo de carregamento do site e aprimorar a experi&ecirc;ncia do usu&aacute;rio.<\/p>\n\n<\/div>\n<\/div>\n<div id=\"faq-question-694413651a4cf\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>Qual &eacute; a Import&acirc;ncia da Otimiza&ccedil;&atilde;o de Imagens para SEO?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>Imagens otimizadas contribuem para um tempo de carregamento mais r&aacute;pido da p&aacute;gina, afetando positivamente a classifica&ccedil;&atilde;o do seu site. As imagens com nomea&ccedil;&atilde;o e textos alternativos adequados tamb&eacute;m podem gerar uma classifica&ccedil;&atilde;o mais alta nos resultados de pesquisa de imagens, trazendo mais tr&aacute;fego para o seu site.<\/p>\n\n<\/div>\n<\/div>\n<div id=\"faq-question-694413651a4d0\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>Como Otimizar uma Imagem sem Perder Qualidade?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>Para otimizar uma imagem sem perder a qualidade, use t&eacute;cnicas de otimiza&ccedil;&atilde;o sem perdas com ferramentas como&nbsp;<strong>GIMP<\/strong>,&nbsp;<strong>Kraken.io&nbsp;<\/strong>ou&nbsp;<strong>Imagify<\/strong>. Voc&ecirc; tamb&eacute;m pode redimensionar as imagens para as dimens&otilde;es exatas necess&aacute;rias em suas p&aacute;ginas, pois imagens menores naturalmente t&ecirc;m tamanhos de arquivo menores.<\/p>\n\n<\/div>\n<\/div>\n<div id=\"faq-question-694413651a4d1\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>Qual &eacute; o Melhor Formato de Imagem para Otimiza&ccedil;&atilde;o?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>Fotografias e imagens complexas podem usar o formato JPEG. Para imagens que exigem transpar&ecirc;ncia ou detalhes exatos, o PNG &eacute; o mais indicado. As imagens WebP s&atilde;o populares entre os propriet&aacute;rios de sites, pois t&ecirc;m tamanhos de arquivo menores do que JPEG e PNG com n&iacute;veis de qualidade de compacta&ccedil;&atilde;o compar&aacute;veis.<\/p>\n\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Quando se fala em otimizar imagens, em geral, o objetivo &eacute; reduzir o tamanho e tornar as imagens mais eficientes para uso na internet. Isso porque imagens adequadamente otimizadas melhoram os tempos de carregamento de p&aacute;gina, garantindo que o site seja executado sem problemas e melhorando a acessibilidade para os usu&aacute;rios em todos os tipos [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/br\/tutoriais\/otimizar-imagens\/\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":326,"featured_media":28863,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"rank_math_title":"Como Otimizar Imagens e Aumentar o Desempenho do Seu Site","rank_math_description":"N\u00e3o importa qual o tipo do seu site \u2013 imagens e sites otimizados s\u00e3o essenciais para melhorar a experi\u00eancia do usu\u00e1rio e o desempenho geral.","rank_math_focus_keyword":"otimizar imagens","footnotes":""},"categories":[8017,8067],"tags":[6932,7422,5321],"class_list":["post-28780","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-marketing-digital","category-seo","tag-melhorar-desempenho-de-site-wordpress","tag-otimizacao-de-imagens","tag-otimizacao-de-site"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/tutorials\/how-to-optimize-images\/","default":1},{"locale":"pt-BR","link":"https:\/\/www.hostinger.com\/br\/tutoriais\/otimizar-imagens\/","default":0},{"locale":"fr-FR","link":"https:\/\/www.hostinger.com\/fr\/tutoriels\/optimisation-des-images\/","default":0},{"locale":"es-ES","link":"https:\/\/www.hostinger.com\/es\/tutoriales\/optimizar-imagenes\/","default":0},{"locale":"de-DE","link":"https:\/\/www.hostinger.com\/de\/tutorials\/bilder-optimieren\/","default":0},{"locale":"en-PH","link":"https:\/\/www.hostinger.com\/ph\/tutorials\/how-to-optimize-images\/","default":0},{"locale":"en-MY","link":"https:\/\/www.hostinger.com\/my\/tutorials\/how-to-optimize-images\/","default":0},{"locale":"en-GB","link":"https:\/\/www.hostinger.com\/uk\/tutorials\/how-to-optimize-images\/","default":0},{"locale":"en-IN","link":"https:\/\/www.hostinger.com\/in\/tutorials\/how-to-optimize-images\/","default":0},{"locale":"en-CA","link":"https:\/\/www.hostinger.com\/ca\/tutorials\/how-to-optimize-images\/","default":0},{"locale":"en-AU","link":"https:\/\/www.hostinger.com\/au\/tutorials\/how-to-optimize-images\/","default":0},{"locale":"en-NG","link":"https:\/\/www.hostinger.com\/ng\/tutorials\/how-to-optimize-images\/","default":0},{"locale":"es-AR","link":"https:\/\/www.hostinger.com\/ar\/tutoriales\/optimizar-imagenes\/","default":0},{"locale":"es-MX","link":"https:\/\/www.hostinger.com\/mx\/tutoriales\/optimizar-imagenes\/","default":0},{"locale":"es-CO","link":"https:\/\/www.hostinger.com\/co\/tutoriales\/optimizar-imagenes\/","default":0},{"locale":"pt-PT","link":"https:\/\/www.hostinger.com\/pt\/tutoriais\/otimizar-imagens\/","default":0}],"acf":[],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/28780","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/users\/326"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/comments?post=28780"}],"version-history":[{"count":41,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/28780\/revisions"}],"predecessor-version":[{"id":51724,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/28780\/revisions\/51724"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/media\/28863"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/media?parent=28780"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/categories?post=28780"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/tags?post=28780"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}