Segurança ao Usar URLs sem Especificar um Protocolo

Resposta Rápida

Use URLs que se adaptam automaticamente ao protocolo da página atual. Para isso, insira // antes do endereço, e o navegador selecionará o protocolo apropriado (HTTP ou HTTPS) por conta própria.

Exemplo:

HTMLCopy code
<!-- O esquilo lhe oferece uma bolota [URL] 🐿️ -->
<a href="//exemplo.com/pagina">Olá, página!</a>

Essa abordagem garante segurança e compatibilidade sem a necessidade de especificar explicitamente o protocolo.

Como Funcionam as URLs Relativas

A ausência de um protocolo em uma URL permite que ela utilize o mesmo protocolo da página em que o link é aberto. Isso é conhecido como "URL relativa ao protocolo", de acordo com RFC 3986, e ajuda a evitar problemas de conteúdo misto quando uma página HTTPS carrega elementos via HTTP, criando assim potenciais ameaças de segurança nos navegadores.

Nuances e Limitações

Apesar da sua simplicidade, essa abordagem possui limitações. Navegadores mais antigos, como IE7 e IE8, podem não lidar corretamente com essas URLs, especialmente dentro de tags <link> ou diretivas CSS como @import. Isso pode levar a erros de carregamento de arquivos.

Origem e Reconhecimento

A URL relativa ao protocolo se tornou conhecida graças ao trabalho de Paul Irish. Seus artigos introduziram essa técnica, que tem sido apoiada por recursos como o guia HTML/CSS do Google e o HTML5 Boilerplate. No entanto, deve-se ter cautela ao usar essa abordagem, pois problemas podem surgir em navegadores como IE6 ou serviços como o Google Analytics.

Testes

Antes de usar essas URLs, é importante realizar testes abrangentes de compatibilidade em diferentes navegadores. Ferramentas como "Can I Use" podem ajudar a identificar potenciais problemas e preparar você para a resolução de problemas.

Visualização

Uma ótima analogia para uma URL relativa é um adaptador universal de energia para diversos dispositivos:

MARKDOWNCopy code
| Dispositivo         | Adaptador             |
| ------------------- | --------------------- |
| Smartphone (📱)     | Adaptador (🔌➖🔗)     |
| Tablet (💊)         | Adaptador (🔌➖🔗)     |
| Laptop (💻)         | Adaptador (🔌➖🔗)     |

Da mesma forma, URLs sem um protocolo explicitamente declarado se adaptam ao esquema da página atual.

PLAINTEXTCopy code
Esquema da página atual: HTTPS 🔒
URL: //exemplo.com/caminho ➡️ Torna-se HTTPS://exemplo.com/caminho

Esquema da página atual: HTTP 🌍
URL: //exemplo.com/caminho ➡️ Torna-se HTTP://exemplo.com/caminho

É importante considerar o impacto dessas URLs no SEO—um gerenciamento adequado aumenta a visibilidade do site nos mecanismos de busca.

SEO e Acessibilidade

URLs relativas melhoram a segurança e a compatibilidade, afetando positivamente o SEO e tornando o conteúdo mais acessível.

Precauções

Com o passar do tempo, o uso de HTTPS tornou-se uma prioridade em relação às URLs relativas para garantir um alto nível de segurança. Portanto, apesar da conveniência das URLs relativas, é aconselhável usar protocolos criptografados.

Materiais Úteis

1. O que é uma URL? — Um guia detalhado sobre a estrutura de URLs;
2. URIs legais para a Web Semântica — Um guia sobre métodos de gerenciamento de URIs do W3C;
3. Discussão sobre o uso de URLs relativas no Stack Overflow;
4. Como evitar conteúdo misto — Dicas para garantir a segurança do site;
5. Informações gerais sobre Esquemas de URI e URLs Relativas;
6. Suporte a Navegador para URLs Relativas;
7. Gerenciando Parâmetros de URL do ponto de vista de SEO.

Video

Navigation

• Segurança ao Usar URLs sem Especificar um Protocolo
• Resposta Rápida
• Como Funcionam as URLs Relativas
• Nuances e Limitações
• Origem e Reconhecimento
• Testes
• Visualização
• SEO e Acessibilidade
• Precauções
• Materiais Úteis
• Video