Como Otimizar Imagens para Seu Site
Como fotógrafo, o que de mais precioso você tem no seu coração, obviamente depois do amor da sua mãe? Certíssimo, suas fotos. O mesmo pode ser dito para designers, artistas e, de uma forma geral, para qualquer pessoa que dedica uma parte considerável do seu tempo e energia criando imagens lindas e significativas. Uma vez que você tem tanto orgulho de suas fotos, é absolutamente natural que você queira mostrá-las para todo mundo. Dessa forma, faça o upload das fotos para seu site de fotografia que já está pronto para ser generosamente compartilhado com seus clientes, parceiros e amigos.
Problema: com frequência as fotos na tela não são exatamente iguais às que você fotografou. Ao que tudo indica, muitos pixels inocentes foram sacrificados ao longo do caminho. Há grandes chances de surgir outro problema para aqueles pixels sortudos que conseguiram sobreviver: seus arquivos são tão pesados que seu site vai levar muito tempo para carregar e muitos de seus visitantes (e talvez clientes em potencial) simplesmente desistem e vão embora. Esse é o grande dilema da otimização de imagens na era da internet: como encontrar o equilíbrio certo que preserve a melhor qualidade possível, sem prejudicar a velocidade ou desempenho do seu site?
Vamos descobrir quais os erros mais comuns cometidos por muitos fotógrafos e adotar algumas práticas excelentes que você já pode começar a usar hoje mesmo.
Por que a otimização da imagem é um problema tão grande?
Alguma vez você já se perguntou o que acontece dentro do seu computador enquanto você está surfando na internet? Basicamente, o navegador do seu desktop ou dispositivo móvel precisa fazer o download de cada arquivo de um site de forma a ser mostrado na tela. O que significa que quanto maiores os arquivos que você fez upload, menor será a velocidade geral do seu site. O desempenho lento de um site tem consequências devastadoras tanto para o SEO (o Google adora páginas que carregam rápido) como para a experiência de usuário (UX) dos seus visitantes. É sempre bom ter em mente que a maioria dos internautas não tem paciência para esperar uma página que leva muito tempo para carregar, mesmo que haja uma justificativa para isso!
Há um outro desafio derivado dos dispositivos móveis, que são responsáveis por cerca de 50% do tráfego na internet hoje em dia. A largura de banda para estes dispositivos em geral é menor que as redes a cabo normalmente usadas em casa e isso dificulta para que suas fotos cheguem corretamente nas telas dos seus visitantes. Há uma questão geral que você precisa levar em consideração: os problemas que surgem com imagens em alta resolução enquanto tenta manter o desempenho do seu site.
Quanto é possível reduzir?
Hoje em dia, há duas técnicas principais para otimizar as imagens dos sites. A primeira é chamada compressão. O princípio é relativamente simples apesar da matemática ser extremamente complexa. Os algoritmos do software detectam as informações redundantes em suas imagens, que são então eliminadas dos arquivos. É assim que funcionam muitos formatos de compressão – o mais famoso de todos é o JPEG. Como consequência desta dieta de pixels, o tamanho das suas fotos será drasticamente reduzido. Seu site vai carregar muito mais rápido se você adotar esta compressão para cada uma das suas imagens e se usar uma forte taxa de compressão (“Qualidade JPEG”).
Mas o problema (e é bem significativo) é que a compressão resulta na perda de dados valiosos. Esta perda é geralmente perceptível nos pequenos detalhes, um granulado que aparece ou uma renderização menos sofisticada, mas a maioria dos usuários da internet tolera isso muito bem. Sim, a maioria dos usuários da internet tolera, mas você não. Como fotógrafo, você tem pouquíssima tolerância com qualquer coisa que possa alterar, mesmo que seja muito pouco, a qualidade das suas criações. Afinal, por que levar tanto tempo e quebrar a cabeça para conseguir a foto perfeita, se o primeiro algoritmo de compressão que aparecer já estraga tudo em um microssegundo? É por isso que este método pode ser usado com toda a segurança para muitos outros sites (hotéis, blogs, lojas virtuais, etc.), mas não é recomendado para seu portfólio virtual.
Tamanho realmente importa?
A maioria das câmeras, hoje em dia, permite fotografar com uma resolução muito alta. Como pode ser visto na tabela abaixo, até câmeras simples podem produzir, sem qualquer esforço, fotos de 4290 x 2800 px. Isto é um tremendo recurso para a sua arte, mas também representa um problema para seu web design uma vez que imagens com uma resolução maior significam arquivos maiores para fazer upload. É aqui que entra o redimensionamento (o segundo método de otimização). Basicamente, significa reduzir o tamanho das suas fotos quase sem afetar a qualidade. Seus visitantes vão ver exatamente a mesma foto em suas telas, só que talvez precisem usar um microscópio para poder enxergar.
Esta é uma técnica inteligente, mas não totalmente convincente. De fato, quem pode dizer qual a solução ideal para a internet? Cada navegador, em cada desktop ou smartphone mostra as mesmas imagens em tamanhos diferentes. Mais ainda, algumas imagens já devem, pela sua natureza, ser mostradas num formato maior simplesmente devido ao assunto da foto (pense numa paisagem de tirar o fôlego), à técnica (macro fotografia) ou à composição artística. Por último, mas não menos importante, a resolução apropriada para seu site de fotografia não necessariamente atende aos critérios do Facebook e do Instagram e vice-versa.
Resumindo, redimensionar as suas imagens pode ser uma boa opção se você precisa delas para um propósito muito específico e está certo que não vai precisar mostrá-las em telas grandes. Além disso, esta técnica não vai resolver o seu principal problema existencial: como combinar qualidade com desempenho.
Qual a melhor prática?
A mesma ideia que está por trás de qualquer bom relacionamento ou da sua dieta pode ser espelhada no seu site: tudo gira em torno de como encontrar o equilíbrio certo. Por um lado, você é um artista cujo objetivo é mostrar o seu melhor em cada uma das suas fotos. Por outro lado, você precisa que suas fotos sejam otimizadas para poderem ser mostradas em seu portfólio virtual sem sobrecarregá-lo. Como nós já vimos, as opções mais comuns (compressão e redução) falham em relação a este equilíbrio e vão prejudicar muito a renderização visual para compensar o desempenho.
Desta forma, o Wix usa algoritmos avançados para conseguir alcançar o melhor equilíbrio entre qualidade de imagem e o desempenho da exibição. Basicamente a única coisa que você precisa fazer é tirar fotos incríveis, usar o Wix Pro Gallery para fazer o upload das fotos e depois deixar o computador fazer toda a matemática por você. Não há necessidade alguma de comprimir ou redimensionar as suas imagens. Simplesmente faça upload das suas fotos. O Wix Pro Gallery vai automaticamente determinar e aplicar a melhor resolução quando suas imagens forem mostradas no navegador do seu visitante. O servidor mais próximo do navegador vai então disponibilizar o arquivo redimensionado usando uma CDN (Content Delivery Network ou Rede de Distribuição de Conteúdo) com cobertura mundial, assegurando o melhor desempenho e velocidade possíveis.
Veja a seguir o procedimento completo para otimizar imagens para seu site:
01. Aperfeiçoe sua imagem com Photoshop, Lightroom ou qualquer editor gráfico à sua escolha.
02. Exporte sua imagem como arquivo JPEG com:
Qualidade 11 ou superior na escala do Photoshop (ou equivalente).
Resolução de pelo menos 3000 px no lado menor da sua foto (a largura para retrato, a altura para paisagem).
Um tamanho máximo de 15MB
01. Deixe o Wix fazer sua mágica para conseguir uma foto otimizada que verdadeiramente respeita sua arte e atende aos requisitos.
Para usuários mais avançados
No painel de controle do Wix Pro Gallery, você pode substituir intuitivamente as configurações com valores específicos para cada imagem. Este controle exclusivo, que se associa aos algoritmos avançados deste aplicativo genial, proporciona a melhor qualidade e o melhor desempenho tanto para mobile como para desktop:
A Qualidade. A não ser quando você está lidando com fotos excepcionalmente ricas, colocar esta configuração acima de 90 é considerada uma prática ruim para seu site, uma vez que vai aumentar o tamanho do seu arquivo com apenas um efeito marginal na renderização da sua foto.
A Nitidez permite deixar sua foto mais nítida analisando e maximizando a definição das arestas. Você tem total controle sobre o grau de ajuste da nitidez aplicado à imagem, o raio (número de pixels da aresta afetados pelo efeito do ajuste de nitidez) e o limiar (quais pixels serão considerados pixels de arestas – quanto menor, mais intenso é o efeito da nitidez).
Moral da história? Lembre-se que a vida é um ato de equilíbrio e seu site de fotografia não é uma exceção.
Pronto para mostrar suas criações para o mundo? Crie seu exclusivo site de fotografia com Wix!
Por Equipe Wix
