28220 sujets

CSS et mise en forme, CSS3

Pages :
Si vous avez une idée pour un titre plus explicite, n'hésitez pas à la suggérer.

J'ouvre ce nouveau sujet suite à l'intervention de Laurent Denis dans cet échange : http://forum.alsacreations.com/topic.php?fid=4&tid=1091

Il est possible que j'ai une mauvaise interprétation de ses propos ou de la recommandation suivante :

Ma source est le "Référenciel accessibilité des services Internet de l'administration française", ce document est disponible à cette adresse : http://www.adae.gouv.fr/article.php3?id_article=246

Page 28 numéro 10.3 niveau bronze :
a écrit :
L'ordre d'apparition de l'information doit être identique lorsqu'une mise en forme spécifique est désactivée.
Certaines techniques permettent de construire la page html avec des feuilles de styles. Lorsque les feuilles de styles sont désactivées par l'utilisateur, il faut que la structure logique de la page soit respectée.
Il faut veiller que l'ordre d'apparition des divisions (DIV), par exemple, soit équivalent entre l'affichage sur un navigateur graphique et l'affichage sur un navigateur en mode textuel.


La référence W3C/WAI est la 6.1, 9.4

Voici ce que je comprend à ce texte :
Tu n'utiliseras pas, par exemple, le float, la position absolute ou tout autre technique css pour détourner l'ordre d'affichage du flux de la page.

Quel est votre avis là dessus, svp ? Smiley rolleyes m'enfin, si je suis assez clair Smiley cligne ... Merci d'avance à ceux qui participeront.
Pour référence :
Directives pour l'accessibilité aux contenus Web (version 1.0) a écrit :

6.1 Organiser les documents de manière à ce qu'ils puissent être lus sans feuilles de style. Par exemple, lorsque un document HTML est restitué sans la feuille de style lui étant associée, il doit rester lisible.[Priorité 1]
Lorsque le contenu est organisé de manière logique, il sera restitué de manière compréhensible lorsque les feuilles de style sont désactivées ou non supportées.

Directives pour l'accessibilité aux contenus Web (version 1.0) a écrit :

9.4 Développer un ordre logique de tabulation, pour les liens, éléments de formulaires et objets. [Priorité 3]
Par exemple, en HTML, spécifier un ordre de tabulation grace à l'attribut "tabindex" ou garder une conception de page logique.
Ben ! en fait, pour être plus précis, j'ai cru comprendre que Laurent Denis indique une méthode, qui, selon ma propre compréhension du texte cité ci-dessus, serait à l'opposé des règles d'accessibilité.

... et je cherche mon erreur ou mon incompréhension Smiley rolleyes
a écrit :

L'ordre d'apparition de l'information doit être identique lorsqu'une mise en forme spécifique est désactivée.

Je ne vois rien dans les Directives pour l'accessibilité aux contenus Web qui correspond à ceci.

Ce que je retiens est :
- il doit rester lisible
- il sera restitué de manière compréhensible
Etre identique, c'est impossible, à moins de mettre tous ses éléments les uns au dessous des autres, ce qui ne serait pas forcement toujours esthétique.

Prenons un site avec un header, un corps de page sur deux colonnes (menu et contenu) et un pied de page.
Je pense que la logique (et les directives) veulent qu'une fois le CSS desactivé, on ne se retrouve pas le pied de page sous le header, le logo en plein milieu, la colonne précédement gauche avec le menu éclaté dans la page en des dizaines d'éléments placés n'importe où dans le code, et donc dans le flux du code HTML.
Les adeptes du "absolu only" pourront réaliser ces prouesses techniques.

Je pense que dès que l'on structure correctement son document, on est à l'abris de ce genre de problème.
dominique a écrit :
Ben ! en fait, pour être plus précis, j'ai cru comprendre que Laurent Denis indique une méthode, qui, selon ma propre compréhension du texte cité ci-dessus, serait à l'opposé des règles d'accessibilité.

... et je cherche mon erreur ou mon incompréhension Smiley rolleyes


Il n'y a pas d'erreur, Dominique : je m'inscris en effet en faux face à l'interprétation abusive des WCAG1.0 faite par AccessiWeb Smiley cligne

Celle-ci est directement issue de la problématique "les lecteurs d'écran actuels sont indifférents aux CSS et lisent le contenu dans l'ordre HTML brut." Donc, pour AccessiWeb, ce qui est vu de gauche à droite et de haut en bas doit être lu dans le même ordre.

Ce n'est vrai que dans la mesure où un ordre de lecture différent s'avère effectivement un obstacle à la compréhension du document. Or ce n'est pas nécessairement le cas.

Pour compléter les citations de la WAI rappelées par Stephan, celle-ci, extraite du document de travail WAI2.0:

http://www.w3.org/TR/WCAG20/#navigation-mechanisms a écrit :

it could be argued that reading order is irrelevant unless it affects the user's ability to understand the content. Reading order in itself is not necessarily an accessibility issue. It becomes an accessibility issue if a user with a disability (such as a visual or cognitive impairment) could not reliably derive a meaningful reading order from the default presentation.


Ce qui correspond très bien au cas de figure décrit par piloue : les abus de CSS du type position absolue (ou pourquoi pas float) peuvent en effet rendre un contenu incompréhensible hors CSS. Ce n'est pas le cas avec la mise en page que je proposais.

Cela dit, le problème de l'ordre de tabulation est plus délicat. Mais là, il faut passer à des exemples plus précis de contenu.
Ok super Smiley biggrin Smiley biggrin ... Heuuuuu ! en fait, c'est la réponse que j'espèrais...

En effet, sur un site, je charge la colonne gauche qui contient des graphismes après la colonne droite qui contient les textes et données, dans le but de permettre un accès plus rapide à ces données.

En lisant le texte que j'ai cité, j'ai cru que j'allais devoir refaire tous mes squelettes...

Merci à tous pour vos interventions Smiley cligne
Smiley up

Escusez moi de ressortir les squelettes du placard mais les miens n'ont pas fini de sécher !

Donc, si je comprends bien, l'ordre brut de la page doit être optimal pour la lecture du document sans CSS, et ce quel que soit la position des éléments dans une feuille de style qui lui serait associée.

D'autant plus logique que nous avons le loisir d'en associer plusieurs ...

Que cela flotte à gauche ou à droite avec style n'a aucune importance dans une lecture linéaire puisqu'on n'a que deux yeux (et encore !) pour converger vers une seule fenêtre ...

Bon, mais alors :

En linéaire, quel est l'ordre le plus lisible, d'après vous ?

Menu d'abord, contenu ensuite ou l'inverse ?

Vue que, de toute manière, on a prévu des liens d'évitements ...

J'aurais tendance à dire : pas d'importance pourvu que ce soit clair !
Smiley rolleyes

On remet les squelettes au placard ?
Euh, en fait je viens du salon du dessus et j'ai l'impression d'arriver comme un cheveu sur la soupe !

Quelqu'un aurait-il un lien vers la mise en page proposée par Laurent-Denis et dont on parle dans ce post ?
Vero a écrit :
Euh, en fait je viens du salon du dessus et j'ai l'impression d'arriver comme un cheveu sur la soupe !

Smiley biggol
a écrit :
Quelqu'un aurait-il un lien vers la mise en page proposée par Laurent-Denis et dont on parle dans ce post ?

Comme je ne sais pas de quel post il est question, par recoupement je soupçonne que c'est celui la:
http://test.blog-and-blues.org/3_colonnes_float/
Igor a écrit :

Comme je ne sais pas de quel post il est question, par recoupement je soupçonne que c'est celui la:
http://test.blog-and-blues.org/3_colonnes_float/


Alors, j'avais déjà vu cette page (je ne sais plus pourquoi) et j'avais noté une contradiction entre la source et ce qui est écrit dans le bloc de gauche ...

J'ai peut-être mal compris ...

En admettant une erreur de frappe, et s'il s'agit du bon lien, l'ordre préconisé serait le suivant :

Gauche, centre, droite soit l'ordre d'apparition avec css de gauche à droite ...

Je suis un peu perdue là, à vrai dire !

Edit :

Oups, le lien était tout en haut du présent post et menait bien sur cet exemple ... Sorry, j'ai eu beaucoup de liens d'un coup (je ne m'en plains pas !)

http://forum.alsacreations.com/topic.php?fid=4&tid=1091

Par contre, j'ai dit une bêtise : dans le code c'est bien centre, gauche droite

Mais je suis toujours aussi perdue ... je vais prendre du recul !
Modifié par Vero (10 Jun 2005 - 16:19)
J'ai trouvé des éléments de réponses à ces questions d'ordre d'apparition .

Il semble alors évident que le contenu doit apparaître avant la navigation, car les lecteurs vocaux lisent la page depuis le début !

http://www.la-grange.net/accessibilite/day_10.html

Cet article s'adresse à la mise à jour d'un site réalisé avec des tables mais fournit des éclairages.

Il y a sûrement d'autres articles concrets ...

Super, non ?
Smiley biggrin
Bonjour,

En matière d'accessibilité il faut se méfier des "modèles".

Au lieu de s'accrocher à un "modèle" qui aura le défaut d'être contraignant, tu dois t'appuyer sur des principes simples :

Le flux doit être logique, présenté toujours de la même manière de pages en page, et le cas échéant, tu dois implémenter des moyens de navigation dans la page (liens d'évitement).

A ces conditions tu es absolument libre de faire comme tu le veux.

Sur des structures simples, l'ordre "contenu navigation" peut-être pertinent, mais sur des structures plus complexes, particulièrement si il existe, dans ton contenu des listes de liens, le résultat pourrait être moins ergonomique.

a écrit :

J'aurais tendance à dire : pas d'importance pourvu que ce soit clair.


Tu à raison, c'est à ta propre analyse de répondre et je rajouterais juste : clair, logique et facilement utilisable.

JP
Modifié par jpv (10 Jun 2005 - 22:16)
Bonjour et merci pour ton éclairage

jpv a écrit :

Sur des structures simples, l'ordre "contenu navigation" peut-être pertinent, mais sur des structures plus complexes, particulièrement si il existe, dans ton contenu des listes de liens, le résultat pourrait être moins ergonomique.


Je crois que ceci résume la problématique, en effet.

Le point à prendre en compte et qui n'apparait pas évident sur le plan visuel devient essentiel avec des lecteurs vocaux dans le cas de la navigation qui se retrouve sur toutes les pages du site et qui peut être atteinte avec les liens d'évitements (d'où leur intérêt, je suppose).

Mais une page au contenu important découpée selon un sommaire devra débuté par ce dernier.

Je crois que j'ai pigé.
Smiley smile
Bonjour,

Le cas que j'essayais d'illustrer est surtout celui ou des liste de liens intermédiaires pourraient créér une confusion avec le menu de navigation principal.

Le haut de page est un endroit stratégique car il est toujours accessible facilement avec la touche "haut de page". Smiley smile

A la différence d'un bas de page, qui outre l'éventuel menu de navigation, peut contenir d'autres types d'informations, pied de page, déclarations obligatoires, et qui ne dispose d'aucun moyen d'accès rapide.

C'est la raison pour laquelle je me méfie des "modèles", l'organisation du flux est à chaque fois le résultat d'une analyse particulière et ne dépends pas de "principes" intangibles ou de "modèles" tout fait.

JP
Modifié par jpv (11 Jun 2005 - 11:59)
jpv a écrit :

Le haut de page est un endroit stratégique car il est toujours accessible facilement avec la touche "haut de page" Smiley smile


Qu'appelles tu touche haut de page ? Celle du clavier ?

Si c'est le cas tu te trompes, elle ne rend en rien le haut de page accessible car elle ne donne pas le focus.

Le mieux pour arriver à ce résultat est bien un lien haut de page. Et tant qu'à faire doté d'un accesskey.
Désolé je m'étais mal exprimé,

Je parlais des fonctionnalités propres aux lecteurs d'écrans.

Pour le reste parfaitement d'accord avec toi.

JP
Pages :