Accessibilité des menus dans les sites web d'aujourd'hui

Bonjour à tous!

J'aimerais lancer une petite discussion. Pourquoi est-ce que les sites web, encore en 2010, ne fonctionnent pas « comme des applications » ?

Je m'explique. Lorsque j'utilise un programme, chaque section du programme reste visible dans l'écran, peu importe où je me situe dans chacune de ces sections. Elles ont toutes une scroll bar, ce qui fait que, par exemple, si j'ai une section à gauche contenant une arborescence de fichiers, et une à droite contenant mon code HTML, si j'ai à scroller dans le bas du code, je reste tout de même au même endroit dans mon arborescence.

Les sites web suivent rarement cette méthode, ce qui rend la navigation « plus difficile » que ce qu'elle pourrait être.

Un exemple. Je vais sur la page d'accueil du site s'Alsacréations. Je commence à lire le résumé des news, et j'arrive au bas de la page. C'est bien, mais qu'est-ce que je fais maintenant si je veux avoir accès au menu? Il n'est plus du tout accessible, visuellement. Je dois cliquer sur « Haut de page » pour le voir, mais devrait-il réellement y avoir ce lien? Et qu'est-ce que je fais si je veux avoir accès au menu, mais que j'ai arrêté de lire au milieu de la page? Je dois scroller pour revenir en haut. Pourquoi le contenu de la page n'est pas un div d'une certaine hauteur avec un scroll, laissant le menu, et du même coup la recherche, toujours visibles à l'utilisateur?

Un autre exemple, le site web d'Amazon. Même chose pour le menu du haut, sauf que cette fois ci on est sur un site d'achats. J'ajoute un objet à mon panier, puis ça me mène dans une page super longue. Je décide de regarder ce que cette page contient, et lorsque j'arrive en bas... il est où mon panier? Ah oui, il est dans la colonne de droite de mon site web, tout en haut du site. Colonne pratiquement inutile d'ailleurs, parce qu'en dessous du panier, il n'y a plus rien, ce qui fait que j'ai une grande colonne blanche, aucun contenu, perte d'espace.

Détrompez-vous, je n'ai aucun problème à scroller pour revenir en haut. Ni de peser sur « Home » sur mon clavier pour revenir en haut encore plus rapidement. Mais ce n'est pas parce que quelque chose a toujours fonctionné d'une certaine façon que l'on ne doit pas le remettre en question.

Alors allez-y, sortez vos arguments!

Perso ça ne me gêne pas, j'utilise la touche home pour me retrouver en haut de page en un éclair.

Un truc qui me «suivrait» lors de la navigation me gênerait plus je pense.

D'ailleurs je crois que les positionnements fixes sont déconseillés pour l'accessibilité mais là il faut confirmer.

Salut,

L'information proposée sur un site est la raison même de l'existence d'internet. A ce titre, la navigation est un outil "secondaire", n'existant qu'en raison de la conception même du média (hypertexte). En partant de ce fait, la navigation ne doit pas prendre le pas sur l'information.

Compte tenu des dimensions de plus en plus panoramiques des écrans (wide), imposer la présence du menu visible tout le temps serait une véritable hérésie.
Cela limiterait l'espace réel du contenu de manière systématique, pour donner accès en permanence à certains éléments secondaires.
Ceux-ci sont simplement accessibles par une simple touche "home", ainsi qu'aux touches de navigation ("page up", "page down", "fin", etc. Sans compter l'éventuel confort apporté par les concepteurs de site avec des liens de retour en haut de page.

Même si de nombreux sites à l'heure actuelle sont pauvres en contenu et très (trop) synthétiques et généralistes, avec un ratio navigation/contenu faible, l'information devrait toujours primer. Sur un site spécialisé, le contenu est plus riche, et la navigation doit alors sublimer le contenu, et non l'inverse.

Eh bien voilà une réponse argumentée et riche d'un sens que je croyais disparu (Comment ça ? Le contenu serait important ?), à encadrer dans un joli tableau et à afficher dans tous les salons ! Je n'aurais pas dit mieux, je n'aurais d'ailleurs même pas pensé mieux !

Ceci dit je comprends aussi la préoccupation de DarkMalow, qui semble avoir une tournure d'esprit plus "matricielle" que "sémantique"... la réponse magistrale de Mikachu n'est sans doute pas non plus universelle et laissera peut-être la place à des webmasters dont la créativité en termes d'ergonomie ferait un bout du chemin qui semble long entre ces deux approches... ?

En tout cas, je n'ai rien de tangible à ajouter mais je voulais saluer une question qui me semble archiment pertinente et un début de réponse qui, habilement creusé, pourrait ouvrir la voie à une nouvelle forme de "publication".

Ceci dit, si DarkMalow souhaite un site web qui ressemble à une "application", rien ne l'empêche de webdesigner ses pages à grands coups de "overflow: scroll"
Modifié par quantumOfPixels (22 Mar 2010 - 18:20)

quantumOfPixels a écrit :
Ceci dit, si DarkMalow souhaite un site web qui ressemble à une "application", rien ne l'empêche de webdesigner ses pages à grands coups de "overflow: scroll"

Enfin, si l'on ne se hasarde pas à recourir à la technique, difficilement accessible, des cadres et autres cadres en ligne (frame et iframe).

Mikachu a écrit :
Salut,

L'information proposée sur un site est la raison même de l'existence d'internet. A ce titre, la navigation est un outil "secondaire", n'existant qu'en raison de la conception même du média (hypertexte). En partant de ce fait, la navigation ne doit pas prendre le pas sur l'information.

C'est vrai que la navigation ne doit pas prendre le dessus sur l'information, mais n'oubliions pas qu'une bonne navigation permet de retrouver mieux l'information. Personnellement, je dirais plutôt que la navigation ÉTAIT un outil "secondaire", alors qu'aujoud'hui, elle doit recevoir beaucoup plus d'attention.

Mikachu a écrit :
Compte tenu des dimensions de plus en plus panoramiques des écrans (wide), imposer la présence du menu visible tout le temps serait une véritable hérésie.
Cela limiterait l'espace réel du contenu de manière systématique, pour donner accès en permanence à certains éléments secondaires.

L'espace serait-il réellement limité? Les colonnes qui contiennent trop souvent peu d'information créent un réel manque d'espace dès que le contenu central dépasse le reste et pourtant, tous les sites en ont, ou presque. Quelle serait la réelle perte d'espace si, prenons le site d'Alsacréations comme exemple, l'information serait présentée dans un div ayant une hauteur redimensionnée sur le window.onload correspondante à l'espace disponible de l'internaute? Lorsque j'arriverais sur le site, j'y verrais exactement la même chose qu'actuellement, mais je ne ferais défiler seulement l'information, gardant ainsi un accès permanent au volet navigation.

Mikachu a écrit :
Ceux-ci sont simplement accessibles par une simple touche "home", ainsi qu'aux touches de navigation ("page up", "page down", "fin", etc. Sans compter l'éventuel confort apporté par les concepteurs de site avec des liens de retour en haut de page.

Mes grands-parents savent utiliser un ordinateur pour des choses de base, dont aller naviguer sur internet. Ils ne connaissent toutefois pas les boutons home, page up et page down. Ces boutons sont malheureusement "trop avancés" pour une bonne partie de la population.

quantumOfPixels a écrit :

Ceci dit, si DarkMalow souhaite un site web qui ressemble à une "application", rien ne l'empêche de webdesigner ses pages à grands coups de "overflow: scroll"

En effet! Par contre ce n'est pas nécessairement ce que je souhaite. Ce que je souhaite réellement c'est simplement avoir une discussion, savoir les pour et les contre! Tu sais, ce serait bien de toujours voir l'en-tête d'Alsacréations, elle est très belle!

J'ajoute à mon précédent message une autre chose, c'est qu'il ne faut pas faire des choix pour améliorer l'accessibilité au détriment de... l'accessibilité justement.
Un exemple, un contenu en overflow qui génère une propre barre de défilement diminuera la possibilité d'utilisation de la molette de la souris pour faire défiler le contenu. Il faudra pour que cela marche que le focus se situe dans ce bloc en overflow.

DarkMalow a écrit :
Mes grands-parents savent utiliser un ordinateur pour des choses de base, dont aller naviguer sur internet. Ils ne connaissent toutefois pas les boutons home, page up et page down. Ces boutons sont malheureusement "trop avancés" pour une bonne partie de la population.

Concernant l'utilisation des boutons de navigation du clavier, si les gens n'ont pas la connaissance de leur utilité, ils se privent d'une fonction de commodité, et même si la navigation en sera un peu pénibilisée, ils auront accès au site de façon identique. Ils perdront juste un peu plus de temps.

DarkMalow a écrit :
Tu sais, ce serait bien de toujours voir l'en-tête d'Alsacréations, elle est très belle!

Moi qui passe pas mal de temps à naviguer sur ce site, et même si j'aime beaucoup le travail graphique qui a été réalisé, je suis content de ne pas trop le voir au profit du contenu !

Mikachu déjà dehors.

Mikachu a écrit :
Un exemple, un contenu en overflow qui génère une propre barre de défilement diminuera la possibilité d'utilisation de la molette de la souris pour faire défiler le contenu. Il faudra pour que cela marche que le focus se situe dans ce bloc en overflow.

Hum, j'aimerais simplement dire que c'était le cas sous IE6, et peut-être sous IE7 mais je ne me souviens plus très bien, mais IE8, Firefox et Chrome n'ont pas besoin du focus pour le défilement. À moins que tu ne parles de simplement avoir le curseur de la souris sur le div, alors là oui, en effet, tu as un point!

Bon.

La question est intéressante. Si je résume les deux positions principales exprimées, en interprétant avec d'autres mots pour le plaisir, ça donne:
DarkMalow: l'importance de la navigation est sous-estimée. Le fait qu'elle n'est pas conservée en permanence à l'écran montre qu'on ne la considère pas comme capitale, et il faudrait peut-être corriger le tir.
Mikachu: c'est avant tout le contenu qui doit avoir la primauté. Une navigation inamovible consomme du «capital-écran» (screen real-estate, disent les webdesigners anglo-saxons), au détriment du contenu.

Pas mal, pas mal. Mais peut mieux faire.

Il manque une notion fondamentale: le temps et l'intention (les deux étant très fortement liés).

Lorsque j'arrive sur une page, j'essaie en général de répondre (plus ou moins consciemment) aux questions suivantes:
- où suis-je (navigation/repères+contenu)?
- est-ce ce que je cherche (contenu)?
- où puis-je aller (navigation)?

Un découpage visuel avec un tiers de navigation/outils divers (recherche...) et deux tiers de contenu ou plus, ça répond bien à mes besoins dans l'instant. J'arrive sur la page, j'ai sous les yeux les éléments pour répondre. Et là, soit je reste (lecture/exploration), soit je vais ailleurs.

Si je reste, c'est un deuxième temps et une autre intention. Je scanne peut-être le contenu à la recherche d'une information précise. Je lis peut-être le contenu plus ou moins en détail. Si le contenu est long et que le début de mon exploration ou de ma lecture m'encourage, je vais faire défiler la page. Autrement, je reste en haut, je passe à nouveau en revue la navigation, et je vais ailleurs (ou bien je ferme l'onglet et basta).

Si je continue ma lecture ou mon exploration du contenu, et que ça m'amène à faire défiler la page et masquer ainsi la navigation, ça ne me gêne probablement pas. Au contraire, ça diminue les informations à l'écran et ça me permet de me concentrer sur le contenu (là encore, que ça soit une lecture attentive, distraite, ou un passage en revue fébrile). Ça permet aussi de voir plus de contenu à la fois, ce qui est appréciable 1) sur un écran de petite taille, 2) sur un écran plus large que haut, surtout si la hauteur reste faible (portable 13" en 16/9, tablette 10" en mode paysage...), 3) sur un écran même assez grand, car ça donne une vue d'ensemble du contenu et permet de s'y retrouver, etc.

Je veux revoir le menu? Ok, ça demande une opération et un effort, mais c'est un sacrifice acceptable vu les bénéfices ci-dessus.

Je glisserai pour finir que la problématique de la barre de navigation et celle de la barre d'outils sont différentes, et qu'il serait préférable de ne pas les confondre.

bonjour/bonsoir

et a quoi que c'est-y qu'a sert la petite fleche grise ?