▷ Como comprimir uma imagem no PHOTOSHOP

Ter um site não se baseia apenas no upload descontrolado de conteúdo, você deve cuidar da estrutura da web, incluindo cada elemento que hospedamos nela. Deve-se levar em consideração que ele é acessado por meio de conexões à Internet e que, embora em muitos lugares haja altas velocidades, em outros ainda estão um pouco defasadas. Tudo isso sem levar em conta a importância do tema mobile e o gasto de megabytes. É por isso que comprimir imagens sem perder a qualidade do Photoshop é uma tarefa muito procurada por criadores que pensam no interesse dos usuários.

O que não devemos fazer é transformar nosso site em um espaço lento que as pessoas não querem entrar novamente, algo que podemos evitar se levarmos em conta os diferentes elementos e aprendermos a compactar imagens no Photoshop. Um deles e muito importante é o upload de imagens. Se você tem um site com muito conteúdo visual, deve cuidar dele tanto por dentro quanto por fora, compactando as imagens do Photoshop e tornando a página muito mais rápida.

A velocidade do nosso site é essencial para a experiência do usuário, pois não é o mesmo entrar em uma página rápida que não afeta nossa conexão a um site onde todos os objetos que vemos carregam muito lentamente. Além disso, para ver as imagens, é necessário baixá-las para o servidor, portanto, quanto maior o volume, mais tempo demorará o carregamento e o usuário provavelmente se desesperará e sairá. Daí a importância de editar imagens no Photoshop e melhorar nosso site ou simplesmente nosso espaço por saber compactar imagens no Photoshop.

Se você carregar imagens muito pesadas, sua página ficará lenta e os usuários se cansarão e irão embora. Se você quer evitar perder visitas, cuide de tudo que você carrega e aprenda a compactar uma imagem no Photosho reduzindo seu tamanho.

1. Tipos de formatos de imagem no Photoshop

Para falar sobre otimização de imagens, temos que distinguir que tipo de formato de imagem temos e qual é o melhor para nós.

Formato JPEG.webpPara uso geral em fotografia, é o formato padrão usado com resultados de boa qualidade. Suporta cores de 24 bits.

Formato PNG-8É a alternativa ao GIF.webp, mas sem animações e pode exibir até 256 cores. Sua compressão pela teia é uma das mais adequadas, permitindo boa qualidade com tamanhos reduzidos.

Formato PNG-24É uma boa opção para exportar imagens de qualidade como JPEG.webp. Este tipo de extensão é conveniente quando temos uma imagem que contém transparência. Ele também exibe até 16 milhões de cores, pois oferece suporte a cores de 24 bits.

Formato GIF.webpÉ o formato das animações por excelência. Representa até 256 cores em formatos de grandes quantidades de cores sólidas, linhas ou texto.

Para este tutorial, escolheremos dois dos formatos mais úteis e usados ​​para enviar imagens para a web: JPEG.webp e PNG-8.

2. Como comprimir uma imagem no Photoshop

Quando trabalhamos em um espaço de trabalho no Photoshop, fazemos isso de acordo com determinados parâmetros dependendo da imagem ou de natureza geral. Um deles é o tamanho, as proporções da imagem com que trabalhamos. O tamanho de uma imagem corresponde ao número de pixels que ela contém verticalmente e horizontalmente, dando origem ao tamanho da imagem.

O que chamamos de resolução significa o número de peças de informação em um espaço específico, que é chamado de pixels por polegada ou dpi. Isso significa que quanto maior o número de pixels por polegada, maior será nossa resolução.

Uma vez que ambos os aspectos foram diferenciados, deve-se notar que duas imagens podem ter o mesmo tamanho, mas com resolução e proporções diferentes. Se forem imagens para a web, recomenda-se tratar os tamanhos em tamanho de pixel. Para acessá-lo, vá até Imagem / Tamanho da imagem ou pressione a seguinte combinação.

Ctrl + Alt + I

ObservaçãoA opção Resample image nos permite alterar o tamanho sem modificar a resolução. Selecione a opção mais apropriada para o que você precisa.

3. Alterar o perfil de cores do Photoshop

O espaço de cores onde trabalhamos também influenciará o arquivo final. Há que mencionar a diferença entre o espaço sRGB e RGB. O sistema Adobe RGB foi introduzido pela empresa em 1998 e compõe um espectro de cores muito mais amplo do que o espaço sRGB. Isso não significa que seja pior, mas que eles se dedicam a objetivos diferentes.

O sistema RGB aproxima-se com o seu espectro do CMYK, que está orientado para o mundo da impressão. Apesar de ter mais cores, o padrão distribuído digitalmente nos aparelhos, sejam eles celulares, monitores ou qualquer aparelho digital, é o sRGB. Quando um desses dispositivos encontra RGB, ele tenta compactar o excesso de cores e cria um falso sRGB com resultados piores.

Passo 1
Portanto, é recomendável tirar as fotos, trabalhar no Photoshop ou otimizá-las com este sistema para melhorar a compatibilidade de cores. Para alterar o perfil de cores de trabalho, vá para o menu Editar e selecione Converter para perfil.

Passo 2
Na janela seguinte, você só terá que escolher o perfil de que precisa, neste caso sRGB.

4. Comprima a imagem sem perder a qualidade do Photoshop

O formato JPG.webp é o padrão mais utilizado e embora permita a compressão, não oferece tantos parâmetros editáveis ​​como o PNG. Podemos variar o peso final de nossa imagem redimensionando nossa fotografia ou ao exportar.

Passo 1
Ao salvar como JPEG.webp vemos que temos duas opções, por um lado, configuramos as opções de imagem (qualidade) e, por outro, as opções de formato. Para fazer isso, vá para o menu Arquivo / Salvar como ou a seguinte combinação e selecione o formato JPEG.webp.

Shift + Ctrl + S

Passo 2
Esses parâmetros de configuração aparecem na próxima janela. Vamos ver o que cada um significa.

Opções de imagemAqui devemos escolher a qualidade final da imagem, é evidente que quanto maior a qualidade, maior será o tamanho do arquivo, podendo ver o que finalmente ocupará se clicarmos em Visualizar. Mova a barra para poder modificar esses valores.

Se quisermos uma fotografia para imprimir em tamanho de pôster, devemos selecionar uma qualidade muito maior do que se quisermos uma imagem para a web, lembrando que quanto maior o tamanho da imagem, mais recursos serão necessários para carregá-la via web.

Opções de formatoAqui dentro encontramos diversas alternativas para dar o formato final à nossa imagem. O mais recomendado é a linha de base padrão, pois geralmente é o mais compatível.

• Linha de base ("Padrão"). Ele emprega o uso de um formato que é reconhecível pela grande maioria dos navegadores e programas da web. Atualmente, os programas mais recentes geralmente não apresentam incompatibilidades.

• Linha de base otimizada. Este formato criará um arquivo de imagem que contém cores otimizadas, proporcionando um tamanho menor.

• Progressivo. Com esta opção, diferentes versões serão mostradas que serão cada vez mais detalhadas à medida que forem baixadas. É o usuário quem decide quantos serão criados. É um formato que foi usado e é muito usado quando vamos para conexões lentas que requerem sweeps sweeps para serem carregadas.

ObservaçãoDeve-se mencionar que nem todos os navegadores reconhecem ou suportam imagens JPEG.webp progressivas ou otimizadas.

5. Compactar imagens PNG no Photoshop

Passo 1
Para exportar como PNG temos que fazer o mesmo primeiro passo dos outros formatos, ir ao Menu Arquivo / Salvar como e selecionar neste caso PNG.

Passo 2
Agora você verá na janela de salvamento que aparecem diferentes opções.

CompressãoPodemos selecionar o tipo de compressão que queremos ou dizer nenhum se não quisermos que seja aplicado. Dependendo da escolha, a velocidade de carregamento será aumentada ou diminuída.

TecerEsta opção é importante, especialmente se falamos de plataformas web. Vamos ver a diferença:

• Nenhum. Esta opção permite que uma imagem só seja exibida quando estiver totalmente carregada, ou seja, se tivermos uma conexão lenta ou problemática, a imagem não aparecerá até que seja carregada na transferência da Internet.

• Entrelaçado. Esta opção é mais recomendada para serviços da web, pois mostra versões reduzidas da imagem conforme ela carrega. Isso ajuda o processo de download a ser menor e também o usuário saberá que a imagem está sendo baixada.

6. Salvar imagens JPG.webp para Photoshop web

Passo 1
Uma das opções mais vantajosas que temos no Photoshop para otimização de imagens é Salvo como uma web, que nos permite ajustar manualmente vários parâmetros. Este save é muito útil para imagens dedicadas ao upload na web, permitindo imagens de qualidade, mas com tamanho reduzido. Para isso, vamos Arquivo / Salvar para web ou fazer a seguinte combinação.

Alt + Shift + Ctrl + S

Passo 2
Se quisermos selecionar JPEG.webp, teremos essas configurações.

Qualidade da imagemSelecione sua qualidade de imagem preferida de Baixa a Máxima ou com os valores à direita. Você pode ver a variação de tamanho abaixo da imagem à esquerda.

ProgressivoA imagem vai carregando aos poucos, ou seja, passaremos de uma imagem em baixa resolução para a verdadeira.

EntrelaçadoExibe a imagem apenas quando está totalmente carregada.

aréolaSe a imagem for transparente, selecione uma cor de halo equivalente ao fundo da página onde será embutido.

Perfil de cor incorporadoSelecione esta opção para preservar o perfil ICC da imagem, alguns navegadores usam para corrigir a cor.

Converter para sRGBUse este perfil para melhorar a compatibilidade de cores em dispositivos e monitores.

Você tem outras opções, como modo de visualização, metadados ou redimensionar com ou sem restrição.

7. Salvar imagens PNG para web Photoshop

Passo 1
Como já sabemos para poder acessar o Saved for Web em PNG devemos ir em File / Save for web. Lembre-se de que este formato é muito bom para imagens com destino na web, pois seu resultado apresenta uma relação muito boa entre qualidade e peso do arquivo.

Passo 2
Para exportar como PNG, selecione-o no menu suspenso. Lembre-se de que o PNG 24 oferece mais quantidade de cores, portanto os tamanhos são muito maiores do que os do PNG-8. Recomendamos o último para imagens da web padrão. A janela que aparece é semelhante à do JPEG.webp e além das opções já vistas na seção anterior, também podemos escolher:

TransparênciaAqui você pode selecionar o tipo de transparência que melhor se adapta à sua imagem ou removê-la e selecionar uma cor específica com o Halo.

Ajustar à WebEste parâmetro permite que a imagem seja ainda mais comprimida, quanto maior a porcentagem de ajuste, maior a compressão, menor a qualidade e menor o tamanho.

8. Salvar imagens para a web do Photoshop

Passo 1
Para poder realizar uma compressão automática para PNG e JPEG.webp, abrimos o save for web em File / Save for Web ou a seguinte combinação de teclas.

Alt + Shift + Ctrl + S

Passo 2
À direita da opção Predefinições, clique na guia do menu que aparece e selecione Otimizar para o tamanho do arquivo.

etapa 3
Agora você só precisa selecionar o tamanho da imagem que deseja que o programa faça a compressão automaticamente para você. Você pode variar os valores para obter resultados diferentes.

Passo 4
Você também pode ir para a janela chamada 4 cópias e selecionar uma das versões que são fornecidas a você e salvá-la.

Etapa 5
Se você deseja modificar o tamanho e a velocidade de transferência, clique nos valores abaixo da imagem e selecione-os automaticamente.

Como você pode ver, existem diferentes maneiras de reduzir o tamanho de suas imagens, dependendo de sua finalidade. Existem muitos parâmetros que você deve levar em consideração, mas dependendo do nível que você deseja, um ou outro será mais útil para saber como comprimir a imagem do Photoshop. No vídeo a seguir mostraremos graficamente como otimizar e compactar imagens de forma básica e completa. Se você deseja uma compressão rápida, o primeiro método será bom para você e se você estiver procurando por algo mais complexo onde possa editar todos os parâmetros, seu método é o segundo.