Conforme : Liens mis en forme via CSS avec un texte positionné hors écran
AccueilSuivant
<a href="#" class="btn home">
<span class="sr">Accueil</span>
</a>
.sr{
position:absolute;
top:-10000px;
}
.home:before{
content:"";
display:inline-block;
background:url("../img/home.png") no-repeat center;
height:20px;
width:30px;
}
Non conforme : Liens mis en forme via CSS seulement (lien vide)
<a href="#" class="btn home">
<span class="icon"></span>
</a>
.icon:before{
content:"";
display:inline-block;
background:url("../img/home.png") no-repeat center;
height:20px;
width:30px;
}
Conforme : Liens images avec une alternative
<a href="#" class="btn">
<img src="img/home.png" alt="Accueil" />
</a>
Non conforme : Liens image sans alternative (lien vide)
<a href="#" class="btn">
<img src="img/home.png"/>
</a>
Conforme : Liens composites (texte et image de décoration)
Accueil
<a href="#" class="btn">
<img src="img/home.png" alt="" />
Accueil
</a>
Non conforme : Liens composites (images avec une alternative non pertinente)
Accueil
<a href="#" class="btn">
<img src="img/home.png" alt="home.png" />
Accueil
</a>