Click here to Skip to main content
Click here to Skip to main content
Technical Blog

Unassuming Unicode, the secret to characters on the web

, 23 Jul 2014 CPOL
Rate this:
Please Sign up or sign in to vote.
How unicode can lead to eye-catching symbols. Article originally published at http://snipurl.com/299cdeu

Recently I got an e-mail with an interesting title:
 

How did they do that?


Just how did KLM insert an airplane into the subject of an e-mail? Unicode!

I needn't put a full description here, but unicode is the system that provides a unique identifier for every single character your computer is capable of displaying.  Yes Chinese, Yiddish, Maldivian, Airplane symbols, the lot!

So what does this look like under the hood?

To find out I copied the character into Notepad and saved it, ensuring I selected 'Unicode' as the encoding at the bottom of the 'Save As' dialog.


Then I viewed the raw binary of the file in a hex editor (I just happened to pick this online one).  The results were simply:
FF FE 08 27


What we're seeing here is the hexadecimal representation of the binary in the file.  You can confirm this using windows calculator in programming mode but for simplicity this is:

FF     11111111
FE     11111110
08     00001000
27     00100111

The first two bytes are telling us that is little-endian UTF-16, these are the byte order mark (BOM).  Endian (or endianness) simply tells us from which end we read the data first, which in this case means we read from right to left.

So doing this we now have (omitting the byte order marks):

27 08

Which just so happens to the unique identifier for the airplane symbol:



But why do you care about this?  You could've just copied and pasted the original symbol, right?

Well it just so happens that HTML encoding closely follows these unicode code points.  So if I wanted to use this character myself I'd want to be absolutely certain it'll render correctly.

To do this I'd first make sure my page is described as being encoded in unicode using the correct meta tag:

<meta charset="utf-8">


Then I can create the character using &#xnnnn; where nnnnn is the unicode code point.  Therefore &#x2708; creates our airplane:


That's just one.  There are 109, 383 other characters out there, go and use 'em.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Matthew Edmondson
Software Developer
United Kingdom United Kingdom
Selected articles are published on codeproject. For all of my content, including how to contact me please visit my blog.
Follow on   Twitter   LinkedIn

Comments and Discussions

 
SuggestionHmmm PinmemberPetoj8722-Jul-14 20:18 
GeneralRe: Hmmm [modified] PinmemberMember 1029439622-Jul-14 21:33 
GeneralRe: Hmmm Pinmembereddy55622-Jul-14 21:50 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web04 | 2.8.141022.1 | Last Updated 23 Jul 2014
Article Copyright 2014 by Matthew Edmondson
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid