95% de la population âgée de 15 ans ou plus déclare être équipée d’un téléphone mobile : 77% possèdent un smartphone. Avec ces chiffres, on se rend bien compte qu’il ne faut pas négliger la puissance de l’information sur smartphone. Alors pourquoi négliges-tu la forme responsive de ton site internet ? Pas de panique, avec cet article, tu vas changer d’avis. Je t’explique ce qu’est le responsive, puis je t’offre mes 5 conseils pour créer un site internet adapté au responsive sans coder.
1/ Qu’est ce que le responsive ?
Dans cet article, je vais te parler de responsive ou d’adaptation d’un site internet au mobile. Pourtant si je veux être précise, je dois te parler de RWD (Responsive Web Design). Mais tu sais à quel point tous ces termes anglais me donnent de l’urticaire. A mon sens, c‘est comme en médecine (#teamancienneinfirmiere) les mots sont beaucoup trop compliqués alors qu’ils signifient des pathologies simples et connues sous d’autres termes plus courants et moins complexes. C’est un peu fait pour perdre les gens, tu ne penses pas ?
Enfin bon, ici je te parle de responsive.
Le responsive est l’adaptation automatique de ton site internet à la taille de l’écran utilisé. Cette technique répond à un besoin des utilisateurs de plus en plus nombreux à se connecter sur le web depuis leur téléphone.
Cependant, le responsive ne se limite pas aux smartphones, il est aussi important d’y penser pour les tablettes.
2/ Étape 1 : ton site est-il responsive ?
En tant que débutant, je me doute que tu n’as pas forcément la réponse à cette question. C’est pourquoi je te propose de tester le responsive de ton site ici : screenfly.org.
Il s’agit du site le plus facile d’utilisation, le plus intuitif et surtout gratuit que j’ai trouvé.
Si tu en as d’autres n’hésite pas à me faire signe, je suis preneuse. Certes les tailles de smartphones ne sont pas méga à jour mais c’est un bon début.
3/ Étape 2 : Utilise un thème responsive
Lorsque tu crées ton site internet, il est indispensable de penser au responsive. C’est à dire qu’il faut que tu ajoutes à tes critères de choix la ligne RESPONSIVE du thème que tu veux.
En effet, sur WordPress, tous les thèmes ne le sont pas. Pour rappel un thème est un modèle qui permet la conception et la mise en page de ton site.
Je te propose quelques thèmes de chez WordPress responsives :
- twenty-twenty,
- flash,
- generate press,
- sydney,
- ultra,
- neve,
- hestia,
- océan WP,
- astra.
Tous ces thèmes sont gratuits.
Pour ma part, j’ai débuté avec un thème gratuit puis rapidement, je suis passé en mode payant. Mais au fil du temps, je me suis rendu compte que j’étais limitée dans la construction de mon site internet. Je suis donc passée au thème DIVI. Facile à installer et à prendre en main. Mon meilleur investissement. Si tu veux en savoir plus n’hésite pas à me contacter.
4/ Étape 3 : Adapter son contenu pour une lecture mobile fluide
Lorsque tu penses ton site internet seulement pour les ordinateurs, tu ne te soucis pas de la longueur des textes ni de la police que tu utilises.
Les textes que tu rédiges doivent être suffisamment longs pour que l’on comprenne ce que tu fais mais adaptable aux mobiles et tablettes.
Si tu es une pipelette et que tu n’arrives pas à t’arrêter d’écrire, sais-tu que sur DIVI il existe une manière de structurer les informations que tu veux faire passer différemment sur mobile et sur ordi ? C’est un super moyen pour ne pas être frustrée.
Ensuite, lorsque tu choisis ta police d’écriture, pense aussi à sa taille. Celle-ci doit s’adapter à l’écran utilisé et à la distance moyenne que l’on a de l’écran. La distance que l’on a lors de la lecture sur smartphone est plus courte que lorsque l’on lit quelque chose sur un ordinateur.
💡 Pour info : la taille moyenne se place entre 14 et 16 px.
Voici une liste de polices responsives que tu peux utiliser pour ton site internet :
- open sans,
- lato,
- roboto,
- source sérif pro,
- playfair display.
Si tu en veux plus, redacteur.com on écrit un article complet dessus.
5/ Étape 4 : Optimise la vitesse de chargement
Plus qu’ailleurs, la vitesse de chargement sur mobile est primordial. Tu te rends bien compte, que malheureusement de nos jours, la double voire triple tâche est d’actualité et que la population n’aime pas attendre……
Alors pour que ton site internet ne soit pas relégué aux oubliettes, il faut penser à optimiser sa vitesse de chargement.
Pour cela il te faut :
- utiliser une mise en cache : c’est une méthode qui permet de stocker temporairement les données sur le navigateur de l’utilisateur,
- optimiser les images de ton site en les réduisant au bon format, en les compressant et en utilisant le format adapté,
- utiliser un hébergeur performant, un hébergeur reconnu pour ses qualités et sa fiabilité. Personnellement j’utilise O2switch pour leur côté français, écologique et ils sont présents sur le web depuis 2009.
6/ Étape 5 : Avoir des CTA bien placés
Petit rappel : un CTA vient de l’anglais Call TO Action qui signifie bouton d’action.
Il s’agit des boutons que tu disposes méthodiquement sur tes pages de vente ou de présentation pour amener le lecteur vers une autre page.
Ils sont indispensables pour vendre. Pourtant s’ils ne sont pas bien positionnés et bien dimensionnés ils peuvent plus te desservir. C’est pourquoi, il est nécessaire de vérifier tes CTA dans ta version mobile et tablette.
Résumons les 5 conseils pour créer un site internet responsive sans coder
Je te rappelle que de nos jours, le codage n’est plus une nécessité à chaque problème. Tu peux avancer et réussir ton site internet sans coder. J’en suis la preuve. C’est pareil pour la responsive de ton site. Si tu suis mes 5 conseils tu réussiras. N’oublie donc pas de tester ton site, de bien choisir ton thème, d’adapter tes contenus, d’optimiser la vitesse de chargement et de bien placer tes CTA. Si tu veux d’autres conseils ou que je te donne mon avis d’experte en tant que créatrice de site internet sur le tien vient me voir ici.
