Quel est le mécanisme préféré d'utiliser des icônes avec des étiquettes bouton

j'ai vu l'extrait suivant du code de l'interface d'utiliser des icônes avec des étiquettesQuel est le mécanisme préféré d'utiliser des icônes avec des étiquettes bouton

<a href=""> 
    <img alt src="img/save.gif" class="icon"> 
    <span>Save</span> 
</a>

serait-il logique de faire combiner cela dans un entité unique (c.-à-d. icône d'image plus l'étiquette). Mon souci est que si nous choisissons un thème différent (schéma de couleurs), je ne serai pas en mesure d'utiliser des couleurs différentes pour mes étiquettes et pourrait avoir à régénérer l'image. L'utilisation de la première approche me donne la flexibilité de le faire.

Source

2010-06-24 Sam

Je crois que vous avez déjà donné votre propre réponse, si cette approche vous donne la plus grande flexibilité utilisez ceci. – Mervin

ne suis pas sûr de la bonne pratique et par conséquent cette question – Sam

Je ne sais pas à propos de la mise en page ou les couleurs que vous utilisez, mais les éléments suivants sont mes points:

alignement relatif entre l'image et le texte peut être difficile à acheive (avec mon HTML/CSS de base connaissances) lorsque vous avez les deux séparément
Vous pouvez choisir de les séparer parce que vous voulez la possibilité de changer la couleur du texte pendant "les changements de couleurs". Mais êtes-vous sûr de ne pas vouloir changer les images (un autre ensemble d'icônes)? Vous pourriez avoir le même problème de discordances de couleur. (Vous pouvez choisir les icônes de telle manière qu'elles «s'accompagnent» de toutes les combinaisons de couleurs de votre site, puis vous pouvez choisir la couleur de vos étiquettes dans le même style).

Encore une fois, je ne suis pas sûr de la mise en page/couleurs que vous choisissez, de sorte que la réponse définitive est (comme toujours) « dépend de votre site »

Source

2010-06-24 07:38:56 Nivas

ne suis pas sûr si je voudrais changer les couleurs d'icône ici, comme vous le mentionne juste aggrave le problème et pour chaque thème, je devrais changer dynamiquement l'image avec une sorte de une convention de nommage et charger l'image appropriée. Je ne suis pas sûr si cela vaut la peine, je recherche des meilleures pratiques ici – Sam

Tenir compte des indices lien hypertexte pour les icônes de lien commun. Par exemple:

html

<a href="files/holidays.pdf">View Holidays</a>

CSS

a[href $='.pdf'] { 
     padding-right: 18px; 
     background: transparent url(icon_pdf.gif) no-repeat center right; 
    }

Styling de chacun peut être manipulé en CSS. Fonctionne pour à peu près toutes les extensions de type de fichier là-bas. Cela pourrait ne pas fonctionner pour votre exemple spécifique (il faudrait voir le contexte plus large) mais c'est un bon truc pour les liens de téléchargement, etc.

Source

2010-06-24 15:13:25 bpeterson76

Je cherche à utiliser l'approche (ie icône de séparation et l'étiquette) pour les icônes couramment utilisés liés à CRUD (par exemple Enregistrer, Supprimer, Mettre à jour, Annuler ...) – Sam

Quel est le mécanisme préféré d'utiliser des icônes avec des étiquettes bouton

Répondre

Questions connexes