Dê vida aos seus sites adicionando imagens a eles. Você pode inserir imagens em arquivos HTML usando a tag <img>, que serve para especificar a localização da imagem na internet, a altura e largura da imagem e texto alternativo que aparece se a imagem não carregar ou se alguém usar um leitor de tela para visualizar a página. Três tipos comuns de arquivos de imagem usados na web são GIF, PNG e JPEG.
Abra o arquivo HTML da página da web onde deseja adicionar uma imagem em um editor de texto como Bloco de Notas ou software de desenvolvimento web.
Adicione uma tag <img> ao arquivo. Coloque a tag após o elemento onde deseja que a imagem apareça quando o arquivo HTML for aberto no navegador. A tag não tem uma tag de fechamento separada. Dentro da tag, você deve especificar a fonte da imagem que deseja exibir digitando a localização da imagem na internet com o atributo src. Se a imagem estiver armazenada na mesma pasta do arquivo HTML, digite o nome e a extensão da imagem. Se estiver armazenada em outro lugar, digite a URL completa da imagem.
Adicione o atributo alt à sua tag. No HTML5, o atributo alt é obrigatório. Use este atributo para descrever a imagem caso ela não possa carregar. Se uma imagem não carregar, o navegador exibe o texto que você inserir após o atributo alt. Além disso, o atributo alt é importante para software de leitura de tela usado por pessoas com deficiência visual. O software lê o texto no atributo alt para que a pessoa com deficiência visual visualizando seu site possa ouvir o que há na imagem mesmo sem vê-la.
Especifique as dimensões da imagem em pixels com os atributos height e width. Se não especificar as dimensões, o navegador não sabe quanto espaço deixar para a imagem enquanto a página carrega. Isso resulta em um carregamento irregular da página, pois o texto carrega primeiro, deixando um pequeno espaço para a imagem, depois pula quando a imagem carrega e faz o espaço expandir. Com as dimensões especificadas, o navegador deixa exatamente a quantidade certa de espaço entre os outros elementos da página para a imagem preencher quando terminar de carregar.
Teste seu código para garantir que a imagem exibe no local correto abrindo seu arquivo HTML em um navegador.
Use CSS para mover uma imagem para o lado esquerdo ou direito da tela ou fazer o texto contorná-la. Por exemplo, você pode usar style="float:left;" ou style="float:right;" dentro da tag.
Se não souber tanto a altura quanto a largura de uma imagem, não há problema em usar apenas o atributo height ou width sozinho. Você também pode usar CSS para especificar altura e largura; por exemplo, com uma imagem de 100 por 100 pixels, use o atributo style: style="height:100px;width:100px."
Transforme a imagem em um link clicável colocando a tag dentro de um par de tags "a href". Por exemplo, se quiser que uma imagem link para o Facebook, digite o seguinte.
Não use o atributo alt para tentar melhorar o SEO da sua página. Os mecanismos de busca há muito sabem que alguns designers web tentam encher o atributo alt com palavras-chave extras, e portanto ignoram o texto no atributo alt.
Tecnologia Eletrônica © [www.351231.com]
