Conseils pour la conception d'une navigation adaptée aux mobiles pour le référencement - dummies

Votre navigation adaptée aux mobiles peut prendre plusieurs formes dans le cadre de votre stratégie de référencement. L'option qui vous convient le mieux dépend de la complexité de votre navigation, de vos objectifs de conversion et des préférences de vos utilisateurs.

N'oubliez pas que la navigation de votre site doit aider les visiteurs - et les robots de recherche - à naviguer sur votre site Web. Votre navigation mobile doit donc être intuitive, fonctionnelle, explorable et optimisée pour le toucher.

Gardez ces bonnes pratiques à l'esprit lorsque vous concevez votre navigation adaptée aux mobiles:

• Restez simple, chérie. Gardez la navigation au plus haut niveau aussi simple que possible, surtout si vous voulez que votre navigation soit affichée en haut de votre page mobile. N'oubliez pas que vous concevez pour une petite taille d'écran. (Un iPhone 6 a 750 pixels de large en mode portrait, alors qu'un ordinateur portable de 13 pouces mesure 1, 280 pixels de large).

  Le point d'un site mobile permet à vos visiteurs de naviguer facilement sur votre site avec un appareil mobile. Votre navigation devrait leur donner des liens vers les pages de votre catégorie principale et les pages qui améliorent la convivialité (comme une option «Appelez maintenant» et un lien vers votre panier).

  Vous n'avez pas besoin de créer un lien vers chaque page de votre site Web ici. En fait, trop d'options peuvent entraîner une paralysie de la décision et de la confusion, ce qui crée une mauvaise expérience utilisateur.

  Inclure quatre à huit éléments dans votre menu principal est généralement une bonne règle. Voir l'exemple du menu principal de Bruce Clay, Inc.

  

  Bruce Clay, Inc. simplifie considérablement la navigation sur les ordinateurs de bureau (en haut) pour améliorer l'expérience utilisateur mobile. Pour aider les utilisateurs dans l'achèvement des tâches, la navigation sur le site mobile (en bas) inclut également un bouton Cliquer pour appeler.

• Listez d'abord vos pages les plus importantes. Il s'agit généralement de vos conversions en actions, telles que «localiser magasin», «boutique», «s'abonner» et «produits». "Si votre site Web est plus axé sur le contenu que sur les ventes, indiquez d'abord votre catégorie la plus importante.

  

  GameStop simplifie la navigation sur le bureau (en haut) en n'incluant que les appels à l'action centrés sur l'utilisateur et la conversion sur sa page d'accueil mobile (en bas).

• Pensez à perdre le bouton Accueil. Pour économiser de l'espace, vous pouvez laisser le bouton Accueil de votre navigation enfoncé et faire en sorte que votre logo haut de page navigue jusqu'à la page d'accueil lorsque vous êtes sur écoute.

• Concevoir pour le toucher et donner assez de place pour un doigt. Étant donné que les utilisateurs de votre tablette et de votre smartphone naviguent sur votre site mobile à l'aide d'écrans tactiles, il est très important de vous assurer que la sensibilité du toucher de vos boutons de navigation est suffisante.Le doigt moyen nécessite un espace d'au moins 44 pixels, de gauche à droite et de haut en bas.

• Rendez votre menu intuitif. Vos visiteurs doivent savoir exactement où chacun de vos éléments de menu les emmènera.

• Minimisez la navigation à plusieurs niveaux. Restez simple, mais si votre navigation doit simplement avoir des niveaux déroulants, n'ajoutez jamais plus de deux niveaux de fonctionnalité de liste déroulante.

• Assurez-vous que les menus déroulants sont activés au toucher. Bien que l'activation de mouse-hover fonctionne dans l'expérience de bureau, elle laisse votre utilisateur coincé dans l'expérience mobile.

• Utilisez les indicateurs de menu visuel. Si vous utilisez un menu hors écran, utilisez un indicateur de menu à trois lignes pour que votre visiteur puisse accéder à votre menu.

  Si vous disposez d'une navigation à plusieurs niveaux, utilisez un symbole intuitif, tel qu'un signe plus (+), pour indiquer que l'élément de menu comporte d'autres options de menu déroulant. Pensez également à utiliser un symbole pour différencier les boutons qui accèdent à une nouvelle page à partir des boutons qui révèlent plus d'options déroulantes. REI utilise une flèche pointant vers la droite (>) pour indiquer quand un élément de navigation vous amène à une nouvelle page.

  

  REI utilise des indicateurs de menu visuel pour guider les utilisateurs à travers sa navigation à plusieurs niveaux.

• Ajouter un commentaire tactile. Lorsque les utilisateurs tapent sur un élément de votre navigation, il faut que quelque chose se passe pour garantir aux utilisateurs qu'ils ont tapé au bon endroit. Cette rétroaction peut être un changement de couleur, un clignotement de couleur ou un changement de police. Local, tapé par un utilisateur, est surligné en bleu.

  

  Le moteur de recherche utilise le retour tactile couleur pour indiquer aux utilisateurs où ils se sont engagés dans la navigation.

• Évitez le défilement horizontal. En général, les moteurs de recherche n'aiment pas le défilement excessif de gauche à droite et les utilisateurs non plus. Si votre menu est trop long pour tenir dans les paramètres de l'écran de gauche à droite, envisagez une navigation verticale.