5568 sujets

Sémantique web et HTML

Bonjour,
J'aimerai savoir si il est possible de faire un lien sur une div id en absolu vide donc sans images ni texte?
Merci
Modérateur
Bonjour,

oui, en lui attribuant un id et en faisant un lien vers cet id :

<div id="vide"></div>
...
<a href="#vide">conteneur vide</a>
C'est pas tout à fait ce que je souhaite faire.
Je voudrai que quand je clique sur la div ça renvoi vers une url.
ex:
<div id="vide"><a href="http://www.lesiteenquestion.net"></a></div>

et avec le css que voici :
#vide {
	position:absolute;
	width:515px;
	height:60px;
	left: 342px;
	top: 41px;
	}

la div est vide pas d'image, pas de texte.
Elle est placée sur une partie d'image.
Donc quand je passe sur cette partie d'image le lien vers le site en question devrait fonctionner mais ça ne va pas puisque pas d'image sur cette div ni de texte.
Comment faire ?
Salut,

Il me semble que ça n'est pas possible (mais si quelqu'un pouvait me contredire ça me dépannerais aussi Smiley cligne ) car dans ce cas ta zone de lien "cliquable" n'a pas de dimension à l'écran. Je m'étais posé la question pour un header avec une image déclarée dans le CSS en background et la seule solution que j'ai trouvée a été de mettre l'image dans le contenu et un lien classique <a href="..."><img src="..."></a>
D'ailleurs d'un point de vue accessibilité c'est sans doute mieux de faire comme cela.

@+
Je pensai qu'il y avait une solution.
C'est également pour le header comme toi Smiley cligne .
Donc il va falloir redécouper l'image du header afin d'avoir l'image dans ma zone div pour faire fonctionner le lien.
Par fénéantise j'avais pas trop envie de réutiliser photoshop Smiley cligne mais bon ...
@+
Juste pour info !

Il semblerait que pbpub vienne de donner une "solution" sur son post
Je mets entre guillemets puisque justement cela pose entre autres un problème de validation...
En tous cas le code suivant "fonctionne" :
<a href="http://www.lesiteenquestion.net"><div id="vide"></div></a>

Ciao
Heyoan a écrit :
Juste pour info !

Il semblerait que pbpub vienne de donner une "solution" sur son post
Je mets entre guillemets puisque justement cela pose entre autres un problème de validation...
En tous cas le code suivant "fonctionne" :
<a href="http://www.lesiteenquestion.net"><div id="vide"></div></a>

Ciao


Bonjour,

Tu as toi-même dit dans le post mentionné Smiley cligne :
a écrit :
Donc de mon point de vue la solution serait de redécouper ton header.jpg en logo.jpg et header_droit.jpg et de mettre un "vrai" lien avec image et alt qui va bien dans ton div logo.
Mais ceci n'engage que moi cligne
Bonsoir,

a écrit :
J'aimerai savoir si il est possible de faire un lien sur une div id en absolu vide donc sans images ni texte?

Ca semble totalement pas ergonomique ton histoire. Comment un internaute lambda saura-t-il qu'il y'a un lien dans une zone ou ne se trouve ni texte ni image ? Tout le monde ne parcours pas le code à la recherche des liens cachés. Ou alors j'ai pas compris le fond de ton problème.
Modérateur
Re,

On peut remplacer la div par un lien via JS en conservant l'id mais je suis du même avis que Mikachu : Les liens doivent êtres visibles.
Igor a écrit :
Bonjour,

Tu as toi-même dit dans le post mentionné Smiley cligne :
Donc de mon point de vue la solution serait de redécouper ton header.jpg en logo.jpg et header_droit.jpg et de mettre un "vrai" lien avec image et alt qui va bien dans ton div logo.
Mais ceci n'engage que moi cligne

Bonjour Igor Smiley biggrin ,

c'est vrai que je me suis un peu enflammé sur le côté "technique" de la chose mais redonner le lien sur un forum dédié à l'accessibilité était un peu déplacé Smiley biggol ...
Mikachu a écrit :
Bonsoir,
Ca semble totalement pas ergonomique ton histoire. Comment un internaute lambda saura-t-il qu'il y'a un lien dans une zone ou ne se trouve ni texte ni image ? Tout le monde ne parcours pas le code à la recherche des liens cachés. Ou alors j'ai pas compris le fond de ton problème.


Pour te répondre, imagine l'image du header dans une div, et que maintenant je voudrais que lorsque l'on cliques sur l'image du header on revient à la page d'accueil , ça se voit partout sur les sites.

Maintenant quand je veut que cette zone soit limité à une partie de l'image, en faisant une div absolute vide je pensais que ça pouvait etre la solution sans passer par le redécoupage et dans ce cas le lien ne doit pas obligatoirement etre visible.
La solution cité par Heyoan fonctionne sur ie et firefox meme si c'est un peu bizarre Smiley eek .
J'espère que c'est un peu plus clair.
@+
a écrit :

Maintenant quand je veut que cette zone soit limité à une partie de l'image, en faisant une div absolute vide je pensais que ça pouvait etre la solution sans passer par le redécoupage et dans ce cas le lien ne doit pas obligatoirement etre visible.

Pourquoi ne pas tout simplement faire une image map ? Cela me semble un peu plus adapté.
Mikachu a écrit :

Pourquoi ne pas tout simplement faire une image map ? Cela me semble un peu plus adapté.

Hum, et pourquoi ne tout simplement pas appliquer un display:block; au lien et les dimensions souhaitées.

Tchaw.