5568 sujets

Sémantique web et HTML

Bonjour à tous,

Je suis en train de remanier un site existant et je souhaite le rendre valide xhtml strict.
Le résultat et les effet sont concluant, mais la validation pose problème.

Voici la page http://validator.w3.org/check?uri=http%3A%2F%2Fwww.pls.fr%2Fpls_xhtml%2Fimpression-numerique.htm

Comment faut il imbriquer la balise <li> pour faire des liens (je pense que le problème vient de là)

Merci d'avance pour votre participation, en ésperant avoir posé la question au bonne endroit et de manière comprehensible ! Smiley cligne
Un élément a ne peut contenir un élément li; c'est le contraire qui est possible.

En passant, prends du temps pour nettoyer ton code -il y a à première vue plein de div et de class inutiles... Réfléchis en priorité à la structure de la page. La concision du code en découlera; et la validation ne sera plus qu'une formalité.

On peut sans difficulté faire un code XHTML strict qui valide, mais qui serait très inaccessible et sémantiquement incorrect (ce qui me semble, je le répète, à première vue, le cas sur ton site)...
Merci pour tes conseils

avec
<li> <a>.....</a></li>
la page est valide, mais les puces carrées ne changent plus en survol.

a écrit :
On peut sans difficulté faire un code XHTML strict qui valide, mais qui serait très inaccessible et sémantiquement incorrect (ce qui me semble, je le répète, à première vue, le cas sur ton site)...

Que veut tu dire par très inaccessible et sémantiquement incorrect ?
washer a écrit :

Que veut tu dire par très inaccessible et sémantiquement incorrect ?


<div class="menuhaut"> 
	<a href="index.htm">Accueil</a> 
	<a href="contraintes.htm">Contraintes techniques</a> 
...
</div>


Il s'agit d'une liste de liens. Ton balisage est valide, mais n'utilise pas l'élément de liste <ul> qui permettra à cette liste d'être reconnue comme tel quelque-soit le navigateur.

Du coup, dans un navigateur sans support CSS, ta liste n'apparaît pas de manière bien nette, alors qu'avec le balisage "sémantiquement correct" (<ul>), elle y apparaîtrait avec des puces, des retours à la ligne, etc. qui la rendent plus claire.

L'utilisation de <ul> ne t'empêche pas de la faire apparaître à l'inverse en une seule ligne dans les navigateurs avec support CSS : CSS te permet d'y faire disparaître les puces et de tout mettre sur une ligne.

<li><a href="impression-numerique.htm"> 
  Impression num&eacute;rique 
  <span>
    <object>
    <h3>Couleur / Noir &amp; Blanc</h3>
    <h5>Personnalisation de mailling,</h5>
    <h5>Plaquettes multi-volets,</h5>
	<h5>Epreuves de controle,</h5>
    <h5>Fiches techniques,</h5>
	<h5>Reprographies,</h5>
	<h5>Prospectus,</h5>


Là, le code n'est pas valide. Quel est le problème concret ? L'utilisation d'élément de titres <h3> et <h5> quand le contenu n'est pas un titre va :
- déformer l'indexation de ta page dans un moteur de recherche
- rendre difficile l'accès à ta page dans un outil qui se sert justement des titres de section (un lecteur d'écran, ou tout autre outil qui génère une table des matières)
- rendre peu compréhensible, encore une fois, le rendu dans un navigateur sans support CSS, avec des titres déroutants