por Magno Urbano
Quando cria uma página de web com imagens, é inserido um código HTML no corpo da página, que começa da forma seguinte:
<img src =”imagem.jpg” …
onde imagem.jpg é a imagem que foi inserida na página.
Este elemento é chamado de tag e nele, normalmente, existem outras informações como o tamanho da imagem como, no exemplo seguinte:
<img src =”imagem.jpg” width=”100″ height=”200″ …
onde width e height são a largura e a altura da image, respectivamente.
Os elementos width e height são essenciais ao bom visionamento da página, isso porque eles determinam a largura e a altura que a imagem vai ser mostrada. Muitos webmasters inexperientes usam estes campos para reduzir o tamanho de uma imagem. Digamos que, por exemplo, possui uma imagem com 500 pixels de largura por 500 pixels de altura. Então, ao inserir esta imagem numa página, especifica os campos width e height para 100 pixels cada. Ao fazê-lo, estará a indicar ao browser para que reduza o tamanho da imagem e insira esta imagem reduzida no local.
O primeiro problema que vai observar é a qualidade deteriorada da imagem em alguns browsers. Nem todos os browsers têm qualidade suficiente para produzir uma imagem reduzida de boa qualidade. Experimente ver uma página deste tipo pelo Opera e verá o que estou a falar.
Outros dois problemas que posso numerar são que o browser vai demorar muito mais a carregar uma imagem enorme e mais ainda para reduzi-la ao tamanho correcto – o que vai deixar lento o visionamento da sua página, nomeadamente se tiver imagens grandes ou muitas imagens numa página.
Logo, nunca use os campos width e height de uma imagem para forçar a sua redução.
A terceira questão é relativa à necessidade da existência dos campos width e height numa imagem que não está a ser mudada de tamanho. A experiência diz que é necessária a sua existência (aliás, na sintaxe correcta de HTML esses campos são obrigatórios), pois deixará a página mais rápida, já que o browser não vai precisar calcular o tamanho da imagem.
E o que dizer do campo alt? O campo alt (alternated text = texto alternativo), também está presente (e é obrigatório) no tag da imagem, e aparece como uma descrição em texto a ser dada em relação à uma imagem ou à função desta como, por exemplo, na sintaxe seguinte:
<img src =”imagem.jpg” width=”100″ height=”200″ alt=”Pareço um turista no meu carro de aluguer em frente ao hotel em Paris” …
No caso do exemplo, o campo alt faz uma descrição da imagem. Este campo é utilizado por programas usados pelos invisuais para indicar a presença e/ou função de uma imagem na página. Para além disso, este campo é usado pelos search engines, como o Google, para ajudar a classificar a sua página.
As dicas estão dadas. Agora é convosco!
Gostaria de que outros leitores dessem as suas dicas!
Tweetar |
Se gostou desse artigo... | |
:: |
receba as novidades deste site por e-mail! |