Ces petits éléments graphiques si chers à nos design sont essentiels, s'ils sont bien choisis ils apportent beauté et compréhension à l'expérience utilisateur de l'internaute. Le hic c'est qu'il est compliqué de les gérer pour un webmaster. Problèmes de résolutions d'écrans, de tailles, de couleurs, etc. Il faut sans cesse changer tel ou tel icone à tel ou tel endroit du site parce que tel autre picto ferait mieux l'affaire... Alors oui il y a bien les sprites css pour nous sauver la mise, cette technique consiste à mettre tous les pictos côte-à-côte dans une seule image puis d'assigner leur background-position x et y à des classes css qui sont elles-même ensuite appliquées aux éléments html de la page. Ainsi une balise aura son image de background positionnée pile sur la zone qui montre le picto "share". On peut ensuite changer la classe css par une autre pour afficher une autre icône, exemple : pour afficher une loupe, etc. Twitter Bootstrap dispose d'une bibliothèque d'icônes toute prête avec des classes css à placer sur vos balises html. De plus avec un bon générateur de sprite on peut encore un peu plus se faciliter la tâche. Personnellement j'aime faire mes sprites à la main dans Photoshop... je sais pas, ça me détend :P
Your new post is loading...
