Dans ce cadre, cet article vous donnera quelques conseils utiles sur la façon de rendre un site web mobile friendly. Il vous expliquera plus en détail pourquoi il est essentiel d’en avoir un.<\/p> Rendre votre site internet compatible avec les mobiles nécessite un peu de connaissances techniques. Pour cela, nous allons vous guider. Voici plusieurs façons de rendre un site mobile friendly :<\/p> L’approche “mobile-first” ou priorité aux mobiles consiste à développer et à concevoir des sites pour les appareils mobiles, puis à se concentrer dans un second temps aux ordinateurs de bureau.<\/p> Certains développeurs et concepteurs travaillent d’abord pour les ordinateurs de bureau, puis se chargent de la conception pour le mobile. Cependant, maintenant que l’indexation mobile-first existe, inverser ce flux de travail vous aidera à optimiser la conception dès le départ pour rendre votre site mobile friendly.<\/p> Si vous disposez déjà d’un site internet entièrement fonctionnel mais qu’il n’est pas encore optimisé pour l’usage mobile, convertissez-le en une version mobile ou créez un site qui sera mobile friendly.<\/p> Il existe deux méthodes pour y parvenir. Vous pouvez vous servir soit de l’utilisation de constructeurs de sites web, soit de plugins CMS.<\/p> Recréer un site pour ordinateur avec un constructeur de sites web<\/strong><\/p> Si vous optez pour la création d’un nouveau site mobile friendly, utilisez un créateur de site Web<\/a> pour recréer facilement et sans codage le design du site adapté aux ordinateurs de bureau. Gardez à l’esprit qu’il n’est pas possible d’importer les fichiers de votre site web à partir d’une autre plateforme. Seulement, vous pouvez vous rapprocher de son design original.<\/p> Les créateurs de sites web offrent une interface intuitive de type “glisser-déposer”. Cet outil vous permet d’économiser du temps et des ressources lors du développement d’un site web adapté aux mobiles.<\/p> Ils proposent également des modèles responsives qui s’adaptent automatiquement à tous les appareils utilisés par les visiteurs, de sorte que vous n’avez pas besoin de recommencer la conception depuis le début à chaque fois.<\/p> Parmi les créateurs de sites internet les plus populaires figurent Shopify<\/strong>, Wix<\/strong> et le créateur de Hostinger<\/strong>.<\/p> Les abonnements du créateur de sites Hostinger <\/strong>vont de \u20ac2.99<\/strong> à \u20ac3.99 par mois<\/strong>. Ses fonctionnalités avancées comprennent des fonctions de commerce électronique<\/strong> comme la gestion des commandes et des stocks. Des outils d’Intelligence Artificielle (IA), comme un AI Writer qui génère du contenu pour votre site web, sont aussi inclus.<\/p> En outre, il offre une optimisation mobile et une vitesse de chargement rapide.<\/p> Convertir un site Web à l’aide d’un plugin CMS<\/strong><\/p> De nos jours, les thèmes des CMS sont déjà conçus pour être responsives. Toutefois, si votre thème n’est pas encore prêt pour le mobile, un plugin peut être la solution.<\/p> Pour les utilisateurs de WordPress, WPtouch Pro<\/a> aide à transformer l’apparence et le fonctionnement de votre site WordPress sur les appareils mobiles. Vous pouvez inclure ou exclure des pages spécifiques pour votre site mobile.<\/p> Installez le plugin<\/a> et activez-le. Vous serez ainsi en mesure de convertir ou de configurer votre site adapté aux ordinateurs de bureau en un site mobile friendly, juste en quelques étapes.<\/p> Si vous utilisez Joomla, convertissez votre site à l’aide de Responsivizer<\/a>. Ses fonctions comprennent le redimensionnement et l’optimisation des images. Elles sont idéales pour accélérer votre site.<\/p> L’utilisation d’un thème responsive est une option simple et pratique pour les débutants ou pour les utilisateurs non techniques qui souhaitent créer un site web mobile friendly. En installant ce type de thème, votre site Web s’adapte automatiquement à n’importe quel appareil mobile.<\/p> Si vous venez de commencer à créer un site internet, l’utilisation d’un thème responsive rendra celui-ci dès le départ adapté aux mobiles. Toutefois, si vous avez déjà un site internet adapté aux ordinateurs de bureau bien référencé sur les moteurs de recherche, veillez à sauvegarder le site<\/a> avant de changer de thème.<\/p> Assurez-vous qu’il est possible de restaurer la version précédente du site si éventuellement des modifications provoquent un crash.<\/p> Presque tous les thèmes de CMS et les modèles de constructeurs de sites<\/a> sont dotés d’un design responsive. Vous aurez donc l’embarras du choix.<\/p> Si vous n’arrivez toujours pas à en trouver un qui réponde à vos besoins et à vos préférences, une marketplace de thèmes comme Themeforest<\/a> offrent toujours de nombreuses options.<\/p> Lisez les avis sur les thèmes et consultez les sites qui utilisent le thème souhaité sur un appareil mobile. Cela vous permet de tester les performances du thème en matière d’expérience utilisateur et de choisir le thème le plus rapide pour un téléphone mobile.<\/p> La vitesse symbolise l’un des facteurs les plus importants pour un thème responsive. A cet effet, utilisez Pingdom<\/a> pour tester si le thème se charge rapidement.<\/p> Par exemple, utilisons Avada<\/a> l’un des thèmes responsives les plus populaires de WordPress sur le marché. A cet effet, nous allons utiliser la démo live d’Avada Festival <\/strong>pour ce test.<\/p> Entrez l’URL de la démo sur Pingdom et choisissez l’emplacement du test. Il est possible de tester les performances de votre site dans n’importe quelle région du monde. Cliquez sur le bouton “Start Test”.<\/strong><\/p> Le test indiquera le niveau de performance de votre site, la taille des pages, le temps de chargement et le nombre de requêtes. Il donnera également quelques suggestions sur la façon d’améliorer la vitesse de celui-ci.<\/p> Il vous aide à évaluer la vitesse du thème. Comme cela, vous saurez s’il est léger et ce que vous pouvez faire pour améliorer sa vitesse en le rendant plus mobile friendly.<\/p> Adobe a arrêté le développement de Flash le 30 décembre 2020. Ainsi, aucun des principaux navigateurs – tels que Google Chrome<\/strong>, Safari<\/strong>, Mozilla Firefox<\/strong> – ne le prend en charge.<\/p> Désormais, la plupart des contenus basés sur Flash ont été mis à jour en fonction des normes modernes telles que HTML5<\/a> <\/strong>et WebGL<\/strong>.<\/p> Un hébergement web rapide<\/a> ainsi que la qualité du serveur influencent fortement les performances de votre site web. Choisissez donc un fournisseur d’hébergement Web rapide et fiable pour que votre site Web puisse fonctionner à une vitesse optimale.<\/p> Pour obtenir de meilleures performances, nous vous recommandons d’utiliser un hébergement Cloud <\/strong>ou VPS<\/a><\/strong>. Tous les deux offrent la meilleure vitesse de réponse du serveur. C’est un élément crucial lorsqu’il s’agit de la performance de votre site.<\/p> Un autre aspect dont vous devez tenir compte pour optimiser la vitesse de votre site se rapporte au nombre de pages de contenu qui nécessitent un plugin supplémentaire pour fonctionner. C’est particulièrement vrai en ce qui concerne la page d’accueil.<\/p> Voici quelques conseils pour vous assurer que votre page d’accueil ne va pas ralentir votre site :<\/p> Si votre contenu est la principale raison pour laquelle les internautes sont attirés par votre site, son design a par conséquent un impact significatif sur le taux de rebond de celui-ci. Ainsi, vous devez faire une bonne impression dès le début.<\/p> Pour vérifier dans quelle mesure votre site est adapté aux appareils mobiles, utilisez l’outil Mobile-Friendly Test<\/a> de Google. Il suffit d’indiquer l’URL de votre site pour effectuer le test.<\/p> L’outil mobile friendly fournira une analyse détaillée d’un site. Il visualise votre site sur différents appareils mobiles et indiquera s’il est adapté ou non à ceux-ci.<\/p> Il recommandera en même temps plusieurs mesures à prendre pour améliorer les performances de votre site afin qu’il devienne mobile friendly.<\/p> Accelerated Mobile Pages<\/a> (AMP) est un outil qui vise à accélérer les temps de chargement de votre site internet.<\/p> Il limite le HTML\/CSS et le JavaScript<\/a> en compressant les données du site à un volume huit fois inférieur à celui d’une page web mobile ordinaire. Il en résulte des processus de chargement jusqu’à quatre fois plus rapides.<\/p> Voici quelques-uns des autres avantages de l’utilisation d’AMP.<\/p> Il accélère le temps de chargement du site sur les appareils mobiles<\/strong><\/p> Plus de 50 % des utilisateurs de mobiles quitteront un site s’il met plus de trois secondes à se charger. Heureusement, AMP augmente la vitesse de votre site afin que vous ne perdiez pas ce précieux trafic organique.<\/p> AMP en soi ne fait pas partie des facteurs de classement pour le référencement. Par contre, la vitesse qu’il fournit en fait partie. C’est pourquoi les pages AMP ont tendance à être mieux classées dans les SERP.<\/p> Il utilise Google AMP Cache pour améliorer les performances du serveur<\/strong><\/p> Google AMP Cache est un réseau de diffusion de contenu<\/a> (CDN) basé sur un proxy pour faciliter le processus de transfert des documents AMP valides aux utilisateurs.<\/p> En d’autres termes, Google AMP Cache conserve les données de votre site, ce qui lui permet de se charger plus rapidement et d’être plus mobile friendly.<\/p> Voici quelques-unes des principales fonctionnalités de Google AMP Cache qui peuvent améliorer les performances de votre serveur :<\/p> L’activation d’AMP dépend du CMS que vous utilisez. Si votre site web est alimenté par WordPress, utilisez le plugin AMP<\/a> pour générer automatiquement des versions AMP de vos pages.<\/p> Si votre site n’est pas basé sur WordPress, créez une page AMP à partir de zéro<\/a> ou convertissez une page HTML en AMP<\/a>.<\/p> Les medias queries permettent d’adapter le contenu par rapport à l’appareil qu’utilise l’internaute. Elles invitent l’appareil à définir quelle est sa taille. Puis, elles demandent au navigateur d’afficher une page Web en fonction de feuilles de style en cascade (CSS) que vous avez définies.<\/p> Elles constituent un élément essentiel d’un site mobile friendly. En effet, elles permettent l’adaptation automatique de votre site aux différentes tailles d’écran.<\/p> Voici un exemple de requête média dans un fichier CSS :<\/p> Dans l’exemple ci-dessus, le code ne s’appliquera qu’aux écrans d’une largeur de 640 pixels ou moins, modifiant ainsi la disposition des colonnes pour mieux les adapter.<\/p> Vous devez configurer toutes vos requêtes média pour toutes les tailles d’appareils, et pas seulement pour les appareils les plus populaires.<\/p> Des outils de test visuel comme CrossBrowserTesting<\/a> peuvent vous aider à tester votre site sur plus de 2 000 navigateurs et appareils mobiles.<\/p> Les polices standard comme Open Sans<\/a> et Droid Sans<\/a> sont faciles à lire, surtout sur les petits écrans des téléphones mobiles.<\/p> D’autre part, les polices personnalisées et créatives comme Pacifico<\/a> peuvent rendre votre site visuellement plus attrayant. Seulement, elles sont difficiles à lire si vous les utilisez pour les textes du corps du contenu.<\/p> Elles peuvent également inciter les visiteurs de votre site à télécharger de nouvelles polices sur leur téléphone mobile. Malheureusement, cela nuit à l’expérience utilisateur et le fait partir immédiatement.<\/p> Vous devez également tenir compte de la taille de la police à utiliser. A cet effet, la taille idéale du texte pour le corps du contenu principal sur un site mobile est de 16 pixels<\/strong>. Les textes secondaires et tertiaires, tels que les légendes, peuvent être 2 pixels<\/strong> plus petits<\/strong> que le corps du texte.<\/p> Des polices différentes peuvent être plus ou moins lisibles à la même taille. Toutefois, il faut systématiquement toujours les tester en lisant le texte sur un appareil mobile.<\/p> Lorsqu’il s’agit de sites mobiles, l’objectif est de créer la plus petite taille possible sans perdre la qualité globale des images. En effet, les appareils mobiles ont une bande passante beaucoup plus étroite que les ordinateurs de bureau, de sorte que les fichiers d’images volumineux prennent plus de temps à charger.<\/p> De nombreux utilisateurs de téléphones mobiles utilisent également un plan de données limité. De cette façon, les images de petite taille peuvent les aider à utiliser moins de données.<\/p> Il existe deux façons d’optimiser vos images et ainsi rendre votre site mobile friendly : en utilisant un logiciel d’édition visuelle ou des plugins.<\/p> Si vous choisissez d’optimiser vos images à l’aide d’un logiciel d’édition visuelle, vous devez le faire avant de télécharger ces fichiers. Utilisez Adobe Photoshop<\/a> ou des outils Web tels que TinyPNG<\/a> ou ImageResizer<\/a>.<\/p> Si vous utilisez WordPress, des plugins comme ShortPixel<\/a> ou Compress JPEG & PNG Images<\/a> peuvent compresser automatiquement vos images lorsque vous les téléchargez.<\/p> Les résolutions des téléphones portables sont très différentes. Si vos images ont une marge de pixels fixes, elles ne seront pas réduites correctement sur les petits écrans. Vos visiteurs devront alors faire défiler l’image horizontalement, car elle dépasse la largeur de l’écran.<\/p> Par exemple, la bannière d’en-tête du site web du James Bond Museum<\/strong> utilise une configuration à pixels fixes au lieu d’une configuration en pourcentage. Vous devez par conséquent faire défiler l’écran horizontalement pour voir l’intégralité de la bannière. Ce n’est donc pas mobile friendly.<\/p> Il est également possible de faire un zoom arrière, mais le texte à l’intérieur et autour de la bannière seront plus difficiles à lire.<\/p> Modifiez votre CSS pour configurer l’affichage des images<\/a> sur vos pages mobiles. Cela permettra d’offrir une expérience d’affichage cohérente et un impact visuel sur tous les appareils.<\/p> Les sites mobiles ont des écrans plus petits. Il est donc important de donner à vos liens une distance suffisante les uns des autres afin que vos visiteurs ne tapent pas accidentellement sur la mauvaise URL.<\/p> De plus, essayez de ne créer que des liens vers des pages Web qui sont également adaptées aux mobiles afin d’obtenir une expérience sans faille.<\/p> Lorsqu’il s’agit de boutons d’appel à l’action (CTA), vous devez les rendre faciles à repérer. En d’autres termes, les boutons doivent être suffisamment grands pour être tapés avec le pouce et placés à des endroits stratégiques.<\/p> Comme la plupart des utilisateurs mobiles utilisent leur smartphone d’une seule main, placez votre CTA à un endroit pratique pour une utilisation d’une seule main. Par exemple, placez celui-ci au milieu de l’écran, car il sera plus facile à atteindre que si vous le placez dans les coins de l’écran.<\/p> Si vous avez plus d’un bouton sur la Page de votre site Web mobile, décidez lequel est le plus prioritaire. Placez ces boutons avec une plus grande taille pour attirer immédiatement l’attention de vos visiteurs.<\/p> Par exemple, la version adaptée aux ordinateurs de bureau de Magic Spoon<\/a> comporte trois CTA : Acheter maintenant<\/strong>, Essayer maintenant <\/strong>et Explorer<\/strong>. Cependant, il n’y a qu’un seul CTA sur le site mobile. Il s’agit du bouton Essayer maintenant. Celui-ci représente effectivement son intention première. C’est une excellente méthode pour être mobile friendly.<\/p> Sur les sites adaptés aux ordinateurs de bureau, les pop-ups peuvent contribuer à augmenter les conversions. En outre, ils sont faciles à fermer. En revanche, leur affichage sur votre site mobile peut agacer les visiteurs.<\/p> Les utilisateurs de mobiles peuvent cliquer accidentellement sur un pop-up qui pourrait les diriger vers une nouvelle page. Cette expérience utilisateur désagréable peut les inciter à quitter votre site.<\/p> Il est par conséquent préférable de désactiver complètement les fenêtres pop-up sur votre site web mobile. Au cas où vous en avez besoin pour promouvoir quelque chose sur votre site, utilisez-les de manière plus stratégique.<\/p> Vous pouvez également utiliser d’autres éléments du site à des fins promotionnelles, comme une bannière supérieure moins intrusive. Il suffit de l’accompagner d’un bouton de fermeture de taille moyenne.<\/p> N’oubliez pas que Google pénalise<\/a> les sites Web qui utilisent des fenêtres pop-up intrusives. Cela signifie que si votre site comporte une fenêtre contextuelle pleine page qui bloque tout l’écran ou qui apparaît dès qu’une personne le visite, Google peut considérer votre site comme moins accessible pour les utilisateurs.<\/p> Votre site sera alors mal classé dans les SERP, ce qui réduira votre trafic organique. C’est donc important d’avoir un site mobile friendly.<\/p> La balise meta Viewport indique la zone visible d’une page web. Elle représente un moyen facile pour contrôler l’échelle de la page pour qu’elle puisse s’afficher correctement sur différents appareils mobiles.<\/p> Cette balise meta indique aux navigateurs d’adapter la largeur de la Page web à la taille de l’écran utilisé par le visiteur pour accéder au site.<\/p> Pour l’appliquer, insérez l’extrait de code suivant dans les balises <head<\/strong>> de la Page HTML de votre site Web :<\/p> <meta name=”viewport” content=”width=device-width, initial-scale=1″><\/em><\/p> Si vous avez des formulaires sur votre site, il est préférable de désactiver la fonction de correction automatique sur tous les champs du formulaire. Ainsi, vos visiteurs ne verront pas leurs noms ou leurs adresses électroniques remplacés par des mots courants. C’est ennuyeux, tout en ralentissant le processus de remplissage du formulaire.<\/p> Pour ce faire, ajoutez autocorrect=”off”<\/strong> dans le champ de saisie de votre HTML. La saisie mise à jour devrait ressembler à ceci :<\/p> <input spellcheck=”false” autocorrect=”off” type=”text” \/><\/em><\/p> Vous devez également veiller à ce que vos formulaires soient courts. Les formulaires trop longs sont peu pratiques à remplir, quel que soit l’appareil, notamment s’il s’agit de mobile.<\/p> Les gens préfèrent accéder à Internet via un mobile. Cela leur permet d’effectuer de nombreuses activités différentes, comme lire des articles en ligne ou effectuer des transactions financières. Cela peut se faire à tout moment et n’importe où. Par conséquent, un site web adapté à un mobile est primordial.<\/p> En outre, le chiffre d’affaires des ventes de commerce sur mobile en 2021 devrait dépasser les 3 500 milliards de dollars, soit 3,5 fois plus qu’en 2016. Cela signifie que les sites optimisés mobiles friendly peuvent aider à développer votre activité à un tout autre niveau.<\/p> Cependant, si votre site Web n’est pas adapté aux mobiles, Google le classera plus bas dans ses SERP. Et soyez assuré que cela peut entraîner une perte de trafic importante.<\/p> Avoir un site Web adapté aux téléphones mobiles signifie que les visiteurs de votre site Web bénéficieront de la meilleure expérience utilisateur, quel que soit l’appareil qu’ils utilisent pour y accéder.<\/p> Vous pouvez y parvenir en appliquant l’une des pratiques qui suivent :<\/p> Parmi ces quatre pratiques, avoir un site Web responsive est le choix le plus populaire. Même Google recommande<\/a> de l’utiliser. Voici quelques raisons pour lesquelles l’utilisation du site web responsive apporte plus d’avantages par rapport aux autres méthodes :<\/p> 1. Meilleur référencement<\/strong><\/p> Les sites responsives utilisent la même URL et le même HTML, quel que soit l’appareil utilisé pour accéder à la Page. Cela permet à Google d’explorer, d’indexer et de gérer le contenu du site plus facilement et plus efficacement. Par conséquent, votre site aura un meilleur référencement<\/a>.<\/p> D’un autre côté, une URL distincte exige plus d’efforts de référencement, car Google pourrait les traiter comme des sites web indépendants. Ainsi, votre URL mobile risque de ne pas être aussi bien classée que le site original et vice-versa.<\/p> L’optimisation des applications mobiles est différente car le référencement ne s’applique qu’aux moteurs de recherche des sites Web. Utilisez plutôt l’optimisation des recherches dans les applications (ASO). Cette pratique est similaire au référencement, mais sur une plateforme différente.<\/p> 2. Pas besoin de créer un nouveau design pour votre site<\/strong><\/p> Un design responsive ajuste automatiquement la hauteur, la largeur et la résolution pour s’adapter aux différentes tailles d’écran. Le contenu reste le même, mais la page adapte sa mise en page à l’appareil du visiteur.<\/p> Par exemple, Rolling Stone<\/strong> propose de nombreux éléments dans sa barre de menu supérieure si vous ouvrez le site via un navigateur de bureau. Cela permet aux utilisateurs d’ordinateurs de bureau de cliquer directement sur le sujet qui les intéresse.<\/p> En revanche, le site mobile présente un menu plus simple : il place tous les éléments dans un “bouton hamburger”. Ce bouton ne prend pas beaucoup de place sur les petits écrans, ce qui permet aux utilisateurs de se concentrer sur le contenu. <\/p> Le design responsive offre une solution qui vous permet d’économiser beaucoup de temps et d’énergie. En effet, vous n’avez pas à créer deux sites différents à partir de zéro.<\/p> Cependant, si vous choisissez d’utiliser une URL ou une application mobile distincte, vous devrez créer des designs différents.<\/p> 3. Facile à gérer<\/strong><\/p> Un site responsive est facile à gérer et à entretenir, car toutes les mises à jour que vous effectuez apparaissent sur toutes les versions du site. Il n’y aura aucune différence dans le contenu qui s’affiche sur un PC ou sur un appareil mobile.<\/p> En outre, les coûts d’exploitation d’un site Web responsive sont moins élevés. En effet, vous n’avez pas besoin de développer des sites Web différents pour les ordinateurs de bureau et pour les appareils mobiles.<\/p> Le service dynamique vous permet également de maintenir plusieurs versions du site via un seul site Web. Toutefois, sa mise en œuvre nécessite des coûts plus élevés et un personnel informatique dédié pour gérer le code source.<\/p>![\"\"](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/12\/eBook_-Speed-Up-your-website-FR-1024x283-1.png\/public\")
<\/a><\/figure>16 conseils pour rendre un site web adapté aux mobiles<\/h2>
1. Commencez par une approche priorité aux mobiles<\/h3>
2. Convertissez ou recréez un site adapté aux ordinateurs de bureau pour les mobiles<\/h3>
![\"Plugin](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-6.png\/public\")
<\/figure>![\"\"](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/12\/FR-Website-Builder_in-text-banner-1-1-1024x300-1.png\/public\")
<\/a><\/figure>3. Utilisez un thème responsive<\/h3>
![\"Page](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-7.png\/public\")
<\/figure>![\"Outil](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-8.png\/public\")
<\/figure>![\"résultat](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-9.png\/public\")
<\/figure>4. N’utilisez pas Flash<\/h3>
5. Optimisez la vitesse du site<\/h3>
\n
![\"\"](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2022\/12\/FR-Web-hosting_in-text-banner-1-1024x300-1.png\/public\")
<\/a><\/figure>6. Faites attention à l’apparence du site<\/h3>
![\"page](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-10.png\/public\")
<\/figure>7. Activez les pages mobiles accélérées (AMP)<\/h3>
\n
8. Utilisez les medias queries<\/h3>
}\n\/* Sur les écrans de 640px de large ou moins, utilisez deux colonnes au lieu de quatre *\/\n@media screen and (max-width : 640px) {\n .column {\n largeur : 50% ;\n}<\/pre>9. Utilisez des polices standard<\/h3>
![\"banière](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-11.png\/public\")
<\/figure>10. Optimisez les images<\/h3>
![\"page](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-12.png\/public\")
<\/figure>![\"banière](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-13.png\/public\")
<\/figure>\n<\/div>11. Utilisez des pourcentages plutôt que des pixels<\/h3>
![\"Site](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-14.png\/public\")
<\/figure>\n<\/div>12. Donnez suffisamment d’espace aux liens<\/h3>
13. Optimisez le placement des boutons<\/h3>
![\"llustration](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-15.png\/public\")
<\/figure>\n<\/div>![\"Site](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-16.png\/public\")
<\/figure>\n<\/div>14. Réduisez le nombre de fenêtres pop-up<\/h3>
![\"Site](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-17.png\/public\")
<\/figure>\n<\/div>15. Utilisez la balise meta Viewport <\/h3>
16. Désactivez la correction automatique sur les formulaires<\/h3>
Pourquoi un site Web doit-il être adapté aux mobiles ?<\/h2>
Pourquoi le site web responsive est-il important ?<\/h2>
\n
![\"Site](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-18.png\/public\")
<\/figure>\n<\/div>![\"site](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/46\/2023\/02\/image-19.png\/public\")
<\/figure>\n<\/div>Conclusion<\/h2>