Neste artigo
Um cenário comum online é que você tem uma imagem em seu site para a qual deseja criar um link. Talvez você esteja codificando uma página em seu site e queira adicionar essa imagem, ou talvez queira criar um link para ela de outro site, como uma conta de mídia social que você possui. Em ambos os casos, a primeira etapa neste processo é identificar o URL (localizador uniforme de recursos) dessa imagem. Este é o endereço exclusivo e o caminho do arquivo para aquela imagem específica na web. Vamos dar uma olhada em como isso é feito.
Começando
Para começar, vá até a página com a imagem que deseja usar. Lembre-se, entretanto, de que você deve usar uma imagem de sua propriedade. Isso porque apontar para as imagens de outras pessoas é considerado roubo de largura de banda e pode causar problemas – até mesmo legalmente. Se você criar um link para uma imagem em seu site, estará usando sua própria imagem e sua própria largura de banda. Tudo bem, mas se você criar um link para o site de outra pessoa, estará sugando a largura de banda do site para exibir essa imagem. Se esse site tiver limites mensais de uso de largura de banda, que muitas empresas de hospedagem impõem, você estará consumindo seu limite mensal sem o consentimento deles. Além disso, copiar a imagem de outra pessoa para o seu site pode ser uma violação de direitos autorais. Se alguém licenciou uma imagem para uso em seu site, isso foi feito apenas para seu site. Criar um link para essa imagem e colocá-la em seu site para que seja exibida em sua página sai fora da licença e pode resultar em penalidades legais e multas. Resumindo, você pode criar links para imagens que estão fora do seu próprio site / domínio, mas que são consideradas rudes na melhor das hipóteses e ilegais na pior, portanto, evite essa prática por completo. Para o propósito deste artigo, presumiremos que as imagens estão legalmente hospedadas em seu próprio domínio. Agora que você entende as “pegadinhas” da vinculação de imagens, vamos querer identificar qual navegador você usará. Navegadores diferentes fazem as coisas de maneira diferente, o que faz sentido, pois todos são plataformas de software exclusivas criadas por empresas diferentes.
Encontrar código de imagem da web usando o Chrome
Na maioria das vezes, todos os navegadores funcionam de maneira semelhante atualmente. No Google Chrome, isso é o que faríamos:
-
Encontre a imagem que você deseja.
-
Clique com o botão direito na imagem (Ctrl+clique em um Mac).
-
Um menu aparecerá. Nesse menu, selecione Copiar endereço de imagem.
-
Se você colar o que está agora na sua área de transferência, verá que tem o caminho completo para essa imagem.
Usando outros navegadores
No Internet Explorer, você clica com o botão direito na imagem e escolhe Propriedades. Nessa caixa de diálogo, você verá o caminho para esta imagem. Copie o endereço da imagem selecionando-o e copiando-o para a área de transferência. No Firefox, você clica com o botão direito na imagem e escolhe copiar localização da imagem. Os dispositivos móveis são ainda mais complicados quando se trata de encontrar um caminho de URL e, uma vez que existem tantos dispositivos diferentes no mercado hoje, criar uma lista definitiva de como encontrar um URL de imagem em todas as plataformas e dispositivos seria uma tarefa difícil. Em muitos casos, no entanto, você toca e segura uma imagem para acessar um menu que permitirá que você salve a imagem ou encontre seu URL. Assim que tiver o URL da imagem, você pode adicioná-lo a um documento HTML. Lembre-se, este foi o objetivo deste exercício, encontrar a URL da imagem para que pudéssemos adicioná-la à nossa página! Veja como adicioná-lo com HTML. Observe que você escreveria este código em qualquer editor de HTML de sua preferência: alt = “My Awesome Image”>
Entre o primeiro conjunto de aspas duplas, você colaria o caminho para a imagem que deseja incluir. O valor do texto alternativo deve ser um conteúdo descritivo que explica o que é a imagem para alguém que pode não vê-la realmente na página. Carregue sua página da web e teste-a em um navegador da web para ver se sua imagem está no lugar!
Dicas úteis
Os atributos de largura e altura não são obrigatórios nas imagens e devem ser excluídos, a menos que você sempre queira que a imagem seja renderizada nesse tamanho exato. Com sites responsivos e imagens que refluem e redimensionam com base no tamanho da tela, raramente é o caso atualmente. É provável que seja melhor deixar de fora a largura e a altura, especialmente porque, na ausência de qualquer outra informação de tamanho ou estilo), o navegador exibirá a imagem em seu tamanho padrão de qualquer maneira.
