O HTML Redirect pode ser necessário quando você precisar realizar o redirecionamento de uma página para outra. Portanto, é importante entender o que é, como funciona e como utilizar o HTML Redirect. Uma das formas mais comuns de se redirecionar uma página, é através do Meta refresh redirect.
Conteúdo
O que é o HTML Redirect
Ao possuir mais que um domínio ou diversas páginas web, é possível que você precisar utilizar o HTML Redirect. O HTML Redirect nada mais é que uma forma de redirecionar uma página para outra através do próprio HTML. Podemos estar fazendo o redirecionamento através do metadados. Também é possível utilizar o HTML Redirect a partir do JavaScript, PHP e htaccess. Vamos então estudar esses métodos nos tópicos abaixo.
Um redirecionamento em HTML também pode ser feito através do seu painel de controle de uma forma mais fácil, pela opção redirecionamento de URL .
Método 1 – Meta refresh redirect: HTML Redirect através de Metadados
Para poder criar um sistema de redirecionamento do site, basta estar incluindo a tag <meta> ao <head> da nossa página com o o atributo http-equiv=”refresh”. Posteriormente, utilizamos o atributo content para indicar em quanto tempo, após carregar a página, o redirecionamento acontecerá e qual será a URL destino. Veja a sintaxe do HTML Redirect no exemplo de código abaixo:
<meta http-equiv="refresh" content="tempo em segundos; URL='url da pagina destino '"/>
Observe então o exemplo de um documento HTML com o metadados de redirecionamento, através do código abaixo:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Meu Redirect</title>
<meta http-equiv="refresh" content="5; URL='https://www.homehost.com.br/'"/>
</head>
<body>
...
</body>
</html> No exemplo acima, nossa página será aberta, e após 5 segundos, a mesma será redirecionada para ‘https://www.homehost.com.br/’. Porém, também podemos colocar para que o redirecionamento ocorra de imediato, para isso utilizamos o valor do tempo como 0 (zero):
<meta http-equiv="refresh" content="0; URL='https://www.homehost.com.br/'"/>
Dessa forma, assim que abrir a página, a mesma já será automaticamente redirecionado para ‘https://www.homehost.com.br/’.
Esse tipo de redirecionamento é conhecido como código 301. O código “301” é interpretado como “movido permanentemente”. Ou seja, esse código informa aos visitantes do site e, também, aos mecanismos de pesquisa que sua página da web foi movida permanentemente para um novo local com conteúdo equivalente. O redirecionamento 301 é o mais indicado para melhorar o SEO do seu site.
Além disso, o meta refresh redirect, que é um tipo de HTML Redirect é um redirecionamento realizado do lado do cliente, onde é informado ao navegador para solicitar outra página.
É importante estar atendo que nem todos os navegadores antigos suportam esse tipo de metadados. Portanto, recomenda-se que sempre deixe uma mensagem com um link para a página de destino. Vejamos então o exemplo abaixo:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Meu Redirect</title>
<meta http-equiv="refresh" content="0; URL='https://www.homehost.com.br/'"/>
</head>
<body>
<p>
O conteúdo desta página foi movido permanentemente para o link:
<a href="https://www.homehost.com.br/">www.homehost.com.br/</a>
</p>
</body>
</html> Desta forma, caso o navegador não suporte o HTML Redirect, você garante que o mesmo terá uma opção para ser direcionado a página desejada.
Método 2 – Redirecionamento através do JavaScript
Assim como o método anteriormente explicado, podemos utilizar o javaScript no código HTML para poder estar redirecionando o usuário. Este tipo de redirecionamento também é realizado do lado do cliente.
Para realizar este redirecionamento basta incluir um script no nosso documento HTML. Portanto, vejamos abaixo a função do JavaScript para realizar o redirecionamento:
window.location.href='url';
Esta função retorna a URL digitada. Ou seja, redireciona para a URL digitada. veja o exemplo abaixo desta função do JavaScript:
Portanto, vejamos como aplicar isso em um documento HTML no exemplo abaixo:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Meu Redirect</title>
</head>
<body>
<p>
O conteúdo desta página foi movido permanentemente para o link:
<a href="https://www.homehost.com.br/">www.homehost.com.br/</a>
</p>
<script>
window.location.href='https://www.homehost.com.br/';
</script>
</body>
</html> Também podemos utilizar apenas a função window.location do javascript, e teremos o mesmo resultado. Vejamos os exemplos abaixo:
window.location='url';
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>HTML Redirect</title>
</head>
<body>
<p>
O conteúdo desta página foi movido permanentemente para o link:
<a href="https://www.homehost.com.br/">www.homehost.com.br/</a>
</p>
<script>
window.location = "https://www.homehost.com.br/"
</script>
</body>
</html> Você pode estar estudando mais sobre as funções de Redirect HTML através do JavaScript a partir deste artigo da W3Docs.
Método 3 – Redirecionamento através do PHP
Diferentemente do Redirecionamento através do metadados e também através do JavaScript, ao utilizar o PHP, fazemos o redirecionamento do lado do servidor, e não mais do lado do cliente. Isso acontece devido ao fato de o PHP ser uma linguagem de programação Back End, ou seja, que roda dentro do servidor.
Para realizar o HTML Redirect com o PHP, basta utilizar a função header() e a função exit() no inicio do nosso documento. Observe que é importante que este documento seja salvo com a extensão .php. Também podemos apenas estar criando um arquivo nomeado de index.php com as funções de redirecionamento e incluir no diretório da página que deve realizar o redirecionamento.
A função header() envia um cabeçalho HTTP diretamente para o cliente. Dessa forma, quando cliente acessa sua página, automaticamente o servidor estará retornando, através do PHP, um novo cabeçalho, que no caso será descrito pela função header(). A função exit() apenas servirá para garantir que a página mostre o conteúdo restante, e, portanto, realize o redirecionamento instantaneamente.
Na função header() utilizamos o Location, onde informamos a URL a qual será redirecionado a página. Dessa forma, teremos o seguinte código PHP:
<?php
header('Location: url');
exit();
?> Portanto vejamos o exemplo abaixo:
<?php
header('Location: https://www.homehost.com.br/');
exit();
?> Porém, no caso acima, o php vai definir como o padrão de redirecionamento o código 302. Dessa forma, será entendido que é um redirecionamento temporário, geralmente utilizado para páginas em manutenção. Portanto, podemos complementar a nossa função para definir o padrão de código. Vamos então exemplificar como criar um código 301, ou seja, um redirecionamento Permanente:
<?php
header('Location: https://www.homehost.com.br/', true, 301);
exit();
?> Desta forma, conseguimos então indicar aos usuários, assim como aos mecanismos de busca, qual é o tipo de redirecionamento que estamos fazendo.
Portanto, vejamos agora o exemplo abaixo:
<?php
header('Location: https://www.homehost.com.br/', true, 301);
exit();
?> Você pode ainda estudar mais sobre o HTML Redirect através do PHP a partir do artigo da W3Docs.
Método 4 – Redirecionar através de htaccess
Para redirecionar uma página usando o arquivo .htaccess, você pode usar as regras de redirecionamento disponíveis no Apache. O arquivo .htaccess é um arquivo de configuração do servidor web Apache, que permite definir várias diretivas para controlar o comportamento do servidor.
Aqui estão alguns exemplos de como redirecionar páginas usando o arquivo .htaccess:
Redirecionamento 301 (permanente):
Redirect 301 /pagina-atual.html http://www.seusite.com/nova-pagina.htmlRedirecionamento 302 (temporário):
Redirect 302 /pagina-atual.html http://www.seusite.com/nova-pagina.htmlRedirecionar com base em expressões regulares:
RewriteEngine On
RewriteRule ^pagina-atual.html$ http://www.seusite.com/nova-pagina.html [R=301,L]
Redirecionamento para um diretório específico:
Redirect /pasta-atual http://www.seusite.com/novo-diretorio/Certifique-se de substituir “pagina-atual.html” e “http://www.seusite.com/nova-pagina.html” pelos caminhos corretos para as suas páginas. Além disso, observe que o redirecionamento 301 é usado para redirecionamentos permanentes, enquanto o redirecionamento 302 é usado para redirecionamentos temporários.
Lembre-se de que o arquivo .htaccess deve estar localizado no diretório raiz do seu site e que o servidor Apache deve ter a opção “AllowOverride” ativada para permitir a leitura do arquivo .htaccess.
Por fim, é importante ter cuidado ao modificar o arquivo .htaccess, pois qualquer erro pode causar problemas no funcionamento do seu site. Além disso, é recomendável fazer um backup do arquivo antes de fazer alterações e testar cuidadosamente o redirecionamento para garantir que esteja funcionando corretamente.
Por que usar o HTML Redirect 301 sempre que possível
Fazer redirecionamentos 301 é uma prática fundamental para o SEO (Search Engine Optimization) e traz diversos benefícios para o seu site. O redirecionamento 301 indica aos mecanismos de busca que uma página foi permanentemente movida para um novo endereço. Isso é importante para manter sua classificação nos resultados de pesquisa e garantir que você não perca tráfego e visibilidade.
Quando você redireciona uma página antiga para uma nova, os mecanismos de busca transferem a autoridade e os rankings da página antiga para a nova. Isso preserva a autoridade de busca que você construiu ao longo do tempo e ajuda a manter ou até mesmo melhorar suas posições nos resultados de pesquisa.
O Google valoriza muito os redirecionamentos 301
Além disso, o redirecionamento 301 também melhora a experiência do usuário. Ao redirecionar corretamente as páginas do seu site, você evita que os visitantes encontrem links quebrados ou páginas de erro. Em vez disso, eles serão automaticamente redirecionados para a página correta, proporcionando uma experiência de navegação mais suave e evitando que eles abandonem o site por frustração.
Outra situação em que o redirecionamento 301 é útil é quando você precisa atualizar a estrutura das URLs do seu site. Ao redirecionar as URLs antigas para as novas, você informa aos mecanismos de busca que a página foi movida permanentemente para um novo endereço. Isso ajuda a atualizar os índices dos mecanismos de busca e garante que os usuários encontrem a versão mais recente do seu conteúdo.
Em resumo, o redirecionamento 301 é uma prática importante para manter a visibilidade do seu site nos mecanismos de busca, preservar a autoridade de busca, melhorar a experiência do usuário e facilitar atualizações na estrutura das URLs. Certifique-se de implementar corretamente os redirecionamentos 301 sempre que necessário para obter os benefícios de SEO e oferecer uma melhor experiência de navegação para os visitantes do seu site.
Recomendações sobre Redirecionamentos
Você pode estar utilizando a forma que melhor encontrar para realizar o redirecionamento. Apesar de a função de HTML Redirect com metadados ser muito mais prática e também garantir sua funcionalidade, a função através do PHP garante um maior controle sobre o redirecionamento, além de funcionar do lado do servidor. Também é possível estar fazendo um redirecionamento através de outras linguagens, assim como também através do arquivos .htaccess.
Portanto, para fazer um redirecionamento, recomendamos que escolha a linguagem de programação (ou de marcação) que você mais utiliza ou tenha preferência.
Enfim, com este artigo, você possui um manual completo para poder utilizar técnicas de HTML Redirect, e assim poder redirecionar suas páginas corretamente! Recomendamos que pratiquem os exemplos acima. Caso pretendam utilizar nas suas páginas, recomendamos que antes realizem o teste para garantir que tudo funcionará perfeitamente.
