Bonjour Christian, Tes cards restes des éléments d'une liste. On en voit effectivement de plus en plus souvent mais ce n'est pas un nouveau composant html 5. C'est juste un nouveau design pour représenter les blocs de contenus.
Sémantiquement, je les intégrerais avec <ul><li>. C'est la recommandation que je fais lorsque je trouve ces cards dans un audit. Ce n'est pas une navigation et il n'est pas utile de donner un role au bloc. Simplement en structurant avec <ul><li> tu donnes aux utilisateurs de technologie d'assistance la possibilité de naviguer dans la liste et de savoir le nombre d'éléments de la liste. Il n'est pas absolument nécessaire d'utiliser une <div> enfant du <li>. Tu peux éventuellement utiliser une balise html5 pour donner encore plus de sémantique à ton bloc comme les balises <section> ou <article>. Je te suggérerais juste de prévoir un titre avant la liste des cards pour la hiérarchie du contenu. Une autre solution si tu ne peux pas intégrer la liste des cards avec <ul><li> est mettre en place une hiérarchie de titre. Le titre de la card est donc intégrée dans un <hn>. Mais cette solution est moins intéressante pour les utilisateurs de technologies d'assistance. Cordialement, Lapeze Régis Consultant en accessibilité numérique email: [email protected] mobile: 0688195411 Le 12 juillet 2016 à 12:40, COUSQUER Christian <[email protected]> a écrit : > Bonjour à tous, > > > > Dans le cadre non pas d’un site web classique mais d’un portail applicatif > web [un conteneur qui affiche un « dashboard » d’une centaine > d’applications, j’aurai pose une question de sémantique à vous > soumettre sur un composant qui commence à apparaitre sur pas mal de sites > html5 : les Cards ( > http://materialdesignblog.com/10-material-design-cards-for-web-in-css-html/ > ). > > Dans mon cas c’est une navigation alternative à la navigation principale > selon WCAG 2.0 (2.4.5 Multiple Ways Level - AA techniques : G126 G185) [ > https://www.w3.org/WAI/WCAG20/quickref/#qr-navigation-mechanisms-mult-loc > ] > > > > J’ai donc une liste de Cards, > > chaque Cards a : > > · un titre (le titre de l’application), > > · une catégorie, > > · un menu d’options (aide, configurer, noter, etc.), > > · une icône (pouvant avoir un décompte de nouvelles > notifications), > > · un lien / bouton permettant de lancer l’application web dans le > portail. > > > > Sémantiquement pour des utilisateurs non-voyants (entre autre) : > > · un élément nav ou ul avec le role navigation ?, > > · des éléments li contenant une div complexe ? (avec quel rôle > pour une Card ?), > > · une liste de définition ? (ça je n’y crois pas du tout). > > > > Bien cordialement. > > Christian Cousquer > > _______________________________________________ > liste_gta mailing list > [email protected] > http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org > >
_______________________________________________ liste_gta mailing list [email protected] http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
