Image entre balise H1

[Szarah]

Autant pour moi, French Dread

-http://www.w3.org/TR/html4/sgml/dtd.html
Si tu cherches IMG, il dit que c'est un special et special c'est un inline et H1 n'accepte que des inline.
Tous les inline sont des text-level
Un objet, une applet, sont tous des tags qui sont au même niveau que du texte.

Donc, une image dans un H1, c'est valide.

[zimounet]

Mon point de vue:

Vis a vis de la sémantique: les balises <Hx> sont prévu pour hiérarchiser un document en titre, sous titre, soussoustitre etc.

Tout comme vous structurez vos copie de francais ou de philo pour ceux qui sont encore au bahu.

L'idée vous viendrais de mettre une image en titre dans un livre ou un devoir ou n'importe quel document?

Vis à vis de google: des erreurs de xhtml et de html, google à l'habitrude, donc pénalisé, je ne penses pas.

Par contre, comme cela à déjà été dit, tout le monde a constaté que l'attribut alt d'une image n'influt pas ou d'une manière insignifiante sur le référencement. Donc c'est pas le h1 qui vas lui rajouter de la "valeur" je penses.

[blman]

Tout comme vous structurez vos copie de francais ou de philo pour ceux qui sont encore au bahu.

Je pourrais aussi prendre les docs commerciales, journaux d'information, et autres plaquettes ou publicité : les titres sont souvent en image. C'est pas pour ça que le contenu n'est pas structuré.

[rikew]

A partir du moment ou l'image est le titre de la page, ca me parait complement logique de la placer dans un <h1>.

Mais il y a plus logique je pense. tu n'as qu'a mettre ton titre normalement dans le <h1> :

<h1>ton titre</h1>

Ensuite avec les css tu met ton image en background et pour pas que le texte apparaisse tu utilise par exemple la propriété : text-indent: -1000em;

tu peut faire encore plus propre :
<h1><span>ton titre</span></h1>
avec :
span h1 { display:none; }

Ya pleins d'exemple ici : http://www.csszengarden.com

[Kilroy]

Je me suis posé la question des balises H autour d'images car j'ai déjà vu le cas d'un site qui utilisait cette technique.

- Effectivement, ça passe bien sous Lynx

- Google prend bien en compte les textes mais pour ce que j'en ai vu jusqu'ici, il ne leur donne pas un poids très important. Difficile de faire ressortir les pages sur le contenu des alt insérés au milieu des balises H, mais c'est peut être dû à d'autres problèmes.

- le dernier aspect c'est : y a t'il un moyen de faire autrement ? J'avais testé Microsoft Weft pour faire des titres en utilisant des polices autres que les sempiternels Arial et Verdana, mais cette solution ne marche que sous IE.
Si vous connaissez une autre solution qui permette d'éviter de mettre des images dans des balises H...

[rikew]

regarde la source :
=> http://www.csszengarden.com/?cssfile=/1 ... css&page=0

[Kilroy]

J'ai cherché un peu et je suis tombé sur cette solution qui évite de passer par du remplacement de texte :
http://www.mikeindustries.com/sifr/

[cleden]

1: Quand on vise l'accessibilité, on ne place pas, dans une image, un texte que l'on pourrait écrire en html.

[TOMHTML]

tu peut faire encore plus propre :
<h1><span>ton titre</span></h1>
avec :
span h1 { display:none; }

Google peut considérer ça comme du texte caché.
Perso je ne m'y aventurerais pas...

[Romuald]

tu peut faire encore plus propre :
<h1><span>ton titre</span></h1>
avec :
span h1 { display:none; }

Google peut considérer ça comme du texte caché.
Perso je ne m'y aventurerais pas...

J'utilise, et je n'ai pas de soucis.
Cela permet de décrire la bannière non ? Souvent j'y place une description du site (http://ckkoshi.free.fr/).

Par contre, j'avais lu sur un billet de Raphael de Alsacréations que les

Code: Tout sélectionner

display:none;visibility:hidden;

n'était pas pris en compte par les navigateurs voix. Peut-être qu'un

Code: Tout sélectionner

opacity:0;

(avec le hack qui va bien pour IE) pourrait faire... Mais ça reste crade.
Sinon un span en

Code: Tout sélectionner

position:absolute;et un top:-plein de pixel;

Mais ça reste un peu bricolage.