No nosso post anterior falamos sobre os diferentes tipos de formatos de imagens que existem. Dando continuidade aquele post, hoje falaremos sobre outras características das imagens, como tamanho da imagem, pixels e diferenças de imagens para internet e impressão.
O que é Pixel?
O pixel é o menor componente de uma imagem digital, em uma tela ou monitor ele é composto por um conjunto de 3 cores: vermelho, verde e azul, também conhecido por RGB (Red, Green, Blue). Se você ampliar uma foto digital ao máximo, você verá que ela é formada por vários quadradinhos do mesmo tamanho, esses são os pixels.
Os pixels são agrupados para formar uma imagem, por exemplo: uma imagem que possua uma resolução de 700 pixels de largura e 300 pixels de altura é formada por 210 mil pixels. O pixel também é usado como uma medida de qualidade da imagem, a quantidade de pixels na altura e largura de uma foto formam a “resolução” da imagem. Então, quantos mais pixels uma imagem tiver, melhor será a sua qualidade e maior o tamanho do arquivo. Uma imagem com baixa resolução terá menos detalhes e ficará borrada.
Um site interessante sobre tamanho de imagem é o PlaceHolder, utilizando esse site você pode visualizar o tamanho da imagem que você precisa, colocando quais valores você precisa na altura e largura da sua imagem.
Por exemplo: http://via.placeholder.com/400×400
Esse endereço vai me retornar uma imagem que possui 400 de altura e 400 de largura, substituindo os valores no endereço do site ele te apresenta o valor mencionado. Então, se eu quiser uma imagem de 500 x 600 é só eu usar o endereço http://via.placeholder.com/500×600.
Resolução da Imagem
Quando falamos sobre pixels, estamos falando exclusivamente de imagens para web, mas e quanto as imagens para impressão?
Para entender um pouco melhor sobre isso, é preciso saber o que é PPI e DPI.
PPI significa “Pixels per Inch” ou Pixels por Polegada, e é utilizado para definir a resolução da imagem em telas ou monitor.
DPI significa “Dots per Inch” ou Pontos por Polegada, e é utilizado para definir a resolução de imagens impressas.
Eles não significam a mesma coisa, mas muitas vezes acabam sendo utilizados de forma alternada. Quanto maior o número do PPI maior a qualidade da sua imagem. Para o uso na internet, o uso de 72 PPI é o suficiente, sendo esse o valor mais comumente utilizado.
Para documentos que serão impressos, a resolução usada é de 300 PPI, garantindo a qualidade superior necessária para impressão.
Note que, caso você possua uma imagem de baixa resolução e decida aumentá-la, você irá perder ainda mais qualidade na imagem. É necessário que o arquivo já seja criado em alta resolução para que esse tipo de trabalho possa ser feito.
Tamanho da Imagem
Algo que deve ser levado em conta ao criar uma imagem é o tamanho do arquivo. Imagens para web devem ser leves, uma imagem muito pesada irá demorar pra carregar e essa demora pode causar um desinteresse no usuário e um eventual abandono do site.
Uma dica é utilizar imagens em formato .jpg com uma compressão de imagem que não prejudique a qualidade e a deixe leve. Alguns editores de imagem possuem a opção de “Save for Web” que já otimiza a sua imagem para internet.
Resolução de Tela
Outro fator importante, não só para a sua imagem, mas para todo o seu site é a resolução da tela em que ela será exibida. Um mesmo conteúdo é exibido de maneira diferente de acordo com a resolução de tela do usuário, ou até mesmo do dispositivo em que ela será exibida.
Nesse site, é possível verificar como o seu site é visualizado em diferentes resoluções e dispositivos. Caso o seu site não aparece de uma forma que lhe agrade, ou não seja compatível com outros dispositivos, você deve investir em um design responsivo.
O design responsivo faz com que o seu site se adapte a qualquer tela em que seja exibido, além de melhorar o seu ranking nas pesquisas do Google.