Bouton primaire
- Utiliser des couleurs saturées en accord avec l'action demandée (ex :rouge = danger, vert = continuer)
- Employé pour des actions incitatives, irréversibles, et des actions de sécurité
- Accompagner le bouton d'un label explicite (ex: soumettre, sauvegarder, continuer)
- Ne pas faire : Accompagner le bouton d'un label vague (ex : go, ok)
Bouton secondaire
- Employé pour des actions non incitatives, et moins importantes
- Employé lorsque l'action est désactivée
- Le bouton peut être remplacé par un simple lien
- Utiliser des labels explicites en accord avec l'action (ex : annuler, retour, passer à l'étape suivante)
Besoins d'un expert en UX UI design
Type de bouton
- 1.Bouton primaire, à utiliser pour les actions importantes
- 2. Bouton secondaire, à utiliser pour les actions moins importantes
- 3. Bouton spécial, à utiliser pour des boutons tels que "ajouter au favoris", "like", "tweet"....
- Ne pas faire : Accompagner le bouton d'un label vague (ex : go, ok)
Boîte de dialogue / Modale
Ce qui est conseillé
- Lecture naturelle du type Z-layout
- Balayage rapide et facile de la boite
- L'utilisateur fait le tour des actions possibles avant de terminer par l'action
Boîte de dialogue / Modale
Ce qui est déconseillé
- Lecture moins naturelle et fixation visuelle accrue
Ergonomie d’une Landing page
- 1- Titre principale ou H1
- 1.a / 1.b / 1.C - Sous titre / Argument accrocheur
- 2 - Image ou vidéo principale
- 3 - Argument de vente
- 3.a - Liste sommaire des avantages
- 4 - Témoignages
- 4 - Incitation à l'action (newsletter, test gratuit de la solution, contact etc...)
2 réflexions au sujet de “UX Cards vol 2 – 6 règles d’ergonomie web à découvrir”
Bonjour Céline,
Sympa ces cartes !
Dans quel contexte les utilisez vous ?
Vincent
Bonjour Vincent,
Donnant des cours je les utilise afin de rendre l’apprentissage de l’ergo plus ludique 😉