web-dev-qa-db-fra.com

Quel symbole unicode dois-je utiliser pour EDIT?

J'essaie de garder une charge utile très légère sur un plugin wordpress que j'écris.

Les utilisateurs pourront:

  • ajouter - +
  • rafraîchir - ⟳
  • éditer

Je pense utiliser le glyphe de crayon: ✎, mais je n'en suis pas sûr. Quelle est une bonne façon claire d'indiquer que cette action vous permet de modifier les choses?

Je vais également fournir des info-bulles sur les titres, mais je veux que l'icône soit aussi claire que possible sans avoir à créer d'icônes personnalisées.

website-designweb-appiconssymbols
28
MattK

Le symbole le plus proche d'un symbole standard à modifier est ✎ , mais ce n'est en aucun cas universellement compris.

Je suggérerais d'utiliser un Edit à la place.

25
JohnGB

Vous pouvez utiliser Fontawesome. c'est une grande police spéciale faite pour les icônes. il fournit de nombreuses icônes utiles pour éditer, ajouter, se connecter, se déconnecter, supprimer, etc.

http://fortawesome.github.io/Font-Awesome/

Ils utilisent cette icône pour l'édition:

edit icon

J'utilise personnellement des icônes tout le temps parce que lorsque vous avez une bonne icône, les gens savent ce que vous voulez dire. mais vous pouvez toujours mettre le texte "Modifier" après l'icône.

Exemple:

© Edit
10
Kees Sonnema

La police Wingdings fournie par défaut avec Windows a un symbole soigné qui peut être utilisé pour EDIT.

Edit Symbol in Wingdings

Ce symbole apparaît à la place du point d'interrogation ('?') (Unicode 0x3F). Pour l'ajouter à votre page, vous pouvez utiliser:

<span style="font-family:Wingdings;">?</span>


MODIFIER:
Apparemment, la famille de polices Wingdings ne fonctionne pas sur Firefox et Opera . Au lieu de cela, vous pouvez utiliser le symbole Unicode U + 270D pour obtenir ceci:

Edit Symbol in Unicode

Dans le code, cela ressemblerait à quelque chose comme:

<span style='font-size:20px;'>&#x270D;</span>

Et en tant que caractère unicode, le voici: ✍

8
SNag

J'utilise un symbole de crayon tourné:

<span class="edit-icon">&#9998;</span>
<style>
.edit-icon {
  display: inline-block;
  transform: rotateZ(90deg);
}
</style>

https://jsfiddle.net/mudroljub/wjstopLf/

Cela ressemble à une icône d'édition pour moi.

3
Damjan Pavlica