Gandi.net Groups

Bonjour

Je prépare une v2 du look. Je refaisait entre autre le bandeau
"heading" (#top). Sur ce bandeau s'affiche le titre h1 qui est le nom
du blog. Je me retrouve dans la situation où ce titre est superbe dans
une certaine police de caractère qui "lui va bien". Avec d'autres
polices, c'est moins joli d'une part, mais surtout, la police de
caractère ne fait pas du tout la même dimension. Comme je ne peux pas
être certain que chacun la possède, ça ne peux pas marcher.

J'ai donc décidé d'inclure le nom du blog dans l'image heading, et de
cacher le titre h1.
Mais si je cache le titre, je prive les lecteurs de la possibilité de
cliquer dessus afin d'aller à la page d'accueil.

J'ai essayé sans cacher le titre, mais en le mettant en color
transparent. Ca ne fonctionne qu'avec Safari, pas Firefox :-(

Auriez-vous des suggestions ?

Merci.

Sanji
http://blog.seyres.net/

Sanji a écrit, le 02/08/2007 06:52 :
[...]

J'ai donc décidé d'inclure le nom du blog dans l'image heading, et
de cacher le titre h1.
Mais si je cache le titre, je prive les lecteurs de la possibilité
de cliquer dessus afin d'aller à la page d'accueil.
J'ai essayé sans cacher le titre, mais en le mettant en color 
transparent. Ca ne fonctionne qu'avec Safari, pas Firefox :-(

Pas testé et peut être un peu "sale" :
si "h1 font-color transparent" ne fonctionne pas, tu peux mettre :
* une taille minimum à ta police
  - avec la même couleur que le background -l'image-,
  - puis surcharger avec "transparent",
* passer ton "h1 a" en "display:block;" (si ce n'est déjà fait).

À la relecture, ce n'est pas très clair. ;) Si tu comprends ma
prose, cela te donnera au moins une piste.

Il me semble avoir lu sur alsacreations quelque chose sur le sujet.
Il faut peut être chercher du côté accessibilité :
* lecture du  texte pour ceux qui ne peuvent lire/voir l'image ;
* lire/voir l'image pour les autres.

Le 2 aoû 2007 à 08:55 CEST, Olivier a écrit :

Sanji a écrit, le 02/08/2007 06:52 :
[...]

J'ai donc décidé d'inclure le nom du blog dans l'image heading, et
de cacher le titre h1.
Mais si je cache le titre, je prive les lecteurs de la
possibilité…

Pas testé et peut être un peu "sale" :
si "h1 font-color transparent" ne fonctionne pas, tu peux mettre :
* une taille minimum à ta police
  - avec la même couleur que le background -l'image-,
  - puis surcharger avec "transparent",
* passer ton "h1 a" en "display:block;" (si ce n'est déjà fait).

À la relecture, ce n'est pas très clair. ;) Si tu comprends ma
prose, cela te donnera au moins une piste.

Il me semble avoir lu sur alsacreations quelque chose sur le sujet.
Il faut peut être chercher du côté accessibilité :
* lecture du  texte pour ceux qui ne peuvent lire/voir l'image ;
* lire/voir l'image pour les autres.

Une autre méthode, parfois utilisée:
Laisser le titre mais l'afficher en dehors de l'écran, par exemple,
pour le blod de sanji:

#top h1 a {
	display : block;
	height : 46px;
	padding : 44px 0 0 10px;
        margin-left:-650px; /* Ajouter cette ligne */  
	}

Merci pour ces 2 suggestions. Mais ça n'est pas ça. En fait, c'est
pareil que si j'ajoute le "visibility:hidden" : le lien n'est plus
accessible.

J'ai fouillé les divers Alsacréation, Pompage, etc. sans succès.

Je continue quand même, il doit y avoir un moyen.

Si quelqu'un connaît une instruction css "-moz" quelque chose,
j'arriverait peut-être à trouver un équivalent du
"color:transparent".

Sanji
http://blog.seyres.net/