L'état du mobile et pourquoi les tests Web mobiles sont importants

À propos de l'auteur

Kelvin est un éditeur de logiciels indépendant qui construit actuellement Sailscasts – une plate-forme pour apprendre le JavaScript côté serveur. Il est également rédacteur technique et…
En savoir plus sur
Kelvin
↬

Les choses ont beaucoup changé au cours de la dernière décennie lorsque nous avons commencé à explorer ce que nous pouvions faire sur un petit écran mobile brillant. De nos jours, le trafic mobile représentant plus de 50% du trafic Web il est juste de supposer que la toute première rencontre de vos clients potentiels avec votre marque aura lieu sur un appareil mobile.

En fonction de la la nature de votre produit, la part de votre trafic mobile variera considérablement, mais vous aurez certainement un peu de trafic mobile – et y être préparé peut faire ou défaire l'affaire. Cela nécessite que votre site Web ou votre application soit fortement optimisé pour le mobile . Cette optimisation est cependant de nature assez complexe. Évidemment, nos expériences seront réactives – et nous avons appris à bien le faire au fil des ans – mais elles doivent également être accessibles et rapides.

Cela va bien au-delà des optimisations de base telles que le contraste des couleurs et les temps de réponse du serveur. Dans le paysage mobile fragmenté, nos expériences doivent être ajustées pour le mode low data low memory, battery and CPU reduction motion dark and light mode et tant d'autres conditions.

Laisser ces conditions hors de l'équation signifie abandonner définitivement les clients potentiels et nous cherchons donc des compromis pour offrir une grande expérience dans des délais serrés. Et pour garantir la qualité d'un produit, nous devons toujours tester – sur un certain nombre d'appareils, et dans un certain nombre de conditions.

State Of Mobile 2021

Alors que beaucoup d'entre nous, concepteurs et développeurs, sommes susceptibles de ont un téléphone portable relativement neuf dans nos poches, une grande majorité de nos clients ne nous ressemble pas tout à fait. Cela pourrait venir un peu inattendu. Après tout, lorsque nous examinons nos analyses, nous ne trouverons guère de clients naviguant sur nos sites ou applications avec un appareil de milieu de gamme sur une connexion 3G irrégulière .

Le problème ici est que, si votre L'expérience mobile n'est pas optimisée pour divers appareils et conditions de réseau, ces clients n'apparaîtront jamais dans vos analyses – simplement parce que votre site Web ou votre application sera à peine utilisable sur leurs appareils et qu'il est donc peu probable qu'ils reviennent.

Aux États-Unis et au Royaume-Uni, Le rapport Global State of Mobile 2020 de Comscore a découvert en août 2020 que l'utilisation mobile représentait respectivement 79% et 81% du total des minutes numériques. En outre, la consommation de vidéos sur les appareils mobiles a augmenté de 65% en 2020. Alors qu'une grande majorité du temps est consacrée à quelques applications mobiles, les plateformes de médias sociaux fournissent une passerelle vers le Web et vos services, en particulier dans l'éducation.

D'un autre côté, si les appareils s'améliorent avec le temps en termes de capacités et d'autonomie de la batterie, les appareils plus anciens ne sont pas vraiment abandonnés ou ne disparaissent pas dans le vide. Il n'est pas rare de voir des clients utiliser des appareils âgés de 5 à 6 ans, car ces appareils passent souvent à travers les générations servant d'appareils légèrement plus anciens mais «assez bons» pour des tâches simples et quotidiennes . En fait, un consommateur moyen met à niveau son téléphone tous les 2 ans et aux États-Unis le cycle de remplacement du téléphone est de 33 mois .

Dans le monde en 2020, 84,8% de tous les téléphones portables expédiés sont des appareils Android selon l'International Data Corporation ( IDC ). Les téléphones les plus vendus dans le monde coûtent un peu moins de 200 dollars. Un appareil représentatif est donc un appareil Android qui a au moins 24 mois coûtant 200 $ ou moins, fonctionnant sur un transfert lent 3G, 400 ms RTT et 400 kbps, juste pour être un peu plus pessimiste.

Cela peut être très différent pour votre entreprise, bien sûr, mais c'est une approximation assez proche de la majorité des clients. En fait, il peut être judicieux de se pencher sur les Amazon Best Sellers actuels pour votre marché cible.

Amazon Best Sellers pour votre marché cible en premier. ( Grand aperçu )

Mobile est un spectre et un spectre assez enraciné. Alors que le paysage mobile est déjà très fragmenté, l'écart entre l'expérience sur divers appareils va s'élargir beaucoup plus avec l'adoption croissante de la 5G.

Selon Ericsson Mobility Visualizer nous devrions nous attendre à une augmentation de 15 fois du nombre d'abonnés mobiles 5G de 212 millions en 2020, à 3,3 milliards en 2026.

Si vous souhaitez approfondir les performances des appareils Android et iOS, vous pouvez consulter Geekbench Android Benchmarks pour les smartphones et tablettes Android, et iOS Benchmarks pour iPhone et iPad.

Il va sans dire que des tests approfondis sur divers appareils – plutôt que sur un nouvel appareil Android ou iOS brillant – sont critiques pour comprendre et améliorer l'expérience de vos clients potentiels, ainsi que les performances de votre site Web ou de votre application à grande échelle.

Arguments en faveur des affaires

Bien que le test sur des appareils mobiles puisse sembler intéressant, il peut ne pas être convaincant assez pour conduire la direction et toute l'organisation ion vers les tests mobiles. Cependant, il existe un certain nombre d'études de cas de haut niveau explorant l'impact de l'optimisation mobile sur les mesures clés de l'entreprise.

WPO stats en rassemble littéralement des centaines – études de cas et expériences démontrant l'impact de l'optimisation des performances Web (WPO) dans les secteurs verticaux et les objectifs.

Driving Business Metrics

L'un des exemples les plus connus est Flipkart le plus grand site Web de commerce électronique en Inde. Pendant un certain temps, Flipkart a adopté une stratégie d'application uniquement et a fermé temporairement son site Web mobile. L'entreprise a de plus en plus de mal à offrir une expérience utilisateur aussi rapide et attrayante que celle de son application mobile.

Il y a quelques années, elle a décidé d'unifier sa présence Web et une application native dans un mobile. -Application Web progressive optimisée, résultant en une augmentation de 70% du taux de conversion . Ils ont découvert que les clients passaient trois fois plus de temps sur le site Web mobile et que le taux de réengagement augmentait de 40%.

Amélioration de la visibilité des moteurs de recherche

Ce n'est pas une grande nouvelle que les moteurs de recherche ont considéré la convivialité mobile comme faisant partie du classement des moteurs de recherche. Avec Core Web Vitals Google a poussé les facteurs d'expérience sur mobile plus au premier plan.

Dans son article sur Core Web Vitals and SEO Simon Hearne a découvert que l'index de Google La mise à jour du 31 mai 2021 entraînera un signal de classement positif pour l'expérience de page dans recherche mobile uniquement pour des groupes d'URL similaires, qui répondent aux trois cibles Core Web Vital. On s'attend à ce que l'impact du signal soit faible, similaire à l'augmentation de classement HTTPS .

Lighthouse CI est tout à fait remarquable: une suite d'outils pour exécuter, enregistrer, récupérer et s'affirmer en permanence contre les résultats de Lighthouse. ( Grand aperçu )

Une chose est certaine: vos sites Web seront mieux classés s'ils sont mieux optimisés pour les mobiles, à la fois en termes de vitesse et de convivialité mobile – cela vaut également pour l'accessibilité. [19659042] Amélioration de l'accessibilité

Créer des pages et des applications accessibles n'est pas facile. Les défis commencent avec de minuscules cibles, un contraste médiocre et une petite taille de police, mais cela devient rapidement beaucoup plus compliqué lorsque nous traitons des applications complexes d'une seule page. Pour nous assurer de bien répondre aux besoins de nos clients dans diverses situations – avec des incapacités permanentes, temporaires et situationnelles – nous devons tester l'accessibilité.

Cela signifie considérer la navigation au clavier les repères de navigation sont correctement attribués, comment les mises à jour sont annoncées par un lecteur d'écran et si nous évitons les bibliothèques inaccessibles ou les scripts tiers. Et puis, pour chaque composant que nous construisons, nous devons nous assurer de les garder accessibles au fil du temps.

Il ne devrait pas être surprenant que si un site Web n'est pas accessible à un client, il est peu probable qu'il accède à votre produit Soit. Plus vous investissez tôt dans les tests d'accessibilité, plus vous économiserez sur la route sur des conseils coûteux, des services tiers coûteux ou des avocats coûteux.

Mobile Web Testing

Donc, avec tous les défis de l'espace mobile , comment, alors, testons-nous sur mobile? Heureusement, les outils de test mobiles ne manquent pas. Cependant, la plupart du temps, lors de l'exécution de tests mobiles, l'accent est principalement mis sur la cohérence et la fonctionnalité, mais pour un test mobile plus approfondi, nous devons approfondir certaines spécificités pas si évidentes des tests.

Tailles d'écran [19659034] Les tailles d'écran sont l'une des nombreuses choses qui changent constamment dans le domaine des appareils mobiles. Année après année, de nouvelles tailles d'écran et densités de pixels apparaissent avec les nouvelles versions d'appareils. Cela pose un problème pour tester les sites Web et les applications sur ces appareils, ce qui rend le débogage plus difficile et plus long.

Fragmentation de la version du système d'exploitation

Avec iOS ayant un taux d'adoption élevé sur ses dernières versions du système d'exploitation (un taux de 57% sur son dernier iOS 14), et la pléthore de versions encore utilisées par les appareils Android remontant aussi loin que Ice Cream Sandwich, il faut s'assurer de tenir compte de cette fragmentation lors des tests mobiles.

Navigateur fragmentation

Avec Chrome et Safari ayant une utilisation globale de 62,63% et 24,55% sur mobile respectivement, on pourrait être tenté de se concentrer uniquement sur ces navigateurs lors des tests mobiles. Cependant, selon la région du monde, vous êtes plus susceptible de tester dans d'autres navigateurs moins connus, ou des navigateurs proxy tels qu'Opera Mini. Même si leur pourcentage d'utilisation peut être faible, il peut atteindre des centaines de milliers d'utilisation dans le monde.

Exécution de tests Web mobiles

Pour effectuer des tests Web mobiles, une option consiste à configurer un laboratoire de périphériques ] et exécutez les tests localement. En période de travail à distance, c'est assez difficile car vous avez généralement besoin d'un certain nombre d'appareils à votre disposition. L'acquisition de ces appareils ne doit pas nécessairement coûter cher, et l'expérience du chargement par vous-même est extrêmement précieuse. Cependant, si nous voulons vérifier la cohérence de l'expérience ou effectuer des tests automatisés, cela ne suffira probablement pas.

Dans de tels cas, un bon point de départ est Responsivement une ouverture gratuite. outil source avec interactions en miroir, mise en page personnalisable, plus de 30 profils de périphériques intégrés, rechargement à chaud et outils de capture d'écran.

Vous pouvez également vous pencher sur les navigateurs dédiés aux développeurs pour les tests mobiles.

Sizzy prend en charge le défilement synchronisé, les clics et la navigation entre les appareils, et prend des captures d'écran de tous les appareils à la fois, avec et sans cadre d'appareil. De plus, il inclut un élément d'inspection universel pour inspecter tous les périphériques à la fois.

Blisk prend en charge plus de 50 périphériques prêts à l'emploi, ainsi que le défilement de synchronisation. Vous pouvez tester la prise en charge tactile et prévisualiser les appareils côte à côte, en travaillant avec le même morceau de code sur tous les appareils ouverts. Le rechargement à chaud est également pris en charge, ainsi que l'enregistrement vidéo et les captures d'écran.

Un autre petit outil utile est LT Browser une application Web vous permettant d'effectuer le débogage de la vue mobile sur plus de 45 appareils – sur mobile, tablette et ordinateur de bureau. ( Divulgation complète et rappel: LambdaTest est un sympathique sponsor de cet article ).

Une fois vous avez téléchargé le navigateur et enregistré, vous pouvez créer, tester et déboguer votre site Web, ainsi que prendre des captures d'écran et des vidéos de bogues, les attribuer à des appareils spécifiques, exécuter un profilage des performances et observer plusieurs appareils côte à côte. Par défaut, une version gratuite fournit 30 minutes par jour.

Si vous avez besoin de quelque chose d'un peu plus avancé, LambdaTest vous permet d'exécuter un test multi-navigateur sur plus de 2000 appareils sur différents systèmes d'exploitation. En outre, BrowserStack fournit une option pour automatiser les tests ainsi que les tests de batterie faible, de coupure de courant brutale et d'interruptions telles que les appels ou les SMS.

Conclusion

Dans cet article, nous avons examiné l'état du mobile en 2021. Nous avons vu l'utilisation croissante des appareils mobiles comme le principal moyen d'accéder au Web, et nous avons examiné certains défis liés à cela. Nous avons également examiné certains défis spécifiques liés aux tests mobiles et comment certains outils peuvent nous aider à trouver et à corriger les bogues sur mobile.

Gardez à l'esprit que votre site Web est le visage de votre entreprise et que de plus en plus d'utilisateurs vont y accéder via leurs téléphones portables. Il est important de vous assurer que vos utilisateurs peuvent accéder aux services que vous fournissez sur votre site Web et bénéficier d'une expérience accessible et rapide sur leurs appareils comme ils le font sur la version de bureau. Cela garantira que les avantages de la visibilité de la marque reçoivent l'attention qu'ils méritent.

(vf, il) [19659070]

Le meilleur outil 2023 pour ta croissance Instagram !

Source link

Partager :

• Cliquez pour partager sur Twitter(ouvre dans une nouvelle fenêtre)
• Cliquez pour partager sur Facebook(ouvre dans une nouvelle fenêtre)

Articles similaires