Todo provedor de hospedagem possui um limite para o tráfego que será permitido em cada um de seus planos. Isso acontece basicamente porque como todo arquivo baixado na prática é um download, quanto maior a quantidade de downloads, maior a quantidade de tráfego, e mais largura de banda é exigida do servidor. Ou seja, não seria justo cobrar a mesma coisa de um pequeno site institucional com pequenas imagens, texto, que receba uma média relativamente baixa de visitas, e de um site com downloads de Mp3 com 10 mil acessos diários, já que o segundo exigirá uma largura de banda muito maior que o primeiro no servidor.
Um dos problemas mais comuns reside em dimensionar corretamente as imagens, para evitar tráfego desnecessário. Muitos sistemas exibem as imagens de forma correta no que se refere ao layout do site, porque reduzem essa imagem no código de inserção. Isso significa que se o tamanho ideal da imagem para uma determinada coluna do site for de 380pixels, ela será exibida com 380 pixels, mesmo que o cliente poste o original com 1200 pixels de largura.
MUITO CUIDADO COM ISSO
O que acontece é que a redução por código não é uma redução real no tamanho da imagem. A imagem continua com 1200 pixels de largura, mas é exibida com apenas 380. Mas o tamanho dela em kbytes não foi reduzido, ou seja, ela “pesa” o mesmo que a imagem original, embora seja exibida de forma reduzida.
Antes de mais nada, RECORTE as fotos. Muita gente publica fotos de produtos em sua loja, sem recortar apenas o produto da foto. É muito importante recortar as imagens, destacando apenas o produto.
Vamos tentar ser o mais didático possível e explicar do que se tratam esses nomes estranhos: Pixels e DPI.
Vamos começar pelo DPI. DPI, que significa Dots Per Inch (ou Pontos por Polegada), é a quantidade de informação (ou pontos) exibidas em uma polegada quadrada da imagem. Os monitores mais modernos exibem no máximo 96DPI, ou seja, e uma polegada de imagem, haverá 96 pontos de informação de largura por 96 de altura. Os mais antigos, 72 ou nem isso.
Isso significa que se a imagem for escaneada em uma resolução mais alta (por ex 300DPI), a informação excedente simplesmente não será exibida, mas você pagará pelo tráfego resultante. Uma imagem de 300 DPI por exemplo, terá 300 pontos por polegada de altura por 300 pontos por polegada de informação. Isso significa 90.000 pontos de informação em apenas uma polegada da imagem.
Como já disse antes, a maioria dos monitores só exibe até 72DPI. Ou seja, a mesma imagem citada acima, nas mesmas dimensões mas com 72DPI, terá apenas 5184 pontos de informação na mesma polegada (e o visitante não verá diferença nenhuma entre as duas, com excessão de que a segunda carregará muito mais rápido e o tráfego gerado por ela será muito menor).
Via de regra, guarde esse número:
USAREI IMAGENS COM 72DPI (no máximo 96, mas sugiro 72 mesmo).
A segunda medida que usamos, é a medida em pixels (cm ou polegadas no caso de imagens para impressão). Pixels são os pontos que seu monitor exibe para formar a imagem. Por exemplo, numa resolução de vídeo de 800×600, você terá em sua tela 800 pixels de largura por 600 sendo exibidos - é por isso que quanto mais alta a resolução usada, menores ficam as coisas na tela, porque o monitor exibe mais pontos no mesmo espaço.
Pixels (que será a medida usada por quem publica imagens para sites) é uma medida física, diferente do DPI. Ou seja, uma imagem com 300 pixels de largura, será exibida neste exato tamanho, a não ser que reduzida por código - que como já disse antes, não recomendo.
O importante é não confundir as duas coisas: DPI e Pixels.
Quando você for publicar suas imagens, lembre-se sempre de checar ambas as medidas. DPI, use sempre 72, e em pixels, use o tamanho que mais convém ao seu layout.
TODO BOM programa de edição de imagens, entre eles os mais usados: Photoshop, Fireworks, Corel Photopaint, Paint Shop Pro, Gimp e tantos outros, permitem o ajuste de ambas as medidas.
No Fireworks por exemplo, este ajuste pode ser facilmente acessado pelo atalho “Control+J”, com a imagem a ser editada aberta no programa. No Photoshop, o atalho é Control+Alt+I.
Não sei os atalhos em outros programas, mas se você usa um dos que citei, tenha certeza, o ajuste existe e é fácil de ser feito.
Confira na imagem abaixo as telas de ajustes do Photoshop (Control+Alt+I) e também do Fireworks (Control+J), softwares que uso aqui.
Acima, as telas de configuração de tamanho de imagem do Photoshop (CS3) e do Fireworks (CS3).
A parte grifada em vermelho corresponde ao tamanho da imagem físico, em pixels.
A parte grifada em laranja corresponde a quantidade de informações da imagem por polegada - DPI.
A parte em azul corresponde ao tamanho da imagem quando impressa. Caso não pretenda usar essa imagem em trabalhos de impressão - caso quando irá publicá-la em seu site ou blog - você nem precisa se preocupar com a parte em azul.
Para finalizar este post, vale lembrar que: Caso você esteja tratando imagens para um trabalho que será impresso, como um cartão de visitas, um folder com fotos, enfim, as regras do jogo mudam bastante. Para conseguir uma boa qualidade de impressão, a média recomendada é de 300DPI, e pode ser ainda mais alta dependendo do que se trata. Via de regra, guarde o seguinte: 300DPI para impressão e 72 para imagens que serão publicadas na Internet são excelentes números. |
