A quick tip for those designing web interfaces with an “X” icon for a “Close” element. Rather than the letter “x” (or capital “X”), use the multiplication (U+2715) or heavy multiplication (U+2715) symbols.
There’s no semantic advantage as neither the letter X nor the ✕ symbol have the appropriate meaning, but we’re just using the character to define a shape (often rendered as an image).
In most fonts the multiplication symbol is vertically and horizontal symetrical and has angled end strokes. It really just looks better. The heavy variation looks even prettier.
| ✕ | ✖ | Multiplication (U+2715) / Heavy Multiplication (U+2715) |
| X | X | Latin Capital Letter X (U+0058), normal / bold |
| x | x | Latin small Letter X (U+0078), normal / bold |
I am not sure, how much semantically it is better. X can be seen as eXit. Multiplication is strange here.
But I agree that it looks much better as close symbol.
It probably is much better, but using Firefox 3.5, Chrome or IE7 on Windows XP doesn’t show the multiplication symbol. It doesn’t have the apropriate font I guess, and it shows a box instead.
If you want compatibility I guess you better stick with the ‘x’.
Martins: As I stated in the original post, It’s certainly not any better, semantically.
Laszlo: Works on XP here for me – might depend on font updates that come with later service packs or Office. Regardless, it’s often used rendered in anyhow.
It works on Linux here, but i stil think that using a character instead of a 2 color lets say gif is not much of an advantage in my view. And font scaling can mess it up hard. 😀 Using full page scaleing will produce better results. But it will pix up any other image on the site anyway.
I think the author’s intention which seems to be missed in the above comments is that the X should be rendered as an image. This would be the best way using CSS image replacement on a text-link with the words close window in the link text. Then you do not have to consider the semantics of such usage.