Atributo rel: todos os valores e onde cada um funciona

O que é uma relação de link?

Uma relação de link é o valor do atributo rel: o stylesheet num elemento link, o noopener num âncora, o canonical que diz aos buscadores qual URL preferir. Ela diz o que é a coisa do outro lado do link em relação à coisa que o contém.

A IANA mantém o registro delas — 134 no momento em que esta página foi gerada, cada uma com descrição e documento de referência. Diferente de outros registros, este não tem coluna de status: não há Permanent nem Provisional, uma relação simplesmente é registrada ou não é.

O padrão HTML mantém à parte uma tabela bem mais curta, de 27 link types, e essa tabela traz a coluna que falta no registro: em qual elemento cada palavra-chave é permitida. É essa coluna que decide se o atributo rel que você acabou de escrever faz alguma coisa.

Como usar

1. Cole um valor de rel. O atributo inteiro, não uma palavra só — rel aceita um conjunto separado por espaços, e aqui ele é dividido como o HTML faz, por qualquer espaço em branco.
2. Escolha o elemento onde ele fica. link, a e area, ou form. A mesma palavra-chave pode fazer sentido num e ser completamente inerte no outro, então o elemento não é um detalhe.
3. Leia o veredito de cada palavra. Você recebe o que ela faz ali, ou qual dos três tipos bem diferentes de nada ela faz: ignorada nesse elemento, registrada mas não é palavra de marcação, ou em nenhuma das fontes.

O registro não é a lista de valores de rel

Coloque as duas fontes lado a lado e apenas 26 nomes aparecem nas duas. Sobram 108 relações registradas — quatro quintos do registro — que o padrão HTML nunca menciona. Não são erros: relações como describedby, api-catalog e predecessor-version são reais, definidas por RFCs próprios, e corretas num cabeçalho HTTP Link ou num feed Atom. Elas simplesmente não são palavras-chave de marcação, e um navegador desenhando uma página não faz nada com elas.

O caminho inverso também existe, para exatamente uma palavra-chave. expect, que o HTML usa para bloqueio de renderização, não está no registro da IANA. Ela é também a única entrada da tabela inteira classificada como Internal Resource; todas as outras são Hyperlink, External Resource ou Annotation.

Então uma página que liste o registro da IANA sob um título como todos os valores de rel que você pode usar erra em 108 linhas, e uma que apresente a tabela do HTML como as relações de link erra em outras 108. Esta mantém as duas e marca de qual fonte veio cada linha.

Onde a palavra vai importa tanto quanto se ela existe

rel="stylesheet" num âncora não faz nada. stylesheet é um External Resource num elemento link e não é permitido em nenhum outro lugar — e isso generaliza: nenhuma palavra-chave é jamais um External Resource fora do link, o que faz sentido assim que você nota que baixar um sub-recurso é exatamente para o que servem os elementos link.

rel="noopener" num elemento link também não faz nada. Toda a família noopener, noreferrer, opener, nofollow, external, bookmark e tag só é permitida fora do link — sete palavras no total — porque elas anotam uma navegação que o usuário poderia fazer, e um elemento link não é uma. A regra espelho também vale: nenhuma Annotation é jamais permitida num elemento link.

Mais duas distinções que vale conhecer. Sete palavras-chave são body-ok, ou seja, um elemento link que as carregue é válido dentro do body e não só no head: dns-prefetch, modulepreload, pingback, preconnect, prefetch, preload e stylesheet. E só duas das 27, preconnect e preload, têm processamento definido quando chegam num cabeçalho HTTP Link em vez de na marcação.

O que esta página não vai lhe dizer

Ela não vai dizer que um valor de rel é inválido. O HTML ignora por projeto as palavras-chave que não reconhece, então um valor desconhecido não quebra nada: simplesmente não surte efeito. Microformatos e convenções próprias de cada site se apoiam nisso, e por isso aqui se relata o que cada palavra faz em vez de aprovar ou reprovar o seu atributo.

Ela não cobre as convenções próprias dos buscadores além do que as duas fontes dizem. Google e outros agem sobre valores como sponsored e ugc conforme a documentação deles define, não o padrão HTML, então esse comportamento está fora do que aqui foi verificado.

E o registro é um retrato, datado abaixo da tabela. Relações são acrescentadas continuamente, então uma bem nova pode faltar — embora uma linha ausente e uma registrada-mas-não-no-HTML se comportem igual no navegador, o que suaviza a consequência.

Por que é grátis?

Os dois conjuntos de dados viajam com a página como alguns kilobytes, e a checagem roda no seu próprio navegador. Nada do que você cola é enviado, nada é registrado e não há conta a criar.

Sem cadastro, sem limites e sem marca d'água em nada que você copiar.