The benefits of using unicode fonts for icons are that they:
- are widely supported
- save space as the font is already on the users device
- quick to implement
- fairly consistent across devices
You need to ensure the target audience have Arial Unicode font on their computers for this method to work. The html would be:
<span class="icon">◀ ▶</span>And the css:
.icon {
font-family: 'Arial Unicode MS', sans-serif;
}
This is supported in lots of browsers, however IE8 only supports certain characters. I've also noticed some Mobile Chrome browsers don't support these.Here are some sites with good references for characters & symbols:
http://unicode-table.com/en/
Here is an example of the characters working:
