web-dev-qa-db-fra.com

Meilleures étiquettes que "Date 1" et "Date 2"

Je travaille sur une application web qui a une fonctionnalité pour comparer le prix des produits à différentes dates pour voir s'ils ont augmenté ou diminué. Fondamentalement, l'utilisateur sélectionne deux dates et cliquez sur Rechercher. Pour le moment, les étiquettes sont "Date de comparaison" pour la première date et "Date de capture" pour la deuxième date, ce qui est loin d'être intuitif.

Quelles seraient les meilleures étiquettes dans ce cas? Veuillez noter que la commande n'est pas importante, c'est-à-dire date1> date2 ou date1 <date2

Capture d'écran pour le contexte enter image description here

13
Toni Toni Chopper

Je pense qu'il vous manque un élément du formulaire. Essayer d'expliquer chaque champ individuel plutôt que le but de ces deux champs dans leur ensemble.

Pensez à cela dans une perspective d'accessibilité. Si quelqu'un utilise un lecteur d'écran pour lire les éléments de la page, afin de ne pas avoir d'indices visuels sur les champs, à quoi s'attendraient-ils?

Par conséquent, j'irais avec l'introduction d'un legend dans les champs pour présenter leur objectif. Select dates to compare, puis nommez logiquement les champs après en avoir introduit le concept. Donc First date et Second date fonctionnerait probablement bien là-bas.

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

C'est ce que le <fieldset> est utile pour; regrouper les champs et donner à ce groupe un titre qui se rapporte à tous les champs contenant.

18
JonW

L'utilisateur s'intéresse donc à l'historique des prix d'un produit? Et cette partie de votre site Web leur permet de voir à quel point le prix de ce produit a changé entre la première date et la deuxième date?

Quels critères utilisent-ils pour choisir les deux dates? Voyez si vous pouvez trouver un moyen de le lier à leur flux de travail.

Comme alternative, et cela ne répond pas directement à votre question: pourriez-vous afficher un graphique de l'historique des prix, puis laisser l'utilisateur choisir deux points sur le graphique et il affichera la différence de prix?

Par exemple:

Mockup of graph with comparison annotations

27
TScott

En supposant que le reste du formulaire indique clairement comment cela est censé fonctionner, vous n'avez pas besoin d'étiquettes distinctes:

enter image description here

11
Matt O'Keefe

Appelons le conteneur où vos zones de saisie et leurs étiquettes résident une "section". Je baserais mes modifications sur l'interface utilisateur sur l'idée que les utilisateurs ont une meilleure expérience lorsqu'ils peuvent lire l'intégralité de la section dans un flux. Pensez à placer des étiquettes appropriées pour faciliter cela.

Comparez les prix entre _____ et _____.

ou

Voyez comment les prix sont passés de _____ à ____.

On pourrait afficher le texte de l'espace réservé dans chaque zone de saisie, quelque chose comme "date de début" et "date de fin". Mais cela risque d'entraver un peu le flux et de faire en sorte que votre section d'entrée prenne plus de place.

5
Raiyan

Que diriez-vous:

comparer le prix à _____ et ______.

2
Jack

Vous pouvez utiliser:

Initial Date    ../../....
Comparison Date ../../....

Aussi

Start Date      ../../....
Comparison Date ../../....

ou

Base Date       ../../....
Comparison Date ../../....
1
Michael Durrant

Que diriez-vous de cela .. avec la date 1 et la date 2 .. L'idée est que vous comparez deux dates différentes .. vous mentionnez clairement que comme étiquette/titre pour la section par "Comparer les prix" .. et une fois que cette idée est définie, alors les dates ne sont que des dates .. elles pourraient être la date 1, la date 2, etc. vous n'avez vraiment pas besoin de les appeler autrement.

enter image description here

OR

ne mettez pas d'étiquettes du tout. L'icône du calendrier suffit pour indiquer le champ de date. et le titre est déjà là qui indique à l'utilisateur à quoi cela sert.

enter image description here

0
PK2016

ou...

Enter the two dates to compare prices on:

../../....   ../../....

[compare]

Result:

../../....   ../../....
$35          $37
0
Michael Durrant