Pular para o conteúdo principal

Guia Definitivo: Atributo rel em links com target=_blank

Guia Definitivo: Atributo rel em links com target=_blank - Publicado por: Wellington Pragidi Desenvolvedor Web

target=_"blank" desempenho e segurança usando atributo rel com valores corretos!

O Risco Real do target="_blank"

Recentemente, vi uma discussão recorrente sobre o uso da tag <a> com target="_blank" (abrir link em uma nova aba). O ponto central é correto: usar target="_blank" sozinho é perigoso para a segurança e para o desempenho da sua página.

O problema acontece porque o navegador permite que a aba recém-aberta manipule a aba original através do objeto window.opener. Além da vulnerabilidade de segurança, isso permite que o navegador use o mesmo processo para as duas abas, fazendo sua página original engasgar se a página de destino for pesada (muito JavaScript, animações, etc.).

A Solução Obrigatória:rel="noopener"

Para resolver os dois problemas principais (Segurança e Performance) de forma definitiva, a única ferramenta que deve ser usada é o rel="noopener".

Valor rel O Que Resolve Por Que Usar
rel="noopener" Vulnerabilidade de Segurança (window.opener). Performance (Força o isolamento de processo no navegador). Deve ser padrão invisível em todo link com target="_blank". É puramente uma medida de segurança e desempenho.

Melhor Prática:

<a href="link-externo.html" target="_blank" rel="noopener">Abrir em Nova Abaa>

Privacidade e SEO: Onde a Confusão Começa

O erro comum é recomendar o uso de noopener noreferrer. Esses dois valores resolvem problemas diferentes, e o noreferrer pode causar problemas de métricas.

rel="noreferrer" (Privacidade)

Valor rel O Que Resolve Quando Usar
rel="noreferrer" Impede que o seu site seja enviado como Referer (Referenciador). Apenas quando você precisa bloquear o rastreamento. Se o link de destino (ou você mesmo) usa ferramentas como Google Analytics, o tráfego será registrado como "Direto" em vez de "Referência", quebrando a análise de tráfego.

rel="nofollow" (SEO)

Valor rel O Que Resolve Quando Usar
rel="nofollow" Instruí o robô do Google a não seguir o link para fins de ranqueamento (PageRank). Sempre que o link não for endossado (anúncios, comentários de usuários, links pagos, ou fontes em que você não confia). Não tem relação direta com segurança ou performance.

Conclusão: Uso Correto

Se o objetivo é tapar o buraco de segurança e performance, que é o risco trazido pelo target="_blank":

Use apenas rel="noopener"

O noreferrer e o nofollow são decisões de negócios/privacidade/SEO e não devem ser usados por padrão se você deseja manter a integridade das suas métricas de tráfego.

Categoria: HTML