HTML - 9. Imagem


Para inserir uma imagem em um documento HTML, usamos a tag img.

<img src="imagem.png" width="300" height="400" alt="Imagem de algo" title="Imagem" />

Com este exemplo acima, temos a inclusão de uma imagem com altura de 400px, largura de 300px, um título chamado "Imagem" que irá aparecer apenas quando o cursor do mouse ficar pausado por 3 segundos ou mais aparecendo um tooltip, e o texto "Imagem de algo" que irá aparecer sempre que a imagem ainda estiver carregando, ou quando o usuário desativou visualizar as páginas com imagens (o que não é mais comum na Web, mas ainda é muito comum em e-mails).

Na norma da W3C diz que o atributo alt é obrigatório, e dependendo do Doctype do documento, pode ser considerado um erro a falta dele. Não é obrigatório que tenha valor, podendo ser em branco, mas o atributo tem que existir para a imagem.

Desta forma insere-se a imagem diretamente no HTML, mas há outras formas de inserirem imagens, porém, neste caso, trata-se de uma imagem para um determinado conteúdo, pois as imagens que ficam referenciadas nas folhas de estilo (CSS), geralmente fazem parte do layout do site. Se for conteúdo, utilize a imagem desta forma, já que conteúdo é diferente e não se repete. Layout se repete em várias páginas em um mesmo site, e não refere-se explicitamente ao conteúdo.

Comentários