Item 1 da lista de verificação responsiva: teste sua navegação
Como mencionamos anteriormente, na maioria dos designs da Web responsivos a dispositivos móveis, você verá que a navegação é um menu de hambúrguer em vez de abranger a parte superior da página. Isso evita que os usuários precisem ampliar sua barra de navegação para ver as opções. Abaixo, você pode ver um exemplo do site responsivo do Dunkin’ Donuts e como seu menu de navegação assume a forma de um menu de hambúrguer que se expande quando os usuários clicam.
Você deve garantir que seu menu de navegação funcione corretamente em todos os dispositivos e que nada seja cortado quando os usuários o abrirem. Seu menu de navegação é uma parte extremamente importante do seu site, pois fornece um roteiro para os usuários encontrarem exatamente o que desejam. Sem um que funcione corretamente, os usuários podem sair do seu site.
Item 2 da lista de verificação responsiva: tornar os pop-ups responsivos
O quinto item em nossa lista de verificação de design compatível com dispositivos móveis é tornar seus pop-ups responsivos também. Os pop-ups geralmente são acionados por uma ação específica. Por exemplo, você pode visitar um site que mostra um pop-up sempre que tentar sair do site para incentivá-lo a ficar por perto.
Outras ações que podem acionar um pop-up incluem:
Chegando ao final de uma página
Clicando em um link específico
Permanecer na página inicial por um determinado período de tempo
Esses pop-ups podem fornecer uma oferta especial ou incentivar os usuários a se inscreverem em um boletim informativo. No exemplo abaixo, Bones Coffee fornece um pop-up para usuários que chegam ao final de sua página inicial. É uma oferta especial de 10% de desconto na sua primeira compra se você inserir um endereço de e-mail.
No entanto, se você observar o pop-up da perspectiva de um smartphone, o iPhone 6, 7 ou 8, para ser exato, verá que o pop-up não é responsivo e dificulta a inscrição dos usuários.É igualmente importante ter em mente a capacidade de resposta dos pop-ups, pois eles oferecem enormes benefícios para o seu negócio.
Item 3 da lista de verificação responsiva: certifique-se de que seu site seja visualmente atraente em todos os dispositivos
O número seis em nossa lista de verificação para design responsivo é garantir que seu site seja visualmente atraente em todos os dispositivos. Quando você cria um site especificamente para desktop, pode ser difícil fazer com que os elementos do site pareçam certos em outros dispositivos, como smartphones e tablets. Mesmo que você torne todos os elementos do seu site responsivos, ainda é crucial garantir que todos os elementos do seu site tenham uma ótima aparência em todos os dispositivos.
Você vai querer ter certeza de que:
As imagens não ocupam a tela inteira
Os menus não são cortados
As listas com marcadores estão formatadas corretamente
As mesas parecem limpas e organizadas
As listas de serviço são renderizadas corretamente
As imagens e descrições dos produtos estão formatadas corretamente
As formas são esteticamente agradáveis e eficazes
Os carrinhos de compras são organizados e fáceis de usar
Como os usuários levam apenas 50 milissegundos para formar uma opinião sobre seu site, é crucial garantir que ele seja esteticamente agradável em todos os dispositivos.
Item 4 da lista de verificação responsiva: torne-se o visitante do site
Agora que você seguiu todas as etapas da nossa lista de verificação de web design responsivo para sites de motoboy e outros ramos, é hora de auditar seus esforços tornando-se o visitante do site. Dê algumas voltas em seu site para ter certeza de que não perdeu nenhum elemento de design responsivo. Por exemplo, você desejará:
Teste cada etapa do envio de um formulário
Teste cada etapa da compra de um produto
Testar links da barra de navegação
Teste diferentes áreas do seu site, como seu blog e suas páginas de produtos
Colocar-se no banco do motorista e dar algumas voltas no seu site garantirá que nada caia nas rachaduras da sua lista de verificação de design da web responsiva.
