Como colocar uma imagem com link no seu site ou blog [Gerador de código HTML]

Para colocar uma imagem com um link em seu site ou blog é necessário usar um código HTML, onde você coloca o endereço do link que quer associar à imagem e o endereço da imagem na internet.

A nossa DICA é usar esse Gerador de imagem com link

Para utilizar o gerador basta ter as URLs da imagem e do link de destino em mãos, preencher os campos pedidos e clicar em Criar Imagem com Link

Caso você ainda não saiba como hospedar sua imagem na internet e como obter a sua URL temos uma dica/tutorial aqui no site que vai te ajudar a hospedar a sua imagem online.

Obs: O gerador funciona normalmente nos navegadore Chrome e Microsoft Edge . Se você usa o Firefox pode ser que não consiga usar o gerador de imagem com link, nesse caso basta copiar o código abaixo e substituir os campos em vermelho.

Ao criar sua imagem com link após preencher os dados no gerador acima, seu código ficará dessa forma:

O que são esses códigos?

Endereço do Link: é o endereço do site ou página que você quer que abra quando o usuário clicar na imagem;

Endereço da imagem: é a url da imagem, a url de onde ela está hospedada. Se você usa WordPress, basta subir o arquivo clicando em Mídia → Adicionar nova e pegar o endereço (URL) do arquivo na sua Biblioteca (Mídia → Biblioteca).

Você também pode usar serviços gratuitos ou pagos de hospedagem de imagens ou arquivos em geral. O mais importante é que essa imagem esteja on-line para poder ser utilizada.

ALT e title: O ALT e o Title servem para os buscadores identificarem sobre o que se trata a sua imagem.

São cruciais para o seu ranqueamento no Google Imagens, isso porque os robôs do Google, Yahoo e demais motores de busca, leem basicamente linguagem HTML por não conseguirem ler figuras.

Por exemplo, vou divulgar o meu curso online Empreenda Canva para isso utilizo a imagem do logo do curso e associo no código HTML as 2 URLs do curso e da imagem e a descrição ou título da imagem como aparece no nosso gerador: “Conheça o curso Empreenda Canva”

Quando passamos o mouse sobre a imagem e aparecem palavras, essas palavras são o atributo title da imagem que colocamos quando criamos o código HTML da mesma.

Os atributos ALT e title são importantes para o SEO e ajudarão a trazer acessos ao seu site, não os negligencie!