web-dev-qa-db-fra.com

Inviter les utilisateurs à modifier en ligne non seulement en survol?

Il est très courant d'indiquer à l'utilisateur qu'il peut "modifier sur place" en changeant le style du contenu modifiable lorsqu'il est survolé (par exemple, en ajoutant un fond jaune, une info-bulle "cliquez pour modifier", une icône de crayon apparaissant, etc.). Cela signifie que l'utilisateur ne découvre pas la fonctionnalité jusqu'à ce qu'il survole un élément modifiable.

Dans mon application Web, j'ai une page qui contient plus de 25 champs modifiables. Je veux que l'utilisateur sache juste en regardant la page qu'il peut apporter des modifications. De plus, indiquer la capacité via le survol ne serait qu'un bonus supplémentaire.

J'ai pensé à souligner en pointillés chaque contenu modifiable, car cela implique généralement un "indice" ou un "survol sur moi" (comme l'image ci-dessous):

enter image description here

Le problème avec cela est que cela n'implique pas "je suis modifiable", il encourage simplement l'utilisateur à survoler (sans qu'il sache pourquoi), puis le survol aura l'indicateur. Peut-être que c'est OK? Au moins, ils le découvriront plus rapidement. Mais y a-t-il une meilleure façon?

REMARQUES:
La raison pour laquelle la page n'est pas un formulaire de modification permanent est que les utilisateurs souhaitent afficher uniquement les informations aussi souvent qu'ils le souhaitent. Mais lorsqu'ils veulent modifier, ils veulent généralement simplement modifier rapidement un seul champ. De plus, je ne m'inquiète pas pour le mobile, car mes utilisateurs sont uniquement sur des ordinateurs de bureau.

6
LoveGal8

J'utiliserais personnellement une icône d'édition comme celle-ci

modifier http://catalogus-professorum.org/extensions/themes/silverblue/images/icon-edit-grey.png Ceci est votre texte

En utilisant une icône, les utilisateurs sauront qu'une action est associée à ces contenus, sans avoir à interagir avec le curseur de la souris.

Cette solution fonctionne également sur les appareils tactiles où l'absence de curseur rendrait impossible la découverte de cette fonctionnalité.

Je recommanderais également de placer l'icône avant le texte et non après: de cette façon, il est immédiatement découvrable d'être constamment placé au même endroit.

Si vous pouviez utiliser une petite icône avec une couleur qui n'attire pas trop l'œil - c'est-à-dire un gris clair - elle sera presque inaperçue lors d'un balayage rapide de la page, mais serait suffisamment visible lors de la recherche.

3
Luca De Angelis

S'agit-il d'un formulaire qu'ils utilisent souvent ou plus comme une situation de transaction unique?

Parce que s'ils le voient une fois et ne le reverront jamais ou très rarement, il suffit de s'en tenir à des champs qui sont reconnaissables et ne présentent aucune menace d'utilisation, bien qu'au détriment de ne pas être si agréable.

Si toutefois, ils l'utilisent souvent, et la jolie interface utilisateur est une préoccupation valable, pourquoi ne pas avoir d'aide contextuelle, éventuellement avec un gif animé pour illustrer la capacité? (Pensez à un pavé tactile mac ou à une souris magique avec les vidéos illustratives sur le côté).

Ma (dure) recommandation est d'errer du côté de l'utilisabilité plutôt que de l'esthétique et de l'innovation, en particulier sur les tâches essentielles à la mission.

1
Luis

Pourriez-vous utiliser des zones de texte en ligne? Ils sont facilement reconnaissables comme modifiables. Vous pouvez également incorporer des masques ou des entrées tapées comme des sélecteurs de date selon les besoins.

0
Bobwise