web-dev-qa-db-fra.com

2 boutons qui font la même chose

J'ai un client qui veut que je fasse 2 boutons sur une page qui font, regardez et disent les mêmes choses. Le bouton dirait "appliquer". La justification du client est qu'il ne veut pas que les gens le manquent, alors mettez-en un en haut et un au bas de la page.

Qu'en penses-tu? Est-ce un bon modèle pour permettre?

28
Nate Gines

C'est exactement comment cela se fait.

Ce qui se produit généralement, c'est que la description de la société elle-même, la position ouverte et les exigences du candidat sont plus que suffisantes pour remplir un écran. Parfois, il y a un lingo légal - égalité des chances, etc. - ou une carte montrant l'emplacement du bureau.

Si vous placez des boutons non collants haut et bas, les gens ne les verront pas tous les deux en même temps.

Voici trois exemples d'entreprises bien connues. Les captures d'écran sont petites (cliquez sur eux pour les versions de taille réelle.) Vous pouvez toujours trouver les boutons Appliquer assez facilement.

Microsoft ( Webm ), Apple ( Webm ), Google ( Webm )

Microsoft job offerApple job offerenter image description here

Toutes ces entreprises ont deux postes pour leur Appliquer Bouton: En haut et en bas de l'offre d'emploi.

Le second de Google apparaît une fois que le premier est hors de vue et colle au bas de votre écran visible. Sa position finale est au bas de l'offre d'emploi (c'est-à-dire qu'elle ne flotte pas jusqu'à Confidentialité.) Voir le Google Webm .

Facebook utilise un en-tête collant important pour vous assurer que le bouton Appliquer est toujours visible.

Cependant, je n'aime pas cette solution, car il a la sensation d'un défaut de 5 ans WordPress page, courtoisie de la double en-tête. Pour souligner que cela pourrait ne pas être une bonne solution: le La page Facebook a un autre problème: la couleur bleue, indicative d'un bouton primaire sur les sites Web des autres sociétés (plus Atlassien et Stackoverflow UX), est utilisé pour des actions secondaires telles comme et Partager. Mais voyez pour vous-même:

En-tête Sticky Facebook:

Facebook job offer page

Couleur primaire non dominante Facebook (avec en-tête de seconde/collante dans l'état détendu):

Facebook job offer page two

Facebook webm .

Si vous voulez voir par vous-même, voici les pages d'offre d'emploi pertinentes: Microsoft , Apple , Google . Facebook (en-tête collant)

Une note sur mobile UX:

Vous ne pouvez pas lire l'offre d'emploi sur la page Facebook, car l'en-tête collant prend la moitié de votre écran:

Facebook mobile

Le bouton FLOATER Google Apply Works Works Wonders:

Google job offer mobile

Le Microsoft and Apple Pages mobiles collant également à leurs fonctionnalités. Ils cachent tout sauf un paragraphe derrière des accordées, limitant la taille de l'écran vertical nécessaire. (Voir l'exemple Google, moins le bouton flottant.)

62
knallfrosch

D'accord avec tout le monde ci-dessus et ont reçu des demandes similaires du client plusieurs fois. Faire le bouton Sticky est une excellente option, 2 autres méthodes que j'ai faites sont: Enractiez les différents boutons de différents blocs CTA avec une messagerie différente (CTA inférieure des comptes du fait qu'ils ont suivi après le premier), A/B Testez les différents positions et choisissez-en une base sur des métriques.

1
It's Dylan

Je suis d'accord avec Chris, si deux d'entre eux sont visibles en même temps, cela créera Confsuion.

La préoccupation du client est valide mais la solution qu'il fournit pourrait ne pas être.

Le problème qu'il veut résoudre ici "Le bouton n'est pas visible tout le temps afin que l'utilisateur l'oubliera". Si vous vous concentrez sur le problème, vous pouvez penser à des solutions alternatives.

Bien qu'il n'y ait pas de visuaux expliquant votre problème, une solution suggestive est "rendre le bouton collant"

0
user_is_not_dumb