5 tips pour avoir un bon responsive

Il y a quelque temps je vous parlais de l’importance du mobile first. Aujourd’hui je vous donne quelques conseils à mettre en pratique pour faire en sorte d’avoir un bon responsive, et que votre site réponde à certaines normes du “mobile-first”.

Mais d’abord, petit rappel ! Le responsive, c’est la façon dont s’adapte votre site sur différents supports, à savoir : le mobile, la tablette, et l’ordinateur. Le mobile first, est une pratique qui consiste à adapter son site internet principalement sur mobile, c’est également un critère majeur pour un bon référencement d’après l’algorithme Google.

Mais alors comment faire pour avoir un bon responsive quand on n’est pas Webdesigner freelance ?

Restez simple & sobre
Il faut penser que sur mobile, tout est plus petit. Il est donc important d’apporter de la simplicité et d’être un peu plus sobre. Si sur ordinateur votre site présente de nombreux effets d’apparition, des animations, s’il comporte de nombreux éléments dynamiques, veillez à ce qu’il n’y en ai pas trop lorsque l’on passe sur mobile.

Sur tablette, il est possible de garder quelques effets, l’écran étant plus grand, mais en veillant toutefois à ne pas perdre visuellement votre utilisateur.

En soi, vous devez respecter votre charte graphique tout en rendant le visuel simple, afin que vos visiteurs puissent aller à l’essentiel et cliquer où vous voulez qu’ils cliquent. Pensez qu’au moins la moitié des personnes qui viendront sur votre site y accèdent via leur smartphone, et naviguent avec leur pouce, alors aller à l’essentiel.

Une navigation simplifié
En parlant de navigation, il faudra donc penser à la rendre efficace également. Cela passe dans un premier temps par le HEADER, l’entête de votre site, là où se trouve le logo. Il faudra donc veiller à rendre facilement accessible votre menu, soit en le laissant tout le temps visible, soit lorsque l’on scroll, en ajoutant une petite flèche pour remonter en haut.

De même, il faudrait penser à mettre les liens / boutons de façon bien visible ! Ainsi, vos visiteurs pourront cliquer plus facilement sur les liens afin d’accéder aux pages souhaitées.

Il faut encore une fois penser que les gens vont naviguer sur votre site avec leur pouce (ou leur index pour certains qui se reconnaîtront), il faut donc penser la navigation de façon à ce que le pouce puisse cliquer facilement sur les boutons ou élément important.

Adapter les visuels
Des beaux visuels c’est bien. Bien adapté sur mobile, c’est mieux. En général, on a tendance à vouloir mettre de beaux et grands visuels sur ordinateur. C’est beau, c’est impactant et ça donne envie, c’est vrai.

Mais une fois sur mobile, ce n’est pas forcément très esthétique. Il faudra donc faire attention à la hauteur de vos visuels, afin d’éviter que ceux-ci ne prennent toute la taille de l’écran, et ainsi éviter que vos utilisateurs ne scroll indéfiniment pour accéder aux textes.

Tester votre site
https://search.google.com/test/mobile-friendly

Pour être sûr que votre responsive soit optimal, il n’y a pas de secret, il faut le tester !
En fonction de la plateforme que vous avez choisie, vous pourrez la tester. Si ce n’est pas le cas, il existe des sites permettant de tester le visuel de votre site sur différents supports.

Dans l’idéal, lorsque vous faites vos tests, pensez à faire un test sûr : un mobile, une tablette format horizontal, une tablette format vertical, un ordinateur portable, et un ordinateur grand écran. Ça peut faire beaucoup, mais c’est important pour être sûr que votre site s’adapte bien aux différents supports sur lesquels vos visiteurs pourraient se trouver.

Google propose un outil pour savoir si votre site est adapté, vous trouverez cet outil en cliquant ICI. Et vous pourrez également tester votre site grâce à l’outil XRESPOND, si votre plateforme ne propose pas cette option en cliquant ICI.

https://media.giphy.com/media/h3p3Qd1dCX6dhnfGmx/giphy.gif
Choisir la bonne plateforme
Et enfin, le point final (même si je pourrais faire une longue liste des choses à respecter pour un bon responsive évidemment), le choix de votre plateforme. On y pense pas au départ, mais lorsque vous vous lancer dans la création de votre site, il est important de choisir une plateforme qui vous permettra facilement de gérer votre responsive, surtout si vous ne savez pas coder.

Les plateformes WIX et SHOPIFY par exemple, sont deux plateformes facilement accessibles lorsque l’on ne s’y connaît pas, et elles proposent un outil permettant de gérer le responsive.

Avec WAW GRAFIK, j’utilise ce qu’on appelle un constructeur de thème sur WordPress, à savoir ELEMENTOR. Cela permet de faire un site sur-mesure de A à Z, de bien gérer le responsive, tout en vous donnant la possibilité d’être autonome et indépendant grâce à l’accès offert à des tutoriels. Je vous ferai un article bientôt pour vous parler de cet outil génial !

Vous l’aurez compris, la gestion du responsive n’est pas une mince affaire, et peut prendre du temps, mais avec un peu de détermination et d’huile de coude, je suis sûre que vous y arriverez ! C’est un critère de référencement important, alors ne le laissez pas de côté !

Et si cela vous dépasse n’hésitez pas à me contacter pour que je vous aiguille dans votre projet. Je me ferais un plaisir d’échanger avec vous ! Vous pouvez également profiter d’un CALL GRAFIK, un appel découverte de 30 min, 100% gratuit et sans engagement pour échanger sur vos idées, votre projet, vos envies… C’est par ICI pour réserver votre appel dès maintenant !