96
Maîtrise des CSS
Si.vous.souhaitez.faire.mieux.encore,.vous.pouvez.choisir.d’attribuer.à.l’élément.une.image.
d’arrière-plan.animée.qui.s’estompe.en.passant.du.jaune.au.blanc,.afin.de.simuler.la.technique.de.fondu.jaune.popularisée.par.les.sites.comme.37 Signals.
.comment:target {
background-image: url(img/fade.gif);
}
Le.sélecteur.de.cible.est.pris.en.charge.par.toutes.les.versions.récentes.de.Safari.et.de.Firefox,.mais.il.n’est.pas.reconnu.par.Internet.Explorer.à.ce.jour..
Différenciation des types de liens
Dans.de.nombreux.sites,.il.est.difficile.de.dire.si.un.lien.pointe.vers.une.autre.page.ou.vers.
un.autre.site..Combien.de.fois.vous.est-il.arrivé.de.cliquer.sur.un.lien.en.pensant.atterrir.
sur.une.autre.page.du.site.pour.vous.retrouver.soudain.transporté.dans.un.autre.univers ?.
Pour.résoudre.ce.problème,.de.nombreux.sites.ouvrent.les.liens.externes.dans.une.nouvelle.
fenêtre..Cette.solution.n’est.cependant.pas.idéale,.car.elle.dépossède.l’utilisateur.du.contrôle.
de.la.navigation.et.peut.accumuler.les.fenêtres.les.unes.sur.les.autres..Elle.peut.aussi.poser.
des.problèmes.aux.utilisateurs.de.lecteurs.d’écran.si.la.nouvelle.fenêtre.n’est.pas.annoncée..
Les.nouvelles.fenêtres.interrompent.aussi.la.continuité.de.la.navigation.avec.le.bouton.de.
page.précédente,.car.il.est.impossible.de.revenir.en.arrière.vers.le.précédent.écran.
L’une.des.solutions.possibles.consiste.à.signaler.les.liens.externes.d’une.manière.ou.d’une.
autre.et.à.laisser.le.choix.à.l’utilisateur.de.quitter.le.site.ou.non,.d’ouvrir.le.lien.dans.une.
nouvelle. fenêtre. ou,. comme. il. est. plus. habituel. de. le. faire. de. nos. jours,. dans. un. nouvel.
onglet..Vous.pouvez.ajouter.une.petite.icône.à.côté.de.tous.les.liens.externes..Certains.sites,.
comme.www.wikipedia.com,.le.font.déjà.et.une.convention.qui.illustre.les.liens.externes.
avec.l’icône.d’une.boîte.surmontée.d’une.flèche.semble.émerger.(voir.Figure 5.4).
Figure 5.4
Icône de lien externe.
Le.moyen.le.plus.simple.d’inclure.une.icône.de.lien.externe.dans.les.pages.consiste.à.ajouter.
une.classe.à.tous.les.liens.externes.et.à.appliquer.l’icône.comme.image.d’arrière-plan..Dans.
l’exemple.suivant,.j’ai.créé.un.espace.pour.l’icône.en.donnant.au.lien.un.léger.remplissage.
droit,.puis.en.appliquant.l’icône.comme.image.d’arrière-plan.en.haut.à.droite.du.lien.(voir.
Figure 5.5).
.external {
background: url(/img/externalLink.gif) no-repeat right top;
padding-right: 10px;
}
Maîtrise des CSS
Si.vous.souhaitez.faire.mieux.encore,.vous.pouvez.choisir.d’attribuer.à.l’élément.une.image.
d’arrière-plan.animée.qui.s’estompe.en.passant.du.jaune.au.blanc,.afin.de.simuler.la.technique.de.fondu.jaune.popularisée.par.les.sites.comme.37 Signals.
.comment:target {
background-image: url(img/fade.gif);
}
Le.sélecteur.de.cible.est.pris.en.charge.par.toutes.les.versions.récentes.de.Safari.et.de.Firefox,.mais.il.n’est.pas.reconnu.par.Internet.Explorer.à.ce.jour..
Différenciation des types de liens
Dans.de.nombreux.sites,.il.est.difficile.de.dire.si.un.lien.pointe.vers.une.autre.page.ou.vers.
un.autre.site..Combien.de.fois.vous.est-il.arrivé.de.cliquer.sur.un.lien.en.pensant.atterrir.
sur.une.autre.page.du.site.pour.vous.retrouver.soudain.transporté.dans.un.autre.univers ?.
Pour.résoudre.ce.problème,.de.nombreux.sites.ouvrent.les.liens.externes.dans.une.nouvelle.
fenêtre..Cette.solution.n’est.cependant.pas.idéale,.car.elle.dépossède.l’utilisateur.du.contrôle.
de.la.navigation.et.peut.accumuler.les.fenêtres.les.unes.sur.les.autres..Elle.peut.aussi.poser.
des.problèmes.aux.utilisateurs.de.lecteurs.d’écran.si.la.nouvelle.fenêtre.n’est.pas.annoncée..
Les.nouvelles.fenêtres.interrompent.aussi.la.continuité.de.la.navigation.avec.le.bouton.de.
page.précédente,.car.il.est.impossible.de.revenir.en.arrière.vers.le.précédent.écran.
L’une.des.solutions.possibles.consiste.à.signaler.les.liens.externes.d’une.manière.ou.d’une.
autre.et.à.laisser.le.choix.à.l’utilisateur.de.quitter.le.site.ou.non,.d’ouvrir.le.lien.dans.une.
nouvelle. fenêtre. ou,. comme. il. est. plus. habituel. de. le. faire. de. nos. jours,. dans. un. nouvel.
onglet..Vous.pouvez.ajouter.une.petite.icône.à.côté.de.tous.les.liens.externes..Certains.sites,.
comme.www.wikipedia.com,.le.font.déjà.et.une.convention.qui.illustre.les.liens.externes.
avec.l’icône.d’une.boîte.surmontée.d’une.flèche.semble.émerger.(voir.Figure 5.4).
Figure 5.4
Icône de lien externe.
Le.moyen.le.plus.simple.d’inclure.une.icône.de.lien.externe.dans.les.pages.consiste.à.ajouter.
une.classe.à.tous.les.liens.externes.et.à.appliquer.l’icône.comme.image.d’arrière-plan..Dans.
l’exemple.suivant,.j’ai.créé.un.espace.pour.l’icône.en.donnant.au.lien.un.léger.remplissage.
droit,.puis.en.appliquant.l’icône.comme.image.d’arrière-plan.en.haut.à.droite.du.lien.(voir.
Figure 5.5).
.external {
background: url(/img/externalLink.gif) no-repeat right top;
padding-right: 10px;
}