web-dev-qa-db-fra.com

Où est la meilleure position pour le bouton CRUD?

J'ai toujours été confus positionner les boutons CRUD * sur ma candidature. Je vois certaines applications, il y a des boutons CRUD sur le côté droit, en haut ou en bas. À votre avis, où est l'endroit approprié pour les boutons CRUD.

enter image description here

** CRUD signifie "Créer, lire, mettre à jour et supprimer" *

11

Contrairement à ce que disent la plupart des réponses, je mettrais les boutons en bas ou à droite.

Les données sont les plus importantes et doivent avoir la priorité sur les boutons. Le flux naturel pour quelqu'un serait de sélectionner les données sur lesquelles il souhaite agir, puis de sélectionner les actions qu'il souhaite effectuer. Prise en compte du sens de lecture qui place les boutons à droite ou en bas. Et oui, cela signifierait que pour les langues de droite à gauche, la position des boutons w/devrait se déplacer du côté opposé.

A droite si les colonnes sont limitées et les rangées abondantes, en bas si les colonnes sont abondantes et le nombre de rangées en vue est moins important. Cependant, ne faites pas cela sur une base par formulaire. Regardez ce dont la plupart des formulaires de votre application auront besoin et respectez-le, car il est beaucoup plus important d'avoir une place cohérente pour les boutons qu'une optimisation par formulaire de l'espace d'écran.

15
Marjan Venema

+1 pour suivre une convention établie, s'il en existe une.

Cependant, sinon, demandez-vous pourquoi vous avez besoin des boutons. Cela ne peut-il pas être fait directement sur la grille, comme le faisait auparavant MS Access? C'est à dire.:

Création: laissez une ligne vide au début ou à la fin de la grille - ou peut-être une ligne de zones de texte en dehors de la grille. Les types d'utilisateurs là-dedans, la ligne est automatiquement créée/enregistrée.

Remplacer/Mettre à jour: cliquez sur la cellule dans la grille, le texte est sélectionné automatiquement, la frappe le remplace (n'oubliez pas de proposer un UNDO).

Supprimer: Soit un bouton distinct (si plusieurs lignes peuvent être supprimées), soit faites-le apparaître sur le côté de la ligne lorsque le focus est sur cette ligne. Encore une fois, offrez un UNDO.

5
Erion

Cela varie en fonction de l'application. Cependant, dans une application de type grille comme vous le montrez ici, je pense que la fin de la page est le meilleur endroit, et peut-être la gauche plutôt que la droite.

La raison pour laquelle cela a du sens pour moi est que les données sont l'élément le plus important de cela, et il est important de voir toutes les données, avant de savoir si elles doivent être ajoutées ou supprimées, et il est nécessaire de ne pas en sélectionner une dans la liste avant mise à jour.

Si les données sont affichées une page à la fois, il est logique d'avoir la mise à jour et la supprimer en haut, OMI, car vous devez d'abord sélectionner un enregistrement. La création fonctionnerait également bien là-bas.

Je ne les aime pas sur les côtés. Les boutons sur les côtés, je pense toujours, devraient agir sur l'ensemble du contrôle affiché, pas seulement sur les enregistrements individuels.

C'est juste mon penn'oth.

4
Schroedingers Cat

Le haut et le côté gauche sont les meilleurs pour CRUD imho. Lequel des deux dépend le mieux de votre application spécifique.

Si vous avez beaucoup de colonnes (ce que vous semblez faire de cette capture d'écran), il est préférable d'utiliser pleinement l'espace d'écran horizontal en plaçant le CRUD en haut.

4
Kashyap

Cela dépend de ce que l'utilisateur fera: passer en revue le contenu existant, puis décider quoi faire, ou entrer dans le formulaire avec un objectif prédéterminé à remplir.

Celui qui arrive en premier devrait généralement se situer au-dessus ou à gauche de l'autre, pour imiter les schémas de lecture de gauche à droite et de haut en bas avec un `` workflow '' de gauche à droite et de haut en bas.

Oh, et cela devrait aller de soi, mais s'il y a déjà une convention établie dans votre demande, allez-y. La cohérence sur l'ensemble de l'application est bien plus importante que la convivialité locale.

4
Jimmy Breck-McKye

Alternativement, vous pouvez implémenter des actions de survol (Hover-Reveal Tools), cf. Conception d'interfaces Web :

http://www.flickr.com/photos/designingwebinterfaces/3120613871/

Cette volonté:

  1. Pro: Rendez votre interface moins encombrée
  2. Pro: Supporte l'interaction nom-verbe (avec une sélection basée sur le survol, pas sur un clic explicite)
  3. Inconvénients: offrez moins de moyens à première vue
  4. Inconvénient: ressemble plus à un site Web qu'à une application.
  5. Con ( update ): Ne fonctionne pas avec les techniques d'interaction sans événements de survol, par exemple, les interfaces tactiles
2
jensgram

Après avoir lu toutes les autres réponses, cela ressemble à "faire votre choix" (tant que votre choix est cohérent avec le reste de l'application). Cela dit, je suis avec Marjan pour avoir placé les boutons à droite ou en bas.

À droite: assurez-vous qu'il y a suffisamment d'espace blanc vertical pour éviter les coups accidentels.

En bas: uniquement lorsque la grille est à hauteur fixe et qu'elle s'adapte à la fenêtre comme le montre votre exemple. Si c'est sous le pli, je préfère ne pas l'avoir.

1
GUI Junkie

Cela dépend de ce que sont les données.

Si quelqu'un a besoin de voir les données (dans la plupart des cas d'utilisation) avant de savoir quelle action il souhaite effectuer, je les mettrais sous les données

S'ils allaient à la page en sachant ce qu'ils voulaient faire et choisissaient l'action avant les données.

Comme Schrodingers Cat l'a déjà mentionné, de chaque côté me semble juste mal (préférence personnelle).

Une mise en garde à tout cela défile. Il peut y avoir des raisons de les placer au-dessus des données si vous allez faire défiler le contenu et ne pas voir le bas de l'écran. Bien sûr, une barre des tâches est une option ici, mais seulement si vous en avez vraiment besoin.

1
JohnGB