Innovablog, Le Web où l’Innovation ordinaire : design, ergonomie, interfaces riches, web 2.0, eCommerce,…

Les applications web ont le vent en poupe (même si les failles de sécurité sur les serveurs d’applications ne cessent d’augmenter). Voilà pourquoi il me semble intéressant de vous proposer quelques bonnes pratiques de conception. Celle-ci est issue d’un Livre blanc édité par Smile qui me semble assez caractéristiques et riche d’enseignements : la décomposition par pages.

La page

L’ergonomie web a pour fondement la notion de page. La décomposition du dialogue en pages ne doit pas être vue
comme un contrainte technique regrettable que l’on ssayerait de masquer ou de contourner. La notion de page fait partie du paradigme d’interface.

Par paradigme d’interface, on entend la représentation que l’utilisateur se fait parfois inconsciemment – de l’interface. L’utilisateur perçoit qu’en cliquant sur des liens il adresse des requêtes à l’application, et que celle-ci répond à des requêtes en lui adressant les pages correspondantes.
Tout ce qui casse ce paradigme va déstabiliser l’utilisateur.

On pourrait tenter par exemple de gérer des onglets au sein d’une page, qui feront apparaître instantanément plusieurs pavés différents au même endroit de la page. En première analyse, il semble que ce contournement habile de la contrainte requête-page facilitera la vie de l’utilisateur, lui permettant comme il le ferait dans Windows, de passer d’un onglet à l’autre sans le moindre délai.

En réalité cette technique risque de casser la logique de l’interface, la compréhension que s’en fait l’utilisateur. “J’ai saisi une valeur dans un onglet, j’ai changé d’onglet, ma saisie est-elle enregistrée ?” Je n’en sais rien parce que je ne sais plus quand (et si) ma requête a été envoyée.

Redisons-le : la logique requête-page est perçue par l’utilisateur, et contribue à sa compréhension des échanges, il n’est pas bon que la conception d’interface cherche à nier cette logique.

Un réseau de pages

Comme un site web, une application web est constituée d’un ensemble de pages liées entre elles. A un instant donné, l’utilisateur est “positionné” sur l’une des pages, comme il pourrait être situé dans une station de métro parisien.

C’est une chose sur laquelle il faut insister : cette perception de l’application en tant qu’un ensemble de pages organisées en réseau est très différente de la perception d’une application Windows.
Et cette représentation mentale du réseau de pages est un facteur essentiel dans l’utilisabilité de l’application : l’utilisateur se positionne dans ce réseau. Il sait qu’il peut revenir en arrière et revoir la page sur laquelle il était tout à l’heure, il perçoit que des liens le conduiront à d’autres pages, mais que de ces autres pages il pourra revenir là où il est, s’il s’était trompé.

Cheminer dans ce réseau de pages comme on chemine dans le métro est tout à fait rassurant.

A contrario, imaginez une application Windows qui vous présente une boite de dialogue. Vous remplissez du mieux que vous pouvez les différents champs proposés, cochez des cases, sélectionnez des boutons. Puis enfin vous validez et la boîte de dialogue se ferme. Erreur : la conséquence de votre saisie n’est pas celle que vous souhaitiez. Comment revenir à la boîte de dialogue ? Ce n’est pas si facile… Peut-être aurez vous oublié quelle action avait ouvert cette boîte. Comment l’obtenir à nouveau ?

Ressources :

• Je vous conseille donc vivement la lecture du Livre blanc de Smile consacré à la Conception d’applications Web : efficacité et utilisabilité