HTML5 : Un lien par dessus un autre lien ?

Bonjour à tous,

Je rencontre actuellement un problème sur l'intégration de l'un de mes projets Web qui est plutôt une question sur la validité du code HTML5/CSS3 que je produit.

Un de mes clients aimerait avoir un lien sur une image renvoyant vers un article. Je dois placer par dessus cette image un icône en haut à droite. Cet icône correspond à une autre action (autre lien).

Pour résumé, il faut un lien par dessus un autre lien.
Je n’ai je crois jamais rencontré ce cas de figure (même si ça me paraît plutôt bizarre de n’avoir jamais vu cela).

J’ai donc mis en place la chose avec des blocs en position absolute et des Z-index (CSS) et celà marche très bien.

Parcontre, je me pose vraiment la question de la validité du code produit.
Je tiens à préciser que je ne mets pas un lien dans un lien mais bien deux liens différents que je positionne l'un au dessus de l'autre.

Je cherche des infos sur la validité de cette méthode mais je ne parviens pas à trouver d’article vraiment sérieux sur le sujet …
Bref, je suis venu demander de l'aide des avis ...

D’avance merci pour vos réponses ! et à bientôt.
Modifié par Blipmaker (14 Apr 2014 - 18:20)

Du point de vue du standard, imbriquer un <a> dans un autre <a> est explicitement interdit.

Mais si par l'un au-dessus de l'autre tu fait juste référence au positionnement graphique, et que, structurellement parlant, c'est deux <a> distincts, il n'y a pas en soi de contre-indication si je ne me trompe pas.

par contre c'est à mon avis complètement crétin, parce que ça risque d'avoir un comportement plus ou moins inattendu dans certains cas limite, p.ex. quel lien ouvrir si on clique sur une zone transparente de l'icône, dans un coin de bordure arrondie, ou pile entre deux caractères.

Personnellement j'éviterais les zones réactives qui se superposent, pour éviter tout problème.