Como criar uma página de erro 404 personalizada com seu próprio design?

Como criar uma página de erro 404 personalizada com seu próprio design?
Links Rápidos

Auditoria SEO

Rastreie o site em busca de problemas técnicos e obtenha uma lista de tarefas prioritárias com guias detalhados sobre como corrigir.

Something went wrong. Please, try again later.
Sitechecker crozdesk rating Sitechecker crowd rating Sitechecker capterra rating
Sitechecker trusted company

Uma página de erro 404 é a página da Web exibida quando alguém insere um endereço da Web incorreto em seu navegador. É importante ter uma página de erro 404 personalizada, pois isso ajuda a melhorar a experiência do usuário e a evitar as penalidades do Google. Este artigo fornecerá instruções passo a passo sobre como criar sua própria página de erro 404 personalizada com seu próprio design, se você usa o WordPress ou não.

O que é um erro 404?

O status HTTP código 404 (ou “Página não encontrada”) indica que o servidor não conseguiu localizar o conteúdo solicitado pelo usuário. Basicamente, esta é uma página inexistente ou quebrada. Aqui está o texto que você normalmente verá exibido na página:

  • 404
  • Erro 404
  • 404 não encontrado
  • Página 404 não encontrada
  • Erro 404 não encontrado
  • HTTP 404 não encontrado

Há muitas razões pelas quais um erro 404 pode aparecer em sua página da Web – por exemplo, o site removeu sua página. Ocorre quando um link interno leva a uma página que não existe. Tais atos têm o potencial de degradar a experiência do usuário, bem como interromper a interligação de sites.

Outro motivo pode ser que o endereço URL foi digitado incorretamente pelo usuário. Talvez eles tenham tentado inserir manualmente um link direto e cometeram um erro de digitação. Também pode ser uma falha técnica — por exemplo, a página foi movida e o redirecionamento foi configurado incorretamente. O fato de a página ter sido removida do servidor do site não garante que ninguém tentará acessá-la. Ele será encontrado nos motores de busca por algum tempo. Além disso, as abas do navegador do usuário podem ter um link para uma página específica do site.

Por fim, também é possível que o servidor não esteja funcionando corretamente, embora isso aconteça muito raramente. O servidor pode ocasionalmente fornecer um erro 404 como resultado de um mau funcionamento. O cache DNS salva os locais (endereços IP) de servidores da Web que serviram recentemente a você páginas da Web. Para garantir que apenas os endereços IP atuais sejam usados, você pode limpá-lo. Depois de concluir os procedimentos apropriados, reinicie o navegador e abra a página para ver se consegue voltar a ela.

Por que uma página 404 é importante?

Quanto mais antigo for o seu site, maior a probabilidade de ocorrência de 404 páginas. A maioria do tráfego do site vem de pessoas digitando URLs diretamente na janela do navegador. Portanto, é lógico que esses visitantes esperam certas coisas quando chegam lá:

  1. Para ver o que eles estavam procurando
  2. Para não ser recebido com uma página de acesso negado ou qualquer outra coisa que pareça que eles não deveriam estar lá

Portanto, pense em 404 páginas como atendimento ao cliente. Não importa quão forte seja sua linha de produtos; um mau atendimento ao cliente pode prejudicar as vendas exponencialmente mais do que nenhum atendimento ao cliente. Não tome a lealdade do seu visitante (e, potencialmente, seu dinheiro) como garantida!

Uma página de erro 404 simplesmente permite que as pessoas saibam que inseriram um endereço incorreto em seu navegador da web. A maioria dos sites hoje em dia adiciona links de redirecionamento para algumas de suas páginas mais populares (como Home ou About Us) em sua página de erro 404, pois ninguém quer vasculhar dezenas de páginas antes de encontrar o que está procurando!

Mecanismos de pesquisa recomendados: Google, Yahoo, Bing

Uma página 404 personalizada é uma solução profissional que servirá como uma boa experiência do usuário, bem como uma marca para você. Além disso, as pessoas que visitam seu site não se perdem no ciberespaço quando clicam em algo que não existe! Basta mencionar em sua própria página onde eles deram errado.

Uma página 404 personalizada não é mais exigida pelo Google, mas o Google recompensa os sites que fazem esforços extras para ajudar os usuários a encontrar o que precisam. O que faz você se destacar de outras empresas? Como ser diferente direciona o tráfego para o seu site? Isso vale se você possui uma cafeteria local ou administra uma empresa de comércio eletrônico que vende itens em todo o mundo. A melhor maneira de responder às duas perguntas acima é criar uma página 404 personalizada que represente bem sua marca e dê a todos que visitam seu site confiança em você como provedor de atendimento ao cliente.

Configuração técnica de SEO de uma página 404

Em primeiro lugar, quando alguém acessa um URL antigo ou incorreto, espera ver algo relevante para o que está procurando. É melhor redirecionar os visitantes imediatamente do que decepcioná-los mais tarde com conteúdo irrelevante. Sua página ausente pode trazer tráfego de mecanismos de pesquisa se não houver outros resultados de alta qualidade em seu site; o tráfego direto é sempre melhor do que o tráfego de bots de mecanismos de pesquisa. E, finalmente, é bom ter uma página de erro 404 personalizada e bonita que complemente o design do seu site, em vez de misturá-lo. Isso melhorará sua experiência do usuário e a classificação do Google ao mesmo tempo!

Se você mesmo desenvolveu seu site, já deve saber como são esses erros. No entanto, a criação de uma nova página de erro personalizada depende do tipo de CMS usado em seu site e se ele fornece plugins especiais para essa finalidade (discutido em detalhes abaixo).

Isso nos leva à pergunta: as páginas de erro 404 são boas ou ruins para SEO? Em suma, eles são bons e ruins. Em primeiro lugar, eles podem impedir a classificação de palavras-chave se não forem corrigidos. Quando as páginas da Web que antes estavam ativas tornam-se 404 não encontradas, todas as palavras-chave que costumavam classificar para essa página da Web começam a sair das SERPs. A perda de tráfego orgânico ocorre quando as palavras-chave começam a perder relevância para o site. Se a página 404 não for corrigida, o site eventualmente deixará de ser classificado para esse termo e qualquer tráfego orgânico gerado por essas palavras-chave será perdido. Isso é conhecido como sangramento de palavra-chave; afeta principalmente sites maiores, mas pode afetar qualquer site que seja negligenciado.

Além disso, muitas pessoas acreditam que a indexação do site e sua posição nos resultados da pesquisa são ambos muito afetados por erros 404, mas essa suposição é incorreta na grande maioria das circunstâncias. Para uma melhor otimização do site, é crucial entender os elementos SERP. O que acontece com uma página como esta quando um robô se depara com ela? Se estiver no índice, será removido; se não for, o bot não irá escaneá-lo. Isso é compreensível, uma vez que não é mais informativo ou útil. No entanto, você deve estar ciente da possibilidade de erros SOFT. O SOFT 404 não é uma resposta real do servidor, mas sim uma tag que os mecanismos de pesquisa anexam às páginas após um rastreamento.

A seguir estão as razões pelas quais os mecanismos de pesquisa tomam essas decisões:

  • Na página, há pouco ou nenhum conteúdo;
  • Há um redirecionamento para uma página que não atende às necessidades dos usuários;
  • Não há resposta do servidor 404 ou 410 para a página inexistente.

Por outro lado, páginas 404 podem levar a um SEO ruim. Quando uma página da Web não é encontrada, as palavras-chave nessa página da Web não são detectadas, e é por isso que os redirecionamentos 301 podem ajudar. Os robôs de busca pesquisam o site para identificar palavras-chave para classificar o site. Se um redirecionamento 301 estiver em vigor, os searchbots identificarão as palavras-chave para classificar o novo URL da página da Web e o site manterá suas classificações de palavras-chave. Há mais algumas variáveis ​​a serem consideradas, mas isso resume o procedimento.

As páginas de erro 404 também podem impedir a indexação de páginas da Web (somente em alguns casos). Eles podem impedir que os searchbots rastreiem o restante das páginas vitais de um site. Dependendo do problema, os mecanismos de pesquisa podem desindexar partes inteiras (supondo que as páginas da Web não sejam mais necessárias) e 410 páginas da Web verdadeiras, o que significa TERMINADO. Se o SEO de uma página da Web ainda não foi ajustado, mesmo que tenha sido otimizado adequadamente, os mecanismos de pesquisa não verão as novas modificações até que os searchbots rastreiem o site novamente.

Qualquer link interno nessas páginas da Web será perdido se a página da Web ou, pior ainda, a pasta de URL inteira não for encontrada. Isso prejudicará ainda mais a indexação e a classificação de palavras-chave. Se você não for cuidadoso, o SEO pode ter um efeito dominó. Quando o rastreamento do searchbot está desabilitado, todo o SEO de um site sofre; até que as páginas sejam digitalizadas novamente, o RankBrain utilizará o cache mais recente da página da web para realizar suas verificações e balanços.

Por outro lado, quando os URLs das páginas estão quebrados ou nunca existiram, os mecanismos de pesquisa, os visitantes do site e os webmasters recebem um erro 404.

Isso permite que os desenvolvedores resolvam o problema para futuros visitantes do site se puderem determinar onde esses códigos de erro aparecem, mantendo o poder da página que existia. Isso é conhecido como construção de backlink quebrado. Você não saberá que a página – e, portanto, o usuário – está encontrando um erro, a menos que você envie um código de resposta 404.

Corrigir todos os erros 404 no site

Rastreie seu site, detecte todos os links quebrados e corrija-os imediatamente

Something went wrong. Please, try again later.
Sitechecker rating on crozdesk Sitechecker rating on crowd Sitechecker rating on capterra

Como criar uma página 404 personalizada?

Criar uma página 404 personalizada requer conhecimento básico de código e design. Se você tiver alguma experiência com isso, poderá criá-lo você mesmo – mas se não, é melhor contratar um web designer.

O método começa com a criação de uma página da Web típica com todos os elementos necessários para sua página 404. Lembre-se de incluir uma declaração alegre explicando por que um visitante chegou a esta página, uma caixa de pesquisa para que eles possam descobrir o que estão procurando e, possivelmente, um mapa do site para que possam optar por ir para outro lugar.

É crucial fornecer à sua página 404 um nome exclusivo. Então, no diretório raiz do seu servidor/espaço web, carregue sua página. No entanto, muitas pessoas agora estão usando plugins como o WordPress, o que facilita a criação de uma página 404 personalizada sem a necessidade de codificação.

Mantenha os seguintes objetivos em mente ao aprender a desenvolver uma excelente página 404:

  • Atrair a atenção dos usuários;
  • Explique o que ocorreu;
  • Sugerir uma solução para o problema.

Quando se trata de criar sua própria página 404, os mecanismos de pesquisa aconselham você a fazer o seguinte.

Google

  • A página deve ser projetada no mesmo estilo do site principal (incluindo navegação);
  • Forneça links para os artigos mais populares, bem como uma caixa de comentários;
  • Permita que seus usuários relatem links quebrados.

Yandex

Seu design deve ser distinto do restante do site; por exemplo, ao construir uma página, você deve usar cores diferentes ou talvez evitar o uso de recursos visuais.

Sugestões gerais

Deve incluir um link para a página inicial, bem como uma mensagem educada informando ao usuário que a página solicitada não está disponível.

As sugestões anteriores não são diretrizes absolutas para 404 páginas. Tudo depende do assunto do site e do público-alvo. Uma linha de pesquisa é importante para uma loja virtual e as informações de contato são importantes para um site que oferece serviços.

O que uma página 404 deve incluir?

Os web designers devem sempre considerar as páginas 404 como uma oportunidade de branding e melhorar a experiência do usuário. Considere incorporar elementos criativos e informativos em seu design de página de erro para reduzir a taxa de rejeição do seu site. A taxa de rejeição refere-se a quantas pessoas saem do seu site depois de visualizar apenas uma página.

Embora existam vários fatores que influenciam a taxa de rejeição, como a otimização do mecanismo de pesquisa, a maioria das devoluções ocorre porque os usuários acham que encontraram o que estavam procurando e não veem motivo para permanecer em seu site. Em outras palavras, se as pessoas não ficarem tempo suficiente para obter algo do seu conteúdo ou publicidade, a taxa de rejeição aumentará. Existem três causas principais de altas taxas de rejeição:

  • Não dar uma frase de chamariz clara
  • Não fornecer aos leitores o que eles procuram nas páginas de destino
  • Fazer com que os visitantes trabalhem muito para encontrar informações

Confira estas maneiras práticas de reduzir a taxa de rejeição do seu site e ganhar mais dinheiro com cada cliente que você tem:

1. Identifique claramente a finalidade e o CTA de cada página: A finalidade de cada página do seu site deve ser sempre muito clara, inclusive quando alguém a acessa por meio de um resultado de pesquisa ou outro link. Se não for imediatamente óbvio para os leitores onde eles foram parar e o que eles conseguirão ao permanecer em seu site, os visitantes não se incomodarão em ficar por aqui. Você pode obter clareza de várias maneiras; escolha CTAs apropriados para cada situação única.

2. Descreva o que está faltando: fornecer contexto pode incentivar os visitantes a permanecerem por perto, mesmo que não tenham chegado a um destino específico. Por exemplo, suponha que você queira criar um perfil no LinkedIn, mas de alguma forma acaba em uma página inicial do Yahoo. Quando o Yahoo mostra sua famosa mensagem de erro 404 File Not Found, você sabe o que deu errado? Provavelmente, você simplesmente digitou errado um URL. Ao indicar para onde os visitantes devem ir (e talvez até sugerir URLs alternativos), as páginas 404 personalizadas permitem que os visitantes se recuperem rapidamente de erros.

3. Remova etapas desnecessárias: ao criar sua página 404 personalizada, pergunte a si mesmo se isso confundiria ou frustraria novos leitores que chegam lá acidentalmente. Por exemplo, imagine que você administra uma joalheria e usa o Facebook para promover seus produtos. Digamos que alguém clique em um link para sua página do Facebook e chegue à sua página 404. Esse indivíduo provavelmente espera ver links para produtos relacionados ou alguma indicação do que os trouxe até lá. Em vez disso, eles não veem nada relevante. Essa falta de explicação chocante provavelmente fará com que o usuário se sinta frustrado, confuso e indesejado: exatamente o que você espera evitar em seu estado de espírito atual.

4. Explique aos usuários o que eles estão vendo: dê a seus visitantes uma dica sobre que tipo de erro os levou a essa página, por exemplo, “Opa, não conseguimos encontrar o que você estava procurando !” ou “Desculpe, não temos uma versão em inglês desta página!” Use verbos de ação e POV em primeira pessoa (não consigo encontrar… e não oferecemos… em vez de Você não pode… e não oferecemos…) para manter os leitores envolvidos enquanto eles procuram exatamente o que precisam.

Ao criar sua página de erro 404 personalizada, lembre-se dessas quatro dicas para ajudar a torná-la informativa e envolvente. Evite deixar que situações frustrantes desencorajem futuros leitores de agir em seu site. Uma das maiores razões para a má usabilidade do site é um sistema de navegação mal organizado. Os visitantes precisam ser capazes de se orientar facilmente se quiserem permanecer engajados e produtivos, por isso é importante que você planeje com antecedência antes de lançar seu site.

Como criar uma página 404 no WordPress?

Comece olhando para o seu painel do WordPress; você verá várias opções para escolher no lado esquerdo da tela. Clique em “Aparências” em Produtos e escolha “Página 404”.

como criar uma página 404 no WordPress

Você pode inserir algumas informações sobre o tipo de postagem (por exemplo, Mensagem de erro), mas tudo o que você realmente precisa é de algum texto, por exemplo, “Página não encontrada”. Certifique-se de adicionar todos os elementos mencionados acima e clique em Publicar quando terminar. Você também pode usar plugins para criar formulários de contato, melhorar o SEO, adicionar widgets, etc.

WordPress Plugins

Aqui está o tutorial super rápido e simples sobre como fazê-lo com o plugin Elementor.

Como criar criadores no site: Wix, Shopify e outros

A maioria dos sites usa código JavaScript personalizado ou software de terceiros para criar suas páginas 404 personalizadas. O Wix, por exemplo, inclui uma ferramenta que permite que você crie sua própria página 404 não encontrada adequada à sua marca. Essa ferramenta gera um código da web que você pode copiar e colar na página inicial do seu site, o que significa que ele aparecerá sempre que alguém tentar visitar um link quebrado em seu site.

Como criar uma página 404 no Wix

Se preferir Shopify como sua plataforma de escolha, você pode escolher entre seus modelos padrão ou criar seu próprio layout de página 404 personalizado:

Shopify Custom 404 Page Layout

Você também pode adicionar um plano de fundo personalizado e elementos como uma barra de pesquisa para melhorar a experiência do usuário.

Erro 404 Práticas recomendadas de design de página

Embora existam muitos modelos de design de página de erro 404 excelentes, o conteúdo e o estilo exclusivos do seu site podem oferecer uma vantagem ao fornecer uma experiência de usuário aprimorada. Aqui estão algumas práticas recomendadas para design de página de erro 404 que você pode usar como inspiração. Tenha-os em mente ao selecionar ou criar qualquer tipo de modelo de web design; eles ajudarão você a criar uma página de erro 404 responsiva que se sente em casa em seu site.

  • Não faça os usuários procurarem o que eles estão procurando: uma página de erro 404 personalizada deve guiar os usuários que clicaram em um link quebrado de volta para onde eles querem estar, em vez de forçá-los a entrar várias etapas para voltar aos trilhos.
  • Inclua uma breve descrição de sua empresa em cada página de erro 404 — e vincule-a a cada URL potencialmente corrompido, para que os visitantes nunca se sintam perdidos enquanto procuram!
  • Adicione informações úteis sobre um link quebrado: mesmo que você não forneça um substituto para o conteúdo ausente, considere adicionar outras informações relevantes sobre por que um conteúdo específico não está disponível no momento ( ou seja, os itens em promoção só estão disponíveis online até 20 de janeiro). Isso adiciona contexto e utilidade sem fazer com que os visitantes cliquem em mais links.
  • Inclua uma frase de chamariz óbvia: se você tiver uma meta de conversão forte associada a cada visita à página de erro 404, adicione um botão de CTA “clique aqui” para incentivar os visitantes a explorar mais seu site .
  • Quanto mais limpa for sua página de erro 404 e menos erros perturbadores aparecerem, mais fácil será para alguém agir imediatamente após ver a sua!
  • Use ferramentas de redirecionamento sempre que possível: redirecionar o tráfego por meio de script é geralmente muito mais rápido do que forçar cada visitante a sair do site atual antes de ser redirecionado para outro lugar.
  • Se você estiver tentando coletar informações de contato de visitantes que inseriram manualmente um URL de página de destino ausente, usar scripts de redirecionamento E um formulário rápido que permita que as pessoas insiram seus próprios endereços de e-mail pode ser ideal .
  • Seja honesto em sua explicação: a honestidade vende, mesmo quando se trata de explicar por que algo não existe mais. Diga o mínimo possível, mas não mais do que o necessário; informe os clientes imediatamente por que eles acessaram uma página de erro 404.

Lidere clientes pelo exemplo: implemente páginas de erro 404 personalizadas em todos os seus sites, mesmo aqueles que não são de sua propriedade. Suas mensagens consistentes dão aos clientes a tranquilidade de que eles não encontraram acidentalmente um link ruim em algum lugar ao longo de sua jornada de navegação e deixa claro para todos exatamente o quão sério você leva seus empreendimentos comerciais. Você odiaria perder um cliente em potencial porque ele erroneamente ficou frustrado e abandonou o barco, por isso é uma prática inteligente evitar possíveis problemas. Confira as seguintes ideias de design para se inspirar:

Verificador de sites

Sitechecker's custom 404 page

Formulários WP

WPForm's custom 404 page

Disney

Disney's custom 404 page

Netflix

página 404 personalizada da Netflix

Tripadvisor

página 404 personalizada do Tripadvisor

GitHub

Github's custom 404 page

Ahrefs

Ahref's custom 404 page

YouTube

página 404 personalizada do YouTube

Amazônia

Amazon's custom 404 page

Linkedin

página 404 personalizada do Linkedin

Quando se trata de criar sua própria página 404, você pode contratar um freelancer, trabalhar com uma agência de design ou fazer você mesmo. Sua decisão deve depender do orçamento que você possui e das habilidades necessárias para concluir a tarefa.

Conclusão

Embora você deva garantir que suas páginas 404 sejam de alto nível, é melhor minimizar sua existência. Felizmente, existem algumas correções simples para páginas de erro 404. Em primeiro lugar, recarregue a página, se necessário. Por causa de uma conexão de internet ruim, uma página da web pode não carregar corretamente às vezes. Basta usar o botão “atualizar” no seu navegador.

Você também pode tentar limpar o cache e os cookies do seu computador. Basta abrir um site ou página da Web em um navegador diferente. Se o erro HTTP 404 aparecer apenas em uma máquina, o problema pode estar no seu navegador. Se o site estiver funcional, você deve limpar o cache e os cookies do seu navegador. Siga este guia abrangente sobre o cache do Google para obter informações adicionais sobre o cache do navegador e como remover o cache do seu navegador.

Além disso, faça o seu caminho pelo site. Use uma pesquisa no site para encontrar uma página da Web necessária; basta digitar termos precisos para encontrar a página que você está procurando. Você pode entrar em contato diretamente com o webmaster se isso não funcionar.

Outras dificuldades com páginas 4xx devem ser resolvidas, como quando o URL da página AMP (4XX) não é detectado, as páginas 4xx obtêm tráfego orgânico ou as páginas 4xx são encontradas no Sitemap.

Verifique se há erros no seu site

Something went wrong. Please, try again later.
close