mobileoptimisation

Responsive Webdesign : comment réussir l'optimisation pour les mobiles

Dans cet article, je t'explique la différence entre "responsive" et "compatible mobile" et comment optimiser ton site pour les appareils mobiles. En outre, tu apprendras quelques astuces très cool qui te permettront d'améliorer le temps de chargement de ton site WordPress afin qu'il se charge rapidement.

De plus en plus de personnes se déplacent sur l'internet. Cela crée de nouvelles opportunités et, bien sûr, une nouvelle réflexion sur les thèmes de la "conception web réactive" et de "l'optimisation mobile du site web".

Pourquoi l'optimisation mobile ?

Avant de vous montrer des possibilités concrètes d'optimisation, j'aimerais discuter brièvement avec vous du "pourquoi". Ce faisant, j'aborderai plus en détail les deux raisons les plus importantes :

Raison #1

De plus en plus de personnes utilisent des appareils mobiles (smartphones et tablettes). En revanche, les ordinateurs et les blocs-notes sont de moins en moins utilisés. C'est particulièrement vrai pour un usage privé lors de la recherche d'un problème, d'un sujet, d'une solution, d'un restaurant, d'un produit ou d'un service spécifique.

Chaque exploitant de site web devrait s'adapter à ce changement. En effet, ce n'est que si ton site web s'affiche de manière optimale sur le terminal mobile que ton visiteur restera sur la page et réservera un produit ou un service chez toi.

Raison #2

Pour Google, les performances de votre site web sur les appareils mobiles constituent un critère de classement. Les deux aspects suivants sont extrêmement importants :

  1. Le site web est-il totalement réactif ?
  2. Quel est le temps de chargement de votre site web ?

Plus vous vous améliorez dans ces deux domaines, plus vous obtiendrez de points positifs et, en fin de compte, plus votre classement sera bon dans les résultats de la recherche.

Différence : Responsive ou compatible avec les mobiles

Sur de nombreux sites web, il est écrit qu'il te suffit d'avoir un Responsive Design et que tout va bien. Mais je suis d'un tout autre avis et c'est pourquoi j'aimerais m'attarder sur ce point. Car c'est précisément à ce niveau que tu peux optimiser ton site web pour les appareils mobiles.

La procédure est fondamentalement la suivante : L'exploitant d'un site web installe par exemple un thème responsive pour un site WordPress. Pour lui, le sujet est généralement clos. Mais à mon avis, c'est là que tout commence vraiment. Car un responsive theme signifie seulement que le design s'adapte automatiquement au terminal concerné. C'est la condition de base et donc essentielle.

Un Theme réactif signifie seulement que le design s'adapte automatiquement à l'appareil final respectif.

L'étape suivante consiste à consulter ton site web sur une tablette et un smartphone. Tu constateras rapidement si le responsive design est professionnel et accueillant. En effet, il arrive souvent que l'optimisation mobile n'ait pas été effectuée malgré un responsive design.

Pour cela, je voudrais vous donner quelques exemples, que vous avez sûrement remarqués sur certains sites web :

  • La police de caractères du titre est beaucoup trop grande.
  • La police du corps du texte est trop grande ou trop petite.
  • L'espacement des lignes est trop important.
  • Les images sont affichées trop grandes ou trop petites.
  • Certains formats ne s'affichent pas correctement sur l'appareil mobile.
  • La navigation est difficile à utiliser.

Cette liste pourrait être beaucoup plus longue, bien sûr, mais je pense que vous comprenez mon point de vue.

Même si ces aspects ne sont pas optimisés, tu as un site web responsive, ce que Google évalue également de manière positive. Toutefois, pour tes visiteurs, tu devrais vraiment prendre au sérieux l'optimisation mobile et prendre en compte ces aspects et les faire optimiser par ton programmeur.

Responsive Web Design & optimisation mobile

En règle générale, on dispose d'un smartphone et peut-être d'une tablette. Mais si tu veux vérifier ton site web avec différents terminaux mobiles, tu atteindras vite tes limites. Il existe toutefois une solution très simple pour cela. Si tu utilises le navigateur Google Chrome, tu as une fonction intégrée pour cela.

Tu peux afficher ton "responsive web design" pour de nombreux terminaux différents. Pour ce faire, clique avec le bouton droit de la souris et sélectionne dans le menu qui apparaît "examiner" (en anglais "inspect"). Une console s'ouvre et tu peux sélectionner les appareils mobiles (voir capture d'écran). Le navigateur te montre alors comment ton site web s'affiche avec certains terminaux.

test de conception de sites web adaptés aux appareils mobiles

Conseils : Optimiser WordPress mobile

Si tu utilises WordPress, les conseils suivants te seront certainement très utiles. Grâce à WordPress, tu peux effectuer de nombreuses optimisations à l'aide d'un plugin ou d'une fonction interne. Cela facilite ton travail et te fait gagner du temps :

  • L'exigence de base est un Theme réactif. Je vous recommande de choisir une prime Theme pour WordPress . Cela coûte quelques dollars, mais vous avez beaucoup plus de possibilités. En outre, une prime Theme est généralement mieux programmée, dont vous bénéficiez également.
  • Si ton thème doit être optimisé dans la vue mobile, tu as deux options. Soit tu modifies le thème, soit tu optimises ton thème existant. Pour l'optimisation, tu peux utiliser un thème enfant. Demande à un·e programmeur·euse de mettre en œuvre les optimisations pour toi.
  • Il existe aujourd'hui de nombreux constructeurs de thèmes qui te permettent de créer facilement le design de ton choix et d'optimiser ainsi WordPress pour les mobiles. Thrive Themes ou Divi en sont des exemples.

Si le thème de WordPress est encore nouveau pour toi, mais que tu le trouves intéressant, tu peux regarder ce qui suit. Sur cette page, tu trouveras un tutoriel WordPress dans lequel tu apprendras toutes les bases importantes de ce génial système de gestion de contenu.

Passons maintenant à une petite astuce secrète qui est extrêmement puissante : dans le texte de ton site web, fais des liens vers des sous-pages internes en rapport avec le sujet. Cela permet à tes visiteurs de naviguer facilement sur ton site. En effet, les utilisateurs de smartphones préfèrent cliquer facilement sur un lien dans le texte plutôt que de parcourir péniblement le menu du burger.

En procédant à cette simple optimisation, vous créez plusieurs choses positives à la fois :

  • Les liens internes sont un facteur de classement sur Google.
  • En créant des liens internes, vous facilitez la tâche de vos visiteurs et ils se sentent plus à l'aise sur votre site.
  • En moyenne, vos visiteurs consultent plusieurs de vos sous-pages, ce qui augmente le temps qu'ils passent sur votre site. Et c'est aussi un facteur de classement qui aura un effet positif.
Consentement*
Ce champ sert à la validation et ne doit pas être modifié.

Temps de chargement des appareils mobiles

Nous avons maintenant beaucoup parlé du thème "Optimiser le site web pour les appareils mobiles". Mais il y a encore un aspect dont tu devrais également tenir compte : L'optimisation du temps de chargement. À mon avis, ce thème est particulièrement important pour deux raisons :

  • Le temps de chargement de ton site web est un facteur de classement de Google.
  • Plus le temps de chargement de ton site est long, plus tu auras d'abandons de visiteurs.

Cela se répercute énormément sur les visiteurs mobiles, car les temps de chargement sont toujours un peu plus longs par rapport à l'environnement desktop. Voici 3 conseils concrets pour optimiser WordPress en termes de temps de chargement pour les appareils mobiles :

1 : Images :

Les images représentent le pourcentage le plus important du temps de chargement. C'est donc ici que tu as le plus de poids. Le plus important est que tu télécharges les images dans WordPress à la taille exacte dans laquelle tu vas intégrer le graphique. Tu économises ainsi de la taille de fichier et tu réduis le temps de chargement.

En outre, il existe aujourd'hui des outils gigantesques qui te permettent de réduire encore plus automatiquement la taille des fichiers de tes images. Tu peux définir toi-même si la qualité doit être maintenue ou légèrement réduite. Pour cela, je te recommande les deux plugins WordPress suivants :

ewww image optimizer optimiser les images

Avec certains plugins d'optimisation d'images, tu peux en outre générer automatiquement des images WebP. Il s'agit d'un tout nouveau format de Google qui permet de réduire encore la taille des fichiers tout en conservant la même qualité.

2 : Mise en cache

Le deuxième point important concerne la mise en cache. Je ne veux pas entrer dans les détails, car tu n'as pas besoin de connaissances de base.

Le fait est que les recherches dans la base de données ne sont pas effectuées à chaque fois que votre site web (ou une sous-page) est appelé. Grâce au "caching", une copie de chaque sous-page est stockée sur votre serveur et est donc disponible beaucoup plus rapidement car aucune requête séparée ne doit être effectuée.

Ma recommandation de plugin : WP Rocket. WP Rocket est facile à utiliser et peut être configuré en quelques minutes. De plus, le plugin offre d'autres optimisations qui te permettent d'économiser du temps de chargement supplémentaire.

3 : Faire le ménage dans les plugins et les thèmes

Certes, ce tuyau semble très banal, et il l'est. Néanmoins, elle est efficace :

Je vous recommande de désinstaller tous les sites Plugins et Themes, que vous n'utilisez pas. Le handicap seul ne suffit pas.

Cela permet également de garder votre système propre et chaque extension supplémentaire comporte un certain risque de sécurité. Au fil du temps, de nombreux Plugins et Themes s'insinuent dans votre vie sans que vous n'en ayez vraiment besoin.

Sur mon site, tu trouveras une série de vidéos gratuites sur la manière d'accélérer WordPress. Ces explications montrent en direct à l'écran quels paramètres tu dois définir et à quel endroit.

Conclusion : l'optimisation mobile est-elle rentable ?

Internet évolue à la vitesse de la lumière. Il y a beaucoup de sujets intéressants et tu te demandes peut-être si cela vaut vraiment la peine d'optimiser mon site pour les mobiles ? Bien sûr, c'est à toi de décider. Je te recommande toutefois d'optimiser ton site web dans cette direction :

  • Optimiser le site web pour les appareils mobiles
  • Améliorer et optimiser le temps de chargement

Un site web est LA vitrine qui te sert 365 jours par an. Et pour que ta vitrine remplisse sa fonction, elle doit être régulièrement polie. Ma recommandation est donc la suivante : polis ton site web pour les appareils mobiles et tu en profiteras certainement.

Responsive Web Design - tes questions

Quelles questions poses-tu à Oliver ? N'hésite pas à utiliser la fonction de commentaire. Tu veux être informé(e) des nouveaux articles sur le marketing en ligne ? Alors suis-nous sur Twitter, Facebook, LinkedIn ou sur notre Bulletin d'information.

As-tu aimé cet article ?

Tes évaluations nous permettent d'améliorer encore plus notre contenu.

Laisse un commentaire

Ton adresse e-mail ne sera pas publiée.