Os hiperlinks são referências incorporadas que permitem uma navegação perfeita entre documentos, sites, e diferentes seções dentro de uma página.
O que é um hiperlink?
Um hiperlink, geralmente chamado simplesmente de link, é uma referência em um documento digital que permite aos usuários navegar de um local para outro dentro do mesmo documento, em diferentes documentos ou para sites totalmente diferentes. Essa referência é normalmente incorporada em um texto ou imagem e, quando clicada, instrui o navegador or Formulário on line para carregar o destino especificado. Hyperlinks são um componente essencial do hipertexto, o sistema que permite navegação não linear de informações na internet.
Link vs. Hiperlink
Os termos "link" e "hiperlink" são frequentemente usados de forma intercambiável, mas há uma distinção sutil entre os dois.
Um "link" é um termo amplo que geralmente se refere a qualquer elemento em um documento ou página da web que se conecta a outro local, o que pode incluir texto e imagens. Por outro lado, um "hyperlink" se refere especificamente a um link incorporado dentro de um hipertexto, que é um texto exibido em um computador ou dispositivo digital com hiperlinks que fornecem acesso a outro texto ou informação.
Embora todos os hiperlinks sejam links, nem todos os links são considerados hiperlinks. Por exemplo, um URL digitado em um documento de texto simples é um link, mas não um hyperlink até que se torne clicável dentro de um sistema de hipertexto. Em essência, um hyperlink é uma forma mais específica de um link, projetado para facilitar a navegação fácil e interativa dentro e entre documentos digitais.
Qual é a finalidade dos hiperlinks?
O principal objetivo dos hiperlinks é facilitar a navegação fácil e intuitiva entre diferentes partes de conteúdo digital, seja dentro do mesmo documento ou em vários documentos e sites. Os hiperlinks permitem que os usuários acessem informações relacionadas rapidamente, aprimorando a experiência geral do usuário ao fornecer uma maneira perfeita de explorar recursos interconectados. Eles servem como a base da estrutura da web, permitindo a exploração não linear de conteúdo, que é central para o funcionamento da internet.
Além de auxiliar a navegação, os hiperlinks são cruciais para organizar e estruturar informações de uma forma que as torne mais acessíveis e compreensíveis. Eles conectam tópicos relevantes, fornecem contexto adicional e ajudam os usuários a se aprofundarem em áreas específicas de interesse sem desorganizar o conteúdo principal.
Os hiperlinks também desempenham um papel vital no SEO (otimização de mecanismos de busca), ajudando os mecanismos de busca a indexar e classificar o conteúdo com base nas relações entre as páginas vinculadas, influenciando assim como as informações são descobertas e priorizadas nos resultados da pesquisa.
Uma breve história dos hiperlinks
O conceito de hyperlinks tem suas raízes na visão inicial do hipertexto, um sistema que permite que o texto seja interconectado de forma não linear. Essa ideia foi articulada pela primeira vez por Vannevar Bush em seu ensaio de 1945 "As We May Think", onde ele imaginou uma máquina chamada "Memex" que permitiria aos usuários navegar entre documentos usando associações vinculadas.
O hiperlink moderno tomou forma na década de 1960 com o desenvolvimento do Sistema de Edição de Hipertexto (HES) e, mais tarde, de sistemas mais avançados como o Projeto Xanadu de Ted Nelson, que visava criar uma rede global de informações vinculadas.
O verdadeiro avanço ocorreu no final da década de 1980 e no início da década de 1990 com a invenção do World Wide Web por Sir Tim Berners-Lee. Ele propôs o uso de hiperlinks como parte fundamental da arquitetura da web, permitindo que os usuários cliquem em texto ou imagens destacados para pular entre páginas da web relacionadas. A primeira implementação bem-sucedida de hiperlinks ocorreu com o lançamento do navegador da web de Berners-Lee, WorldWideWeb, em 1991, que permitiu que os usuários explorassem a web florescente por meio de links clicáveis.
Desde então, os hiperlinks se tornaram um elemento onipresente da internet, moldando como as informações são conectadas, acessadas e compartilhadas globalmente. Eles evoluíram de simples links baseados em texto para formas mais sofisticadas, incluindo multimídia incorporada e conteúdo dinâmico, mas seu propósito principal de vincular informações continua o mesmo.
Tipos de hiperlink
Os hiperlinks vêm em várias formas, cada um projetado para servir funções específicas dentro do conteúdo digital. Entender os diferentes tipos de hiperlinks é essencial para um web design eficaz e navegação do usuário. Abaixo está uma explicação dos principais tipos de hiperlinks comumente usados.
Hiperlinks de texto
Os hiperlinks de texto são o tipo mais comum, onde o texto clicável (geralmente sublinhado e em uma cor diferente) direciona os usuários para outro local. Esses links são normalmente incorporados no corpo de um documento ou página da web e são definidos pelo HTML tag, que inclui a URL de destino. Quando clicados, os hiperlinks de texto permitem que os usuários naveguem para uma nova página, uma seção diferente da mesma página ou um site externo.
Hiperlinks de imagens
Os hiperlinks de imagem são imagens clicáveis que funcionam da mesma forma que os hiperlinks de texto. Em vez de texto, uma imagem é usada como elemento clicável. Esses hiperlinks são úteis para criar elementos de navegação visualmente envolventes, como botões, banners ou ícones que levam a outras páginas ou recursos quando clicados.
Hiperlinks em linha
Os hyperlinks inline são incorporados em um bloco de texto e são usados para referenciar conteúdo relacionado ou fornecer informações adicionais sem interromper o fluxo de leitura. Esses links são frequentemente usados em artigos ou documentos para direcionar os leitores a fontes, definições ou explicações estendidas relevantes para o conteúdo principal.
Links de âncora (links de salto)
Links de âncora, também conhecidos como jump links, permitem que os usuários naveguem para uma parte específica da mesma página da web. Esses hiperlinks são particularmente úteis para páginas da web longas, como artigos, FAQs ou sites de uma página, onde eles permitem acesso rápido a diferentes seções pulando diretamente para o conteúdo desejado.
Hiperlinks de e-mail
Os hiperlinks de e-mail abrem o cliente de e-mail padrão de um usuário e criam uma nova mensagem de e-mail quando clicados. Esses links são formatados usando o esquema de URL mailto: e são comumente usados em sites para permitir que os usuários entrem em contato com alguém facilmente por e-mail. O link também pode incluir uma linha de assunto ou corpo de mensagem predefinidos.
Hiperlinks de arquivo
Os hiperlinks de arquivo direcionam os usuários para baixar um arquivo específico, como um PDF, imagem ou documento. Esses links são frequentemente usados em ambientes educacionais ou profissionais, onde os usuários precisam acessar recursos para download diretamente de uma página da web. Quando clicado, o arquivo é normalmente baixado para o dispositivo do usuário.
Hiperlinks externos
Os hiperlinks externos direcionam os usuários para um site ou domínio diferente daquele que eles estão visitando no momento. Esses links são essenciais para referenciar fontes, guiar os usuários para recursos adicionais ou direcionar o tráfego para sites parceiros. Eles geralmente abrem em uma nova aba ou janela do navegador para manter a sessão de navegação atual do usuário.
Hiperlinks internos
Os hiperlinks internos conectam diferentes páginas dentro do mesmo site ou domínio. Eles são cruciais para a navegação do site, ajudando os usuários a se moverem entre várias seções ou páginas de um site. Os links internos também desempenham um papel significativo no SEO, melhorando a estrutura do site e ajudando os mecanismos de busca a entender o relacionamento entre diferentes páginas.
Como criar um hiperlink?
Criar um hiperlink é um processo direto que envolve adicionar um código HTML específico ao seu texto ou imagem para torná-lo clicável, direcionando os usuários para outro local. Abaixo está um guia passo a passo sobre como criar um hiperlink básico:
1. Escolha o texto ou a imagem. Primeiro, decida qual texto ou imagem você quer transformar em um hyperlink. Pode ser uma palavra, frase, botão ou imagem em que os usuários clicarão para navegar para outra página ou recurso.
2. Escreva o código HTML. Para criar um hyperlink, você usará a tag HTML (também conhecida como tag âncora). A sintaxe básica se parece com isso:
<a href="URL">Link Text or Image</a>- . Esta tag define o início do hiperlink.
- href="URL". O atributo href especifica a URL de destino, que pode ser uma página da web, arquivo ou outra seção da mesma página. Substitua "URL" pelo endereço da web real ou caminho do arquivo.
- Texto ou imagem do link. Este é o texto ou imagem que será clicável. Para um hiperlink de texto, basta colocar o texto desejado aqui. Para um hiperlink de imagem, coloque uma tag de imagem HTML ( ) dentro das tags de âncora.
3. Exemplo de um hiperlink de texto. Para criar um hiperlink de texto que leve os usuários para "http://example.com" quando eles clicarem na palavra "Example":
<a href="http://example.com">Example</a>4. Exemplo de um hiperlink de imagem. Para criar um hiperlink de imagem usando uma imagem localizada em "image.jpg" que vincula a "http://example.com":
<a href="http://example.com">
<img src="image.jpg" alt="Description of Image">
</a>5. Salve e teste. Após escrever seu código HTML, salve as alterações e teste o hyperlink em um navegador da web. Clique no link para garantir que ele o direcione para o destino correto.
Atributos adicionais (opcional)
- alvo="_em branco". Este atributo abre o link em uma nova aba ou janela.
- title="Texto da dica de ferramenta". Fornece informações adicionais sobre o link quando os usuários passam o mouse sobre ele.
Por exemplo, para abrir o link em uma nova aba:
<a href="http://example.com" target="_blank">Example</a>Como criar um link para uma página diferente no mesmo site usando URLs relativos
Criar um link para uma página diferente no mesmo site usando URLs relativas é uma maneira eficiente de criar hiperlinks internos sem precisar especificar o endereço completo da web. Um URL relativo aponta para um arquivo ou local dentro do mesmo domínio, permitindo que seu site funcione corretamente mesmo se o nome do domínio mudar. Veja como criar esses links:
Vinculando a uma página no mesmo diretório
Imagine que você tem dois arquivos HTML, index.html e about.html, ambos localizados no diretório raiz do seu site. Para vincular de index.html para about.html, você usaria:
<a href="about.html">About Us</a>Vinculando a uma página em um diretório pai
Suponha que sua página atual esteja localizada em um subdiretório chamado blog, e você quer vincular a index.html localizado no diretório raiz. Você usaria:
<a href="../index.html">Home</a>Vinculando a uma página em um subdiretório
Se você estiver vinculando de index.html no diretório raiz para post.html localizado em um blog subdiretório, seu link ficaria assim:
<a href="blog/post.html">Read Blog Post</a>Como criar um link para uma seção específica de uma página
Criar um link para uma seção específica de uma página, também conhecido como criação de um "link âncora" ou "link de salto", é uma maneira útil de direcionar os usuários para uma parte específica de uma página da web. Isso é especialmente útil em páginas longas, onde você deseja fornecer acesso rápido a seções específicas. Veja como você pode criar esses links:
Etapa 1: Identifique ou crie a seção de destino
Primeiro, você precisa identificar ou criar uma "âncora" na seção da página para a qual você quer criar um link. Isso é feito adicionando um atributo id a um elemento HTML, como um título ou um parágrafo, para onde você quer que o link pule.
Por exemplo, se você tiver uma seção com o título "Fale conosco", você pode adicionar um ID ao título como este:
<h2 id="contact">Contact Us</h2>Etapa 2: Crie o link para a seção
Em seguida, você cria um link que aponta para o id da seção de destino. Isso é feito usando uma URL relativa que inclui o símbolo # seguido pelo valor id.
Para criar um link para a seção "Fale Conosco" de outro lugar na mesma página, o código HTML ficaria assim:
<a href="#contact">Go to Contact Us</a>Etapa 3: Link de outra página
Se você quiser vincular a uma seção específica de uma página diferente no mesmo site, inclua tanto a URL da página quanto o id no link. Por exemplo, se a seção "Fale Conosco" estiver em uma página chamada about.html, o link ficaria assim:
<a href="about.html#contact">Go to Contact Us</a>Exemplo na prática
Considere um cenário em que você tem uma página com diferentes seções, como "Introdução", "Serviços" e "Fale conosco". Veja como você pode configurá-la:
<h2 id="intro">Introduction</h2>
<p>Welcome to our website...</p>
<h2 id="services">Services</h2>
<p>We offer a variety of services...</p>
<h2 id="contact">Contact Us</h2>
<p>You can reach us at...</p>Links de navegação
<nav>
<ul>
<li><a href="#intro">Introduction</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#contact">Contact Us</a></li>
</ul>
</nav>Como abrir um link em uma nova aba
Para abrir um link em uma nova aba, você precisa adicionar o atributo target com o valor _blank à tag HTML. Isso diz ao navegador para abrir o documento vinculado em uma nova aba em vez de na mesma aba da página atual. Veja como você pode fazer isso:
<a href="URL" target="_blank">Link Text</a>- href="URL". Este atributo especifica a URL da página ou recurso ao qual você deseja criar um link.
- alvo="_em branco". Este atributo e valor informam ao navegador para abrir o link em uma nova aba.
