5568 sujets

Sémantique web et HTML

Bonjour

dans le site que je suis entrain de faire je voudrai mettre en place un menu de navigation vers mes différents profil sociaux: facebook, twitter, etc...

Sachant que cette section ne contiendrai que des liens je me suis naturellement dirigée vers la balise nav.

la question:
Peux-t-on mettre des liens externes dans la balise nav ou celle-ci est-elle réservée uniquement pour la navigation interne du site? les spécifications du W3C ne sont pas très clair dessus je trouve (vu mon niveau d'anglais Smiley langue )
salut,
à ma connaissance, <nav> renvoi uniquement vers des liens de ton site et non externes. À confirmer...
Administrateur
Bonjour,

est-ce qu'il y a déjà un menu de navigation vers des pages internes ou bien est-ce que c'est ton portfolio et les liens dont tu parles sont l'essence même de ton site ?

EDIT: L'article Support des rôles landmark ARIA et éléments sectionnants HTML5 par les lecteurs d'écran d'AnySurfer.be résume bien ce qui est actuellement conseillé :
a écrit :
C'est une bonne idée de combiner les deux: <nav role="navigation">. Notez bien que ceci ne doit être utilisé que pour le menu principal ainsi qu’éventuellement le sous-menu. Mais il ne faut pas utiliser l'élément nav pour chaque liste de 2 ou 3 liens .

Ce n'est pas toi qui n'a pas le niveau en anglais, c'est bien la doc qui n'est pas claire (pour l'époque). Smiley smile
Modifié par Felipe (30 Oct 2013 - 16:28)
j'ai un menu de navigation interne dans mon site et je voudrais faire un menu de navigation externe vers mes differents profil.

je vais voir le liens que tu vien de mettre

merci
pour etre plus precis j'ai différentes pages dans mon site dont une qui me sert de portfolio et c'est dans celle ci que je voudrai mettre mes liens vers mes profil.
par curiosité j'ai mis nav dans ma page et je l'ai passé au W3C validator qui ne trouve aucune erreur, donc apparemment ça doit être possible enfin si le W3C validator détecte ce genre d'erreur Smiley ohwell

@felipe merci pour ton lien je ne connaissais pas du tout les rôles, je vais m'appliquer à les utiliser maintenant Smiley biggrin mais ca resoud pas mon pb
Hello,

C'est normal que le validateur ne te retourne aucune erreur, il ne va pas vérifier si tes liens mènent vers un autre site que le tien Smiley cligne

En fait, si tu utilises l'élément nav, ce sera valide et utilisable mais la question c'est plutôt de savoir si c'est logique. Dans le doute et en attendant une spec claire, je ne l'utiliserais pas pour éviter de tromper d'éventuels agents utilisateurs mais franchement je ne crois pas que les risques soient démesurés non plus Smiley cligne A suivre tout de même.
IL me semble que dans la définition originelle de <nav> ou en tout cas dans l'esprit où elle a été conçue, celle-ci est réservée aux menus et autres zones de navigation. Rien n'est précisé en ce qui concerne l'externalité des liens composant les dites zones de navigation, mais par contre elles ne sont logiquement pas censées figurer n'importe où dans la page.

Je pense que la question qu'il faut se poser est plutôt de l'ordre de est-ce que ces liens font partie d'un menu de navigation qu'on retrouve sur toutes ou une sous-partie cohérente des pages du site (si oui alors <nav>), ou est-ce que ces liens font partie de cette page précisément parce qu'ils sont en rapport avec le contenu de cette page-là en particulier (si oui alors surtout pas <nav>)

Je sais pas si je suis très clair, mais on pourrait très bien imaginer qu'un lien extérieur au site soit présent dans un menu de navigation pour lequel <nav> se justifie totalement: un partenaire important, un lien très fort entre deux sites mais qui sont séparés pour des raisons administratives (P.ex. .com la communauté vs .fr la société, ou la mairie d'une ville/région vs son programme touristique/culturel, ou deux départements d'une grande société qui possède plusieurs domaines)...

Par contre dans ton cas si c'est des liens partage/like facebook/twitter & Co, franchement, je dirais non à <nav>; ces liens sont déjà suffisament inutiles le 99% du temps, les mettre en avant plus que nécessaire en devient énervant à la longue. Sans hésiter, ça ne fait partie d'aucune forme de navigation à mon avis, donc n'utilise pas <nav>.


a écrit :
par curiosité j'ai mis nav dans ma page et je l'ai passé au W3C validator qui ne trouve aucune erreur, donc apparemment ça doit être possible enfin si le W3C validator détecte ce genre d'erreur

Fais attention à bien faire la différence entre la sémantique, le sens des balises dans le contexte où elles se trouvent, et la syntaxe. Le validateur du W3C ne vérifie que cette dernière. Pour aider à comprendre ce qu'il fait et ce qu'il ne fait pas, voici une petite analogie avec la langue française: si je te dis "le téléphone regarde la machine à café avec une pelle", c'est une phrase qui ne veut rien dire mais qui est grammaticalement correcte. Si le validateur du W3C validait le français, cette phrase passerait la validation, quand bien même les mots dont elle est composée n'ont aucun sens. Les validateurs d'accessibilité essaient de faire un peu de sémantique, mais ils sont toujours plus ou moins imparfaits.

P.S. Merci de ne pas [s]troller[/s] faire des suppositions vaseuses sur le contenu de ma phrase d'exemple
Modifié par QuentinC (30 Oct 2013 - 22:14)
Je remet la définition du W3C que j'ai traduit (heu... qu'on m'a aidée à traduire Smiley langue )

"The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links."
Soit : L'élément nav représente une section de page constituées de liens vers d'autres pages ou à l'intérieur de la page : une section avec des liens de navigations.

Il n'est donc pas clairement stipulé qu'il s'agisse uniquement de navigation interne aux sites puisqu'on parle de "liens vers d'autre pages" sans y apporter plus de précision.

Ces pages peuvent être interne au site mais également externe non?

le W3C ne parle pas de "menu de navigation" mais bien d'une "section de lien de navigation", donc rien ne justifie que cette balise doivent être repris à l'identique sur toutes les pages du site???

D'ailleurs le but du web c'est bien de pouvoir naviguer n'importe où: "on utilise tous un navigateur web" qui nous permet donc de naviguer sur le web.

Les robots d'indexation analyse également les backlinks qui permette une navigation d'un site à l'autre pour en analyser les contenus.

etc....

selon le W3C <nav> est une "section avec des liens de navigation" sans plus de précision, donc pourquoi se limiter à une navigation interne au site?

si je met un truc du genre:

<nav>
  <ul>
    <li><a href="http://www.alsacreation.com">Alsacréation</a></li>
    <li><a href="http://www.lefigaro.fr">Le Figaro</a></li>
    <!-- etc... -->
  </ul>
</nav>


sémantiquement on lira selon la définition du W3C: "une section de lien de navigation qui me renvoi sur une liste de lien qui me redirige vers Alsacréation, le figaro, etc.... " Ce qui a du sens contrairement à : "le téléphone regarde la machine à café avec une pelle" Smiley cligne
donc sémantiquement je ne vois pas d'erreur à proprement dit.
Il y a toujours une part de subjectivité dans la sémantique. Ce que je disais était simplement mon interprétation personnelle. Mais à mon avis, si <nav> a été inventé, je pense que c'est à la base surtout pour différencier les sections entières destinées à la navigation par opposition aux listes de liens génériques qui peuvent traîner au milieu ou en fin d'article et qui sont plus ou moins liés à cet article précisément.

Autant des liens vers des partenaires ou entres sites liés comme j'expliquais ci-dessus se justifieraient très probablement dans un <nav>, internes ou externes peu importe, autant pour moi, des liens facebook, twitter & Co, c'est pas vraiment de la navigation à mon avis, c'est pas vraiment un partenaire non plus... C'est surtout ça la question, en fait: est-ce que c'est une section de navigation, ou pas. Perso je réponds non, mais d'autres te diront oui, et ça ne sera pas nécessairement plus faux, ou plus juste.
Hello Ludo

Source: HTML5 Doctor / Semantic navigation with the nav element

HTML5 Doctor a écrit :

The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links. Not all groups of links on a page need to be in a nav element only sections that consist of major navigation blocks are appropriate for the nav element.


Traduction a écrit :
L'élément nav represente une section de la page qui lie à d'autres pages ou parties à l'intérieur de la page: un section de navigation de liens. Tous les groupes de liens d'une page n'ont pas à être un élément nav, seulement les sections qui consistent en des blocs de navigation majeure sont appropriés à pour l'élément nav.


Tu peux utiliser l'élément nav pour:
- primary nav (catégories / pages du site)
- secondary nav (ancres internes, par exemple pour une page Conditions d'utilisation)
- sitemap
- navigation multilangues
- pagination
- fil d'Ariane
- étapes de formulaire

C'est une ligne non exhaustive et non obligatoire, la question n'est pas de savoir ou et quand l'utiliser mais si ca a du sens de l'utiliser.
Pour la pagination, ca a du sens lorsque l'on passe d'une page a une autre de frontpage, ca me semble moins pertinent à l'intérieur d'un article qui aurait été coupé en plusieurs parties pour des raisons esthétiques (comme pour un slider par example).

Le terme "navigation" s'entend aux pages dans le scope du site (pages internes, ou en relation direct avec le site: ex. si tu as ton blog sur un autre domain ou sous-domaine), les pages externes vers d'autres sites brisant la navigation de l'utilisateur puisqu'il "sort".


Pour les liens sociaux, il faudrait plutot utiliser les microformats

Source: SEO Gadget / Applying Microformats to Links

SEO Gadget a écrit :
As the Microformats Wiki page states: ” rel=”me” is used on hyperlinks from one page about a person to other pages about that same person”. Why is that important? According to some, Google may well be using this as an indicator for establishing relationships for its Social Search results and that you can use the attribute to create a “social hub on the open web”


Traduction a écrit :
Comme la page Microformats Wiki l'établie: "rel=me" est utilisé sur les liens d'une page à propos d'une personne à d'autres pages sur la même personne". Pourquoi est-ce important? Selon certains, Google pourrait certainement utiliser ceci comme un indicateur pour établir des relations pour les résultats de son moteur de recherche social et pourrait utiliser cet attribut pour créer un "social hub sur l'open web".

Modifié par Sugarskill (02 Nov 2013 - 07:36)