Comment optimiser l'expérience mobile de votre site Web pour les conversions

Cinquante et un et demi.

C'est le pourcentage d'utilisateurs en ligne qui surfent sur le Web à partir d'un appareil mobile. Avec ces chances, il est probable qu'un nombre important de clients potentiels de votre entreprise viennent à vous à partir d'un écran de 480 pixels. Si vous avez laissé la version mobile de votre site Web non formatée, si vous en avez réduit les informations ou si vous n'en avez tout simplement pas, vous manquez une occasion de convertir la moitié des visiteurs de votre site.

Vous pensez peut-être que l'optimisation pour les mobiles nécessite autant d'efforts que la création d'un autre site Web entièrement distinct. Mais la vérité est qu'il existe de nombreuses façons simples de rendre votre site plus adapté aux mobiles. Voici quelques conseils et astuces pour créer une version mobile de votre site Web qui convertit.

Le besoin de vitesse

La vitesse est l'élément le plus essentiel de la création d'un site mobile - et ce n'est pas seulement parce que les utilisateurs quitteront un site Web qui prend plus de trois secondes à se charger. Les sites Web à chargement lent ont un taux de rebond plus élevé, ce qui signifie que les utilisateurs n'interagissent pas avec le contenu aussi longtemps qu'ils le devraient et sont moins susceptibles de visiter d'autres pages de votre site Web (comme une page de contact ou une page de paiement).

Idéalement, vous voulez que votre site Web se charge en 2-3 secondes ou moins. Il existe une tonne de façons d'accélérer votre site Web, mais restons-en à celles qui lui donneront le plus grand coup de pouce :

1. Compresser les fichiers gourmands en ressources

• Les images sont essentielles à la conception, mais les laisser dans un état non compressé ralentit considérablement votre site. Il existe de nombreux plugins qui peuvent compresser les images sur le backend, ou vous pouvez aller à l'ancienne et compresser vos images à une taille plus gérable dans un éditeur de photos avant de les télécharger - l'une ou l'autre route fonctionnera. L'objectif est de faire en sorte que les images et les vidéos occupent le moins d'espace possible sans sacrifier la qualité de leur affichage sur la page.
• Il est facile d'ignorer le code HTML, CSS et JavaScript lorsque vous utilisez un constructeur de page. Mais ces fichiers contiennent souvent des lignes redondantes ou vides qui ralentissent votre site. Nous vous recommandons d'utiliser un plugin comme WP Rocket, qui réduira ces fichiers en un clic. Alternativement, vous pouvez vérifier le code vous-même. Vous voyez des lignes vides ? La suppression de ces lignes n'affectera pas l'apparence générale de votre site Web et cela aidera à éliminer certains ballonnements, ce qui donnera un coup de pouce aux performances de votre site Web.

2. Envisagez d'utiliser des pages mobiles accélérées (AMP)

Les AMP sont axés sur la rapidité et la facilité d'assimilation des informations pour le lecteur. Le plugin AMP a été initialement développé par Google pour offrir aux utilisateurs une meilleure expérience lors de la visite de sites mobiles. Une version AMP d'une page Web est essentiellement une version HTML simplifiée de votre page d'origine. Le résultat? Une page Web ultra-rapide qui a une probabilité de conversion beaucoup plus élevée.

Conception réactive

Si vous utilisez WordPress pour concevoir un site Web, vous avez probablement installé un thème pour contrôler l'apparence de votre site Web. Malheureusement, tous les thèmes ne sont pas créés égaux.

Un domaine où certains thèmes sont insuffisants est le manque de conception réactive. La conception réactive organise les informations et les éléments de conception de la meilleure façon possible pour une variété de tailles d'écran. Ce qui est étonnant dans le fait d'avoir un thème avec cela intégré, c'est que cela se produira automatiquement, avec des propriétés CSS intégrées dans la feuille de style du thème elle-même.

L'optimisation de votre site pour mobile sera beaucoup plus facile à réaliser si vous choisissez un thème avec un design réactif intégré. Si votre thème actuel n'a pas cette fonctionnalité, cette liste de 14 thèmes WordPress adaptés aux mobiles est un bon endroit pour commencer à en chercher un qui le fasse.

Tactile et convivialité

Les utilisateurs qui accèdent à votre site Web mobile parcourront chaque page d'une simple pression du pouce. Cela peut sembler idiot d'en parler, mais garder ce fait à l'esprit vous aidera à concevoir un meilleur site mobile.

• La zone du pouce : un article sur la façon dont nous tenons nos gadgets fait référence à la zone du pouce comme la zone où un pouce peut balayer l'écran avec plus de précision. Les zones les plus en haut et en bas de la page sont les moins confortables à atteindre sur un smartphone. En tant que concepteurs de sites Web, nous devrions placer les éléments de conversion - les éléments que nous aimerions qu'ils touchent - dans les zones où il est le plus facile pour un utilisateur de le faire.
• Interactions « clic » : lors de l'utilisation d'un appareil mobile, les utilisateurs ont la possibilité de faire deux choses : glisser pour faire défiler la page et appuyer doucement pour interagir avec un élément. Il n'y a pas d'animations ou de changement de couleur au survol pour faire savoir à l'utilisateur que quelque chose est cliquable. Parce que nous avons perdu cet élément, nous devons le rattraper par d'autres moyens. Si quelque chose est cliquable sur la page, il doit ressembler davantage à un bouton sur mobile. Alternativement, vous pouvez ajouter des boutons sous les éléments qui ne semblent pas cliquables pour indiquer à l'utilisateur comment aller de l'avant.

Popups

Avez-vous déjà rencontré une fenêtre contextuelle lors de la visite d'un site Web sur votre téléphone sur laquelle vous ne pouviez pas cliquer ? Soit le "x" était trop petit, soit il était légèrement hors de vue et ne pouvait pas être cliqué. Ce sont des problèmes courants avec les popups sur les sites mobiles.

La solution est simple : si vous utilisez des popups sur votre site mobile, prenez le temps de les formater et de les tester. Ce même principe s'applique aux formulaires et aux boutons. Il est essentiel que toutes les fenêtres contextuelles sur mobile soient correctement dimensionnées. La dernière chose que vous souhaitez, c'est qu'un utilisateur ayant l'intention de convertir soit dissuadé de le faire par votre site Web.

Gardez le contenu simple

1. Fournissez un chemin clair

Sur une version de bureau d'un site Web, il est courant de voir un menu dans l'en-tête qui affiche un lien vers chaque page clé. Les utilisateurs mobiles obtiennent cette option, souvent en cliquant sur un bouton bascule qui ouvre le menu. C'est une façon de s'assurer que les visiteurs peuvent naviguer rapidement entre les pages d'accueil importantes, mais il existe d'autres moyens pour nous, en tant que concepteurs Web, de les diriger vers les pages sur lesquelles nous les voulons - des pages qui convertissent.

Par exemple, de nombreux sites Web de commerce électronique placent une icône de panier à côté de leur menu. Cela place le panier au premier plan, ce qui permet aux utilisateurs de le trouver et de le vérifier facilement. Les sites Web qui vendent des services peuvent utiliser un bouton de contact à la place. Non seulement cela contribue à votre objectif de convertir les utilisateurs en clients, mais cela aide également à atteindre l'objectif de l'utilisateur en lui permettant de trouver facilement ce qu'il recherche.

2. Menez avec ce qui est important

L'objectif est de générer des conversions à partir de votre site Web - gardez cela à l'esprit lorsque vous créez la version mobile. Il s'agit d'une zone plus petite, alors ne gaspillez pas de biens immobiliers de choix sur des informations ou des pages qui ne génèrent généralement pas de conversions.

Sur un site de bureau, vous pourrez peut-être adapter confortablement trois colonnes d'informations sans sacrifier l'esthétique. Sur un site mobile, vous êtes probablement limité à des mises en page à une ou deux colonnes. Certains utilisateurs ne feront jamais défiler la page jusqu'en bas. C'est pourquoi il est impératif que les appels à l'action (CTA) et les opportunités pour les utilisateurs d'agir soient facilement accessibles en haut.

3. Ne dépouillez pas le site

Diriger avec des informations qui encouragent l'action ne signifie pas que tout le reste doit être supprimé. Les concepteurs Web sont parfois tentés de supprimer complètement la version mobile de leur site, ne laissant qu'une petite partie des informations disponibles sur la version de bureau. C'est une erreur. En juillet 2019, Google a annoncé l'indexation mobile d'abord , ce qui signifie que Google se penchera d'abord sur la version mobile de votre site Web pour déterminer le classement des résultats de recherche.

Mars 2021 marque la date à laquelle Google fera de l'indexation mobile d'abord la norme sur tous les sites Web. Si vous laissez des informations vitales hors de votre site Web mobile, vous pourriez sacrifier votre stratégie de référencement globale.

Alors, comment pouvez-vous inclure ces informations tout en concevant un site Web lisible et adapté aux mobiles ? La réponse est simple : la réorganisation. Déplacez ces informations vers d'autres pages qui ne sont pas au premier plan, ajoutez des liens et des boutons pour que les utilisateurs puissent toujours y accéder, voire condenser la version de bureau si nécessaire. Ne laissez pas la version mobile de votre site dehors dans le froid sans manteau.

Ne perdez pas la moitié de vos conversions

L'utilisation mobile a déjà dépassé l'utilisation des ordinateurs de bureau et continue de croître chaque année. La meilleure façon de vous assurer que vous capturez l'activité des clients potentiels est de vous assurer que votre site Web mobile simplifie le processus.

Vous souvenez-vous des 51,5 % d'utilisateurs que nous avons mentionnés plus tôt ? Eh bien, ils sont toujours là-bas. La question est, saisirez-vous cette opportunité pour les convertir ?