O que é uma imagem embutida?

Uma imagem embutida é uma imagem gráfica inserida em uma página da Web para adicionar apelo visual, fornecer informações ou representar um hiperlink. As imagens embutidas geralmente estão nos formatos GIF, JPEG ou PNG. Eles são incorporados a uma página da web usando o esquema de URI de dados.

Os URIs de dados permitem a incorporação de dados de tamanho pequeno que podem ser recuperados instantaneamente pelo navegador. Imagens embutidas são recuperadas pelo navegador junto com o HTML e exibidas como parte do documento da web. Para que o navegador possa recuperar e exibir as imagens sem muito tempo e problemas, é recomendável usar imagens embutidas de tamanho pequeno.

Imagens maiores desacelerariam o tempo de carregamento e levariam muito tempo para o site aparecer na tela. A maioria dos visitantes da web não tem paciência para esperar para ver isso acontecer. Isso afetaria negativamente o tráfego do site.

As imagens embutidas em HTML são originárias do servidor do site em que devem ser exibidas ou incluídas em outros servidores externos. Usar imagens embutidas de fontes externas é uma questão de contenção, pois isso pode ser feito sem permissão. A tag img é usada para inserir imagens embutidas em parágrafos e títulos na página da web. A tag img não pode ser usada de forma flutuante. Ele deve ser fechado dentro de outro elemento.

O atributo necessário da tag img é o atributo src. O atributo src especifica o endereço da Web ou URL a partir do qual o navegador pode recuperar o arquivo de imagem. Além do atributo src, as imagens embutidas em HTML podem ser definidas por três atributos opcionais. Estes são alt, align e ismap.

O atributo alt fornece uma alternativa de texto de imagem embutida. Portanto, caso o navegador do visualizador não suporte gráficos, o visualizador verá o texto no lugar da imagem. O uso do atributo alt é altamente recomendado.

O valor do atributo alt pode ser uma sequência vazia. Por exemplo, se houver uma imagem decorativa, não é necessário fornecer texto alternativo para ela. Portanto, o valor do atributo alt pode ser deixado em branco.

O estilo da imagem embutida pode ser definido com o atributo align. O atributo align informa ao navegador onde a imagem embutida deve aparecer em relação ao texto na página da web. A imagem embutida pode ser alinhada com a parte superior, central ou inferior do texto adjacente na página da web.

Com o atributo ismap, uma imagem embutida pode ser marcada como um mapa de imagem ativo. Isso significa que diferentes partes da imagem podem ser criadas para produzir ações diferentes sempre que alguém clica nas diferentes partes. Por exemplo, se houver uma imagem embutida mostrando Terra e Saturno, clicar na Terra pode levar a informações sobre a Terra e clicar em Saturno pode levar a informações sobre Saturno.

Ao contrário dos atributos alt e align, o atributo ismap não funciona por mera inclusão na tag img. Requer alguma configuração feita no servidor. Alguma quantidade de conhecimento de programação também pode ser necessária.