Si vous lancez un nouveau site Web, la question ne se pose pas. Mes visiteurs accéderont-ils à mon site à l’aide d’appareils mobiles et d’écrans de bureau? Que dois-je faire pour rendre mon site accessible aux Smartphones ?
Cette question est d’autant plus importante lorsque l’on sait que 61% des utilisateurs sont susceptibles de revenir sur votre site.
Afin de comprendre comment mieux prendre en charge ces utilisateurs mobiles, nous allons vous expliquer comment rendre votre site WordPress Responsive et accessible pour les Smartphones.
Approche concernant l’affichage mobile
A mesure que la question concernant la facilité d’utilisation des appareils mobiles a pris de l’importance à la fin des années 2000, les spécialistes du marketing ont du choisir entre plusieurs options lors de la création des sites afin de les adapter aux Smartphones.
La première option fut de créer un site complet construit avec bMobilized ou DudaMobile. Les sites étaient hébergés sur des sous-domaines tel que https://m.votredomaine.com. Les sites mobiles avaient l’air totalement différent de l’original et présentaient uniquement certains services.
Cependant, il existait deux inconvénients à cette approche qui ont été remis en question au cours des dernières années. Le premier est le fait que, à mesure de l’utilisation grandissante de nos smartphones, les utilisateurs n’ont plus voulu voir de versions réduites d’un site Web sur un appareil mobile. En effet, il veulent pouvoir consulter le même contenu sans être obligé de basculer de la version mobile à la version de bureau.
Le deuxième problème est l’impact négatif que cela peu avoir sur le SEO de votre site Web. Les sites mobiles autonomes doivent être correctement mappés aux version de bureau en utilisant la balise rel (conanical ou alternate). Si vous vous trompez lors du mappage de votre site, vous pourriez voir un impact négatif sur le classement de votre site sur le moteur de recherche en raison d’un problème d’indexation et de contenu dupliqué.
Pourquoi créer un site Web réactif ?
L’approche suggère que la conception et le développement doivent répondre au comportement et à l’environnement de l’utilisateur en fonction de la taille de l’écran, de la plate-forme et de l’orientation. La pratique consiste en un mélange de grilles et de mises en page flexibles d’images et d’une utilisation intelligente des requêtes de médias CSS. Lorsque l’utilisateur passe de son ordinateur portable à l’iPad, le site Web doit automatiquement changer la résolution et la taille des images par rapport à la taille de l’écran de l’utilisateur.
Imaginez que vous parcourez un site Web sur votre ordinateur de bureau. Si le site utilise une conception de site Web réactive et que vous tentez d’y accéder sur votre appareil mobile, vous verrez que les mêmes éléments de contenu et de conception sont toujours affichés. Ils ont juste été reconfigurés en fonction de la taille de l’écran de votre appareil, tel que détecté par le code de votre site Web.
Selon Google, la conception de site Web réactif offre un certain nombre d’avantages différents qui sont les suivants:
- Aide les algorithmes de Google à attribuer avec précision des propriétés d’indexation à la page.
- Nécessite moins de temps d’ingénierie pour gérer plusieurs pages pour le même contenu.
- Réduit la possibilité des erreurs courantes qui affectent les sites mobiles.
- Ne nécessite aucune redirection pour que les utilisateurs disposent d’une vue optimisée.
- Économise des ressources lorsque Googlebot explore votre site.
En observant cette liste, vous constaterez des avantages aussi bien pour l’utilisateur que pour les performances de votre site Web.
WordPress et Responsive Design
Malgré les exigences de code complexes qui permettent à un site Web de passer de façon transparente de l’écran de bureau à l’écran de votre smartphone, l’implémentation d’un design réactif sur votre site WordPress est assez facile.
Vous avez plusieurs choix possibles:
- Vous pouvez transformer un design WordPress statique en un design réactif avec un peu de codage
- Il est possible d’utiliser un plugin pour réaliser la même transformation
- Vous pouvez choisir un thème responsive dès le début de la création de votre site.
Commençons par la dernière option de la liste ci-dessus, car c’est l’option la plus simple pour lancer un site web responsive sur la plateforme WordPress.
Choisir un thème Responsive
Un thème responsive sur WordPress est codé afin de s’adapter aux changements d’écran entre celui de bureau et celui de votre Smartphone.
Lorsque vous recherchez un thème pour votre nouveau site WordPress , recherchez ceux qui sont étiquetés comme réactifs:
Les design responsives sont devenus très populaires. La plupart des thèmes que vous allez voir prétendent être réactifs. Cependant, ne vous fiez pas à cela. Lisez les critères du thème si ceux-ci sont disponibles. Lisez aussi les commentaires laissé par les utilisateurs. Cela vous permettra de savoir si le thème fonctionne de façon convenable et si ce dernier a la capacité de fonctionner de façon réactive.
Une fois que vous avez choisi et installé le thème « responsive », testez-le sur autant de périphérique de possible. Vous pouvez consulter un service de test tel que UserTesting afin de vous assurer qu’il fonctionne convenablement.
Utiliser un plugin responsive
Supposons que vous avez installé votre site il y a quelques années et qu’il n’est pas encore responsive. Comme mentionné ci-dessus, vous pouvez modifier le code source de votre site afin de le rendre responsive ou installer un plugin. L’utilisation d’un plugin spécifique sera plus facile à mettre en oeuvre.
Prenez le plugin Sinking Dropdowns WordPress. L’installation du plugin ajustera l’affichage de votre barre de navigation principale à partir d’une liste déroulante de bureau
Transformer un site WordPress Statique en site responsive
Si vous êtes développeur, vous pouve bien sûr, coder votre propre thème WordPress avec vos propres spécifications.
Avant toute modification de votre site WordPress Responsive, n’oubliez pas d’effectuer une sauvegarde de ce dernier. Il est même conseillé d’effectuer plusieurs sauvegardes pendant les modifications. Cela permet de ne pas recommencer le codage depuis le début en cas de problème.
Conclusion
J’espère que cet article vous a plus !
Vous êtes désormais en mesure de savoir ce qu’est un thème responsive et comment l’implémenter sur votre site WordPress. Vous êtes aussi en mesure d’installer un plugin vous permettant de rendre n’importe quel thème WordPress responsive.
N’hésitez pas à partager vos remarques et vos questions !