Como criar uma ótima página 404 para seus usuários

Alcançar uma página 404 não é uma experiência agradável. Mas há coisas que você pode fazer para garantir que não seja a experiência final que um usuário terá com seu site.

Para criar uma ótima página 404, você precisa saber quais elementos são mais úteis para os usuários e podem ajudar sua página a se destacar.

Aqui está uma lista de 6 recursos para ajudá-lo a aproveitar ao máximo sua página 404.

O que é um código 404?

404 é um dos códigos de status HTTP que aparece quando uma página não pode ser encontrada.

404 pertence ao grupo 4xx, o que indica que é um erro do lado do cliente. Mais especificamente, significa que o cliente chegou ao seu servidor, mas o servidor não encontrou o arquivo solicitado.

O código 404 pode aparecer por vários motivos, como:

• A página foi deletada,
• O usuário cometeu um erro de digitação ao digitar a URL,
• O link apontando para a página estava incorreto.

Não importa o motivo do código 404, os usuários não poderão acessar a página porque ela simplesmente não pode ser encontrada.

A página que o usuário verá em vez da página ausente está sob seu controle. Suas opções incluem:

• Uma página 404 padrão, ou
• Uma página 404 personalizada.

Uma página 404 padrão e não personalizada pode conter um texto simples em um fundo branco que diz apenas “Não encontrado”. Seu servidor gera esta página automaticamente.

Por outro lado, você pode optar por personalizar sua página 404 – projete-a para caber no restante do seu site e selecione os elementos que deseja incluir.

Por que você deve criar uma página 404 personalizada

Uma página 404 personalizada bem projetada é benéfica tanto para os usuários quanto para o seu negócio.

Quando um usuário entra em uma página 404 padrão, ele apenas entende que algo deu errado e a página não foi encontrada. Eles não sabem o que aconteceu ou o que devem fazer a seguir.

Como resultado, seu cliente pode sair do seu site sem satisfazer suas necessidades. Isso está longe de ser o ideal. Um usuário não ficou satisfeito com a pesquisa e você perdeu o negócio.

Com uma página 404 personalizada, você pode alterar a página padrão e inútil para algo útil para os usuários e sua empresa.

Uma página 404 personalizada permite:

• Ajude os usuários a encontrar as informações que estão procurando,
• Incentive os usuários a explorar sua página,
• Mostre a voz e a criatividade da sua marca.

Além disso, a criação de uma página 404 personalizada é recomendada pelo Google .

Se você tiver acesso aos arquivos de configuração do servidor, poderá tornar essas páginas de erro úteis para os usuários personalizando-as. Uma boa página 404 personalizada ajuda as pessoas a encontrar as informações que estão procurando e também fornece outros conteúdos úteis que incentivam as pessoas a explorar mais seu site.

fonte: Google

A citação afirma claramente que o Google considera uma página 404 personalizada útil para o usuário e incentiva os proprietários de sites a personalizar suas páginas 404.

Como criar uma ótima página 404 personalizada

Mesmo se você personalizar totalmente sua página 404, certifique-se de que o servidor ainda retorne um código de status HTTP 404. É uma prática ruim configurar um código 200, sugerindo uma resposta bem-sucedida quando a página realmente não existe.

Ao decidir o que incluir em sua página 404, um dos elementos essenciais é uma mensagem que indique claramente que é uma página de erro . Informe os usuários que algo deu errado de forma amigável e direta.

Mas isso é apenas o começo. Aqui estão os principais recursos que você pode adicionar à sua página 404 personalizada para torná-la mais útil:

• Uma barra de pesquisa,
• Uma lista de recursos disponíveis em seu site,
• Um botão de CTA,
• Links para seu conteúdo principal,
• Design alinhado à sua marca.

A chave para uma boa página 404 é sua utilidade para os usuários. Você não precisa incluir todos os elementos da lista acima – apenas aqueles que ajudarão seus usuários a encontrar o caminho em seu site.

Limpar mensagem de erro

Uma boa página 404 deve sempre incluir uma mensagem clara de que é uma página de erro. Não importa o design escolhido, você deve sempre informar aos usuários que algo deu errado e a página não foi encontrada.

Ikea faz isso muito bem. Eles fornecem uma mensagem clara que inclui o código 404 e uma breve explicação que o torna facilmente compreensível para os usuários.

Barra de pesquisa

Uma barra de pesquisa permite que os usuários que procuram um conteúdo específico dêem outra chance e pesquisem o que estavam procurando em seu site.

Um bom exemplo de página 404 com barra de pesquisa é o Moz.com:

Portanto, se você estava procurando por algo específico no Moz.com, mas não encontrou, pode procurar novamente na página 404.

Lista de recursos

Se um usuário acabou em uma página 404, mas não tinha uma coisa específica em mente para digitar na barra de pesquisa, você pode fornecer uma lista de recursos que podem ser encontrados em seu site.

Backcountry tem uma página 404 personalizada com um design simples que se encaixa no site e uma lista de páginas essenciais.

Esta página não é apenas útil para os usuários, mas também permite que a Backcountry mostre seu conteúdo e incentive as pessoas a explorar o site.

Outro exemplo de página 404 com uma lista de recursos é o Tripadvisor. Com um pouco de humor e quatro botões simples, o Tripadvisor oferece uma opção fácil de navegar pelas seções que mais podem interessar aos usuários.

Botão CTA

Ao incluir um botão de CTA, você pode mostrar aos usuários o próximo passo que eles podem dar.

O uso mais simples de um botão CTA é direcionar os usuários para sua página inicial . Uma maneira simples, mas eficaz, de orientar os usuários.

Aqui está um exemplo da página 404 da Netflix com um botão CTA que leva à sua página inicial.

Outra solução é incluir um botão de CTA “Fale conosco” . Por exemplo, se um usuário veio com uma pergunta específica e a página 404 tornou impossível obter a resposta, ele pode entrar em contato com você para pedir detalhes.

Os usuários também podem usar a opção “Fale conosco” para relatar o erro a você.

Kinsta inclui uma “Página Principal” e um botão “Fale Conosco”. Os usuários podem acessar o site ou entrar em contato com a empresa. Assim, ele fornece uma solução para pessoas que desejam explorar o site ou encontrar uma resposta para uma pergunta específica.

O botão CTA deve ajudar seus usuários, mas também atender às suas metas de negócios. Por exemplo, você pode incluir uma opção para deixar um e-mail e assinar sua newsletter.

A 9gag usa sua página 404 para incentivar as pessoas a baixar seu aplicativo. A adição de um gif de fundo se encaixa perfeitamente com o estilo 9gag.

Links para o conteúdo principal

Seu conteúdo popular tem as melhores chances de manter os usuários engajados. Dá a você a oportunidade de chamar a atenção de seus usuários antes que eles saiam de sua página 404.

Links para seu conteúdo mais popular podem ser especialmente benéficos para sites de comércio eletrônico porque você pode promover seus produtos mais vendidos em uma página que, de outra forma, é um beco sem saída.

Um excelente exemplo de uma página 404 que apresenta o melhor conteúdo é mostrado no site da Urban Outfitters . Tem uma seção “Mais Popular” com a possibilidade de comprar os itens imediatamente.

Identidade da marca

Ao personalizar sua página 404 e alinhá-la com o design do seu site, você pode mostrar que realmente se importa com a totalidade da jornada do seu cliente pelo site.

Uma página 404 pode mostrar o tom e a personalidade da sua marca. Um design criativo que se adeque ao estilo do site pode fazer as pessoas sorrirem e talvez até incentivá-las a compartilhar a página com os amigos.

A Pixar está usando um de seus personagens conhecidos na página 404. Mesmo que a página não forneça recursos de navegação abrangentes, os gráficos e a mensagem reconfortante se encaixam perfeitamente no estilo da marca.

Além de um botão “Leve-me para casa”, o Canva inclui um pequeno quebra-cabeça para os usuários se divertirem. Sua criatividade e singularidade se destacam entre outras páginas. É uma alternativa divertida para uma página 404 padrão.

Empacotando

Não deixe seus usuários sozinhos com uma página 404 padrão.

Os usuários nunca devem ficar sem informações sobre o que aconteceu e o que devem fazer a seguir.

Em vez disso, esforce-se para criar uma boa experiência em todo o site. Isso inclui páginas de erro.