comment bien tester son site rwd ?
TRANSCRIPT
![Page 1: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/1.jpg)
RESPONSIVE WEB DESIGN COMMENT BIEN TESTER ?
ATELIER EN LIGNE FRENCHWEB
Jeudi 5 novembre 2015
![Page 2: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/2.jpg)
CHASSEURS DE BUGS
Membre de
TESTEURS
ANALYSTES
CHEFS DE PROJETS
STARDUST ACCOMPAGNE SES CLIENTS
DANS LA TRANSFORMATION ET L’OPTIMISATION DE LEURS SOLUTIONS DIGITALES.
Marseille - Paris - Lille - Montréal - Londres - Berlin
ASSURANCE QUALITÉ
A PROPOS DE STARDUST
SPÉCIALISTE DU TEST
Applications
Sites web
Emailing & Bannières
Internet of things
+2 000 TERMINAUX
![Page 3: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/3.jpg)
ON DEMANDFULL SERVICE
Outil d’estimation instantanée du budget de test
Aide à la planification de campagnes de test
Bonnes pratiques et boîte à outils
Services de test « à la carte »
Définition de la stratégie de test
Accompagnement et suivi global du projet
Rédaction du cahier de recette
Mise en place des outils et ressources
Reporting des anomalies
Analyse des résultats & bilan
Gestion d’un projet de test de A à Z
Accompagnement ciblé des phases de test
Forfait d’heures de test
Mise en place des outils et ressources
Reporting des anomalies
NOS OFFRES DE SERVICE
A PROPOS DE STARDUST
STARDUSTPARTNER PROGRAM
Agences digitales
![Page 4: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/4.jpg)
QUELQUES CHIFFRES
RAPPEL RESPONSIVE WEB DESIGN
ÉTAT DES LIEUX DU TEST RESPONSIVE WEB DESIGN
PRIORITÉ : CHOIX DES TERMINAUX
STRATÉGIE DE TEST
FOCUS TESTS MOBILE
FOCUS BLOCS DE CONTENUS EXTERNES
FOCUS E-COMMERCE
DE QUOI ALLONS-NOUS PARLER ?
![Page 5: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/5.jpg)
QUELQUES CHIFFRES
Les mobiles et tablettes sont N°1
pour surfer sur le Web à 52,7 %*.64 % des sites français
ne sont pas mobile friendly**.
+ D’EXPÉRIENCE OMNICANALE
CROSS DEVICEPENSER MOBILE FIRST
* Médiamétrie (09 2015 : smartphone : 43,7 %, tablette : 9 %) ; ** Google.
![Page 6: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/6.jpg)
1 seul SITE WEB pour TOUS LES TERMINAUX
Smartphones
Tablettes
Phablets
Ordinateurs
TV
Capacité d’un site web à s’adapter au terminal
1 SEUL DÉVELOPPEMENT
RAPPEL RESPONSIVE WEB DESIGN
DEFINITION
Affichage adapté en fonction de la taille/résolution de l’écran (ou du navigateur)
RWD
![Page 7: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/7.jpg)
1 seul développement
1 seule recette
1 code à maintenir
1 MAJ. transparente et multiplateforme
1 référencement global
1 seul contenu
Performance optimisée
Multi-devices
AVANTAGES
RAPPEL RESPONSIVE WEB DESIGNRWD
Complexité (cadrage, gestion de projet)
Projet plus long
Maîtrise du RWD (wireframes, media
queries, etc.)
Maintenance plus complexe
INCONVÉNIENTS
![Page 8: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/8.jpg)
![Page 9: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/9.jpg)
![Page 10: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/10.jpg)
Penser TEST dès les spécifications du projet
TESTEUR
=
utilisateur
![Page 11: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/11.jpg)
ÉTAT DES LIEUX DU TEST RWD
67 % des DSI pensent que les sites en RWD sont plus difficiles à tester.*
* ISV- comScore, avril 2014 ; ** Moyenne StarDust 2014
+ 80 % des équipes Projet utilisent au moins une fois un émulateur Responsive.*
1 site RWD est testé en moyenne sur 5 devices.*
62,6 % des bugs sont uniques à 1 ou + devices
37,4 % sont communs à tous les devices
Or, sur 100 bugs détectés ** :
![Page 12: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/12.jpg)
PRIORITÉ : CHOIX DES TERMINAUX
RÉSOLUTIONS
POINTS DE RUPTURE
OS / VERSIONS
NAVIGATEURS
ECHANTILLON DE TEST
20 à 25 configurations >> couverture des risques à 80 %
35 à 45 configurations >> Couverture des risques à 90 à 95 %CONSEIL STARDUST
STATISTIQUESVENTE & TRAFIC
USAGES
![Page 13: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/13.jpg)
STRATÉGIE DE TEST
Tests prioritaires sur les autres devices
PÉRIMÈTRE DE TEST
SCÉNARISÉE
Scénario 1• Lorem ipsum• Lorem ipsum
Scénario 2• Lorem ipsum• Lorem ipsum
Scénario 3• Lorem ipsum• Lorem ipsum
EXPLORATOIRE
TESTS COMPLETS
Sur les terminaux les plus importants
Manque de temps et/ou budget ? PRIORISER
TESTS OPTIMISÉS
APPROCHES
![Page 14: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/14.jpg)
FOCUS TESTS MOBILE
RÉSEAUX
CONNEXION
3G / 4G / WifiMode avion
Perte de connexion
SmartphonePhabletsTablettes
Laptop
NAVIGATIONTOUCH / TACTILE
FRAGMENTATION
RésolutionsOS / navigateurs
Nouveaux devices
Port
rait
Paysage
DEVICESAFFICHAGE
Blocs image / textesIMPORTANT !
Optimiser le contenu
CONTENU
![Page 15: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/15.jpg)
FOCUS BLOCS DE CONTENU EXTERNES
!PLAYER VIDÉOS
BANNIÈRES PUB
CHAT ONLINE…
![Page 16: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/16.jpg)
Noël 20151 ACHAT SUR 4 sera effectué sur mobile.**
FOCUS E-COMMERCE
ACHATRecherche produit
Comparaisons
Wish listPanier paiement
SMARTPHONES / TABLETTES DESKTOPS / TABLETTES
TESTS DU TUNNEL D’ACHAT
65 % des consommateurs commencentleur parcours d’achat sur smartphone*
61 % terminent leur achat sur desktop*
* Signal 2015 ; ** Criteo 2015.
![Page 17: Comment bien tester son site RWD ?](https://reader034.vdocuments.mx/reader034/viewer/2022042722/58a893aa1a28ab68208b590b/html5/thumbnails/17.jpg)
MERCI
François Joseph VIALLON, CEO StarDust
www.stardust-testing.com
On se souvient de la qualité bien plus longtemps que du prix.
Guccio Gucci