Novos atributos para links no HTML 5

Hiperlinks ou simplesmente links estão aí desde os primórdios da Internet. Na verdade, não dá para imaginar a Internet sem eles. Também não dá para imaginar uma forma como eles podem ser modificados e tenho certeza de que você já sabe como fazer um a href​ com um teclado quebrado e uma mão nas costas. Mas o HTML 5 veio para mexer com o que estava velho e melhorar o que estava bom. Logo, sim, é possível modificar a forma como os links funcionam.

O HTML 5 traz três novos atributos que podem ser adicionados àquela tag <a> que você conhece tão bem. Estes novos atributos são: download, media e ping. Vamos dar uma olhada em cada um deles e em como aplicá-los para uma melhor experiência nos seus links.

O atributo download

Quem nunca se irritou em clicar um link para baixar um arquivo e ver o navegador abrir outra janela que ficará vazia? Ou querer baixar aquele PDF de 50Mb, esquecer de clicar Salvar Como e ver o navegador engasgar por vários minutos enquanto tenta renderizar o arquivo? Isso acontece porque não há nenhuma informação passada para o navegador diferenciando um link que é para ser visitado de um que traz um arquivo para ser baixado. O atributo download foi criado para suprir essa carência, para informar ao navegador que o recurso referenciado no href é um arquivo para baixar. Essa solução é perfeita para documentos que o navegador até pode abrir (como PDFs e alguns tipos de arquivos de mídia), mas cujo objetivo principal é o download.

O atributo aceita qualquer valor e este valor será utilizado como sugestão de nome que o arquivo terá depois de salvo no disco rígido do usuário. Pode ser completamente diferente do valor do href, que deve sempre trazer o nome que o arquivo tem no servidor onde está hospedado. Essa diferença pode ser de grande auxílio, uma vez que arquivos armazenados no servidor podem ter nomes gerados dinamicamente e obrigatoriamente precisam obedecer às regras do sistema operacional do servidor, enquanto o nome com que o arquivo será salvo localmente pode ser mais amigável para o usuário.

Um bom exemplo de uso:

<a href="arquivos/cf_26294_29_03-2015.pdf" download="Artigo do WMO - Novos Atributos Para Links no HTML 5.pdf">Baixar artigo</a>

Quando o usuário clica no link de download, ele irá baixar Artigo do WMO – Novos Atributos Para Links no HTML 5.pdf ao invés do nada intuito nome do arquivo no servidor: cf_26294_29_03-2015.pdf. Qual você preferia ter guardado na sua Área de Trabalho?

Obviamente há restrições no que você pode digitar no atributo download, como limites de caracteres do sistema operacional do usuário e caracteres restritos, como \ ou / no Windows, por exemplo. O navegador pode ajustar o valor do atributo para se adequar.

Infelizmente, apesar de ser uma especificação oficial do HTML 5, o atributo download ainda não tem um suporte universal nos navegadores. No momento deste artigo, a grande ausência é o Internet Explorer, que não oferece suporte ao atributo em nenhuma de suas versões. Versões antigas do navegador Android também não entendem o atributo, assim como o Safari (desktop ou móvel) e o Opera Mini.

O atributo media

Este atributo é mais controverso. Para começo de conversa, ele não consta da especificação do WHATWG e muito menos da especificação do W3C. A única entidade que endossa o atributo media é a Mozilla. O que é uma pena, por que ele pode ser bastante útil.

De acordo com a especificação da Mozilla, o atributo determina para que tipo de mídia ou dispositivo o link se aplica. Se você conhece e usa o poder dos media queries para seus projetos responsivos, certamente já está utilizando o mesmo conceito, ainda que via CSS. O que a especificação propõe é que esta ideia também possa ser implementada em links, ainda que de forma informativa.

O valor do atributo pode ser qualquer valor válido como media query. Por exemplo, você pode informar ao navegador que o destino de um determinado link é mais adequado para dispositivos de tela pequena ou que o link é ideal para ser visualizado como impressão. Confira os exemplos abaixo:

<a href="arquivos/320" media="min-width: 320px">
<img src="images/v_320.jpg" alt="Imagem X para telas pequenas">
</a>
<a href="arquivos/1382" media="min-width: 1382px">
<img src="images/v_1382.jpg" alt="Imagem X para telas grandes">
</a>
<a href="print/1234.html" media="print">Versão para Impressão</a>

Perceba que a especificação não determina um comportamento para o navegador. Cabe ao desenvolvedor recuperar essa informação passada pelo navegador, interpretar e responder adequadamente.

O atributo ping

Outro atributo ainda mais controverso. Embora seja recomendado pela Mozilla e pelo WHATWG, não é endossado pelo W3C. E sua implementação pode colocar em choque usuários e administradores de sites. O que ele faz? O atributo ping especifica uma lista de outras URLs que devem ser notificadas quando o usuário clicar no link. Basicamente, é um atributo para rastreio.

O que o atributo está tentando fazer é oferecer suporte nativo nos navegadores àquilo que já é praticado através de referrers ou JavaScript. O atributo pode ter como valor uma ou mais URLs, separadas por espaço, que serão notificadas (receberão um ping, no jargão técnico) no caso do usuário for bem-sucedido em chegar no href do link.

Um exemplo:

<a href="http://www.codigofonte.com.br" ping="/track/log.asp http://www.minhasestatisticas.com?user=123456">Clique aqui</a>

A própria especificação da WHATWG alerta que o atributo é redundante diante das tecnologias já utilizadas para identificar links populares e outros dados estatísticos. Então, porque sugeri-lo? O objetivo é oferecer transparência para os usuários e a possibilidade que o navegador possa desabilitar essa função, caso o usuário assim deseje. Através do seu uso, poderá ficar claro para quem navega que o ato de clicar naquele link poderá gerar um relatório ou será registrado em algum outro endereço além daquele onde se está navegando. A sugestão é que os navegadores ofereçam a opção de bloquear esta habilidade. O Firefox o desabilita por padrão, apesar de oferecer suporte ao atributo, por exemplo.

A causa é nobre, mas certamente destinada ao fracasso. Na hipótese que o atributo passe a ser adotado em todos os navegadores, o que iria impedir que administradores de sites, agências de marketing e outros que necessitam destas notificações não continuem a usar os métodos praticados atualmente? Entretanto, sua adoção pode facilitar enormemente a tarefa e a transparência é sempre bem-vinda.

No momento, apenas Firefox, Safari e Chrome oferecem suporte ao atributo ping. Internet Explorer e Opera não tem suporte.