recommended for encoding . standard characters . extended characters (includes accented letters and fractions) . cautionary tale about extended characters . encoding examples
Because the symbols " & < > (double quotationmark, ampersand, lessthansymbol and greaterthansymbol) are integral to HTML code itself, you should be replacing all instances of " & < > that are used for anything other than the code itself. It is also useful to employ character entities to replace characters in e-mail addresses that are entered on your webpages. This helps greatly in preventing robots from mining e-mail addresses for spam purposes. In your HTML coding, replace the character with &#numberofcharacter; (ampersand, hashmark, numberofcharacter, semicolon). Instead of &, you would type &. There are examples of HTML code using character entities at the bottom of the page.
N.B. The folks at w3c now recommend that if accented characters are to be used, the UTF-8 charset be chosen rather than iso-8859-1. Only the characters " & < > (double quotationmark, ampersand, lessthansymbol and greaterthansymbol) should be encoded. The others can be typed as is. Put the following coding just before </head>.
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
That being said, it is probably still a good idea to encode the @ symbol especially if the mailto: link is used. Please see the recommended for encoding section.
ASCII stands for "American Standard Code Information Interchange". The numbers of the characters can be found by referring to the character map on your computer. The characters numbered from #032 to #126 are common to all keyboard systems. (#032 is the spacebar and is not the recommended character entity to depict a non-breaking space.)
recommended for encoding . standard characters . extended characters (includes accented letters and fractions) . cautionary tale about extended characters . encoding examples
use these character entities - strongly recommended
Character and Name Character Entity _______________________________________ & ampersand |
encoding examples using some of the above characters
recommended for encoding . standard characters . extended characters (includes accented letters) . cautionary tale about extended characters . encoding examples
These characters will look the same from computer to computer.
(Use a fixed-width font for ASCII-art and charts)
Courier, FixedSys, Monaco and the generic monospace are examples of non-proportional or fixed width fonts and are used for drawing ASCII-art and making charts. It is ill advised to use Times New Roman, Times, Symbol or any other proportional width fonts for drawing ASCII-art or making charts.
Some people prefer named entities rather than numbered because they are easier to remember. " quotation mark |
recommended for encoding . standard characters . extended characters (includes accented letters) . cautionary tale about extended characters . encoding examples
The characters numbered from #127 to #255 (and higher) are not common to all keyboard systems and can look quite different on different operating systems. Please bear that in mind when you use these characters.
Here is an example using the character #189. These will look different depending on whether you are viewing this page on a PC or a Mac or a....
After looking at the character map on my PC, it looks like #189 in "Symbol" font will show a "vertical bar".
Symbol font #189: ½
But when I look at it here on the webpage, even though this computer has the symbol font installed, I see a "one half" symbol in Netscape7, Firefox and Opera. The "vertical bar" only appears in IE6 and the ancient and little-used NS4. See "standard characters" for the character entity for | (vertical bar)
Here is the character #189 in a "sans-serif" font: ½
In this case, on my PC, as expected, I see a "one half" symbol, but depending on your OS, you might be seeing an asterisk, or the symbol for Pi, or ?, or ....
"wingdings" #189: ½
On my PC, I see an "analogue clock" symbol showing 07:00. But anyone who doesn't have the wingdings font installed will see "one half" (or maybe an asterisk, or the symbol for Pi, or....)
Moral of the story: It is inadvisable to use specific fonts for symbols. If you really want the characters you use on your website to be viewed relatively globally, it's a very good idea to follow the guidelines at www.w3.org. If you plan on using extended characters, you might want to use images rather than entities unless you know categorically that your viewers will be able to see them.
recommended for encoding . standard characters . extended characters (includes accented letters and fractions) . cautionary tale about extended characters . encoding examples
accented letters . copyright symbols . mathematical symbols (includes fractions) . editorial symbols . arrows . currency symbols . more extended characters (geometric shapes, more mathematical symbols, Greek alphabet, card suits)
You may see something entirely different, depending on your character set. Some people prefer to use named character entities rather than numbered. I have shown both in the following table. However, some browsers may not render the named character entities. For instance, NS4 (yes, yes, I know that is an obsolete browser but there are still a few floating around) does not render ˆ (circumflex) with the named entity ˆ (one sees the character entity rather than the character) but it does render ˆ using the equivalent numbered entity ˆ. NS4 does not render tilde ˜ with the named entity ˜ but does render ˜ using the numbered entity &732;. (Those last sentences may look like nonsense to you because your system does render the letter entities.) On some browsers, the unsupported character may show up as a ? (question mark) or a hollow rectangle.
These are arranged with the numbered entities to the left of the symbol and named entities (if known) to the right. The number entities on the left are supported by NS4+ and IE4+. Some letter entities on right are NOT supported by older browsers. If the character used has a number entity greater than #255, it may be advisable to use a numbered entity rather than named entity.
When using named entities, bear in mind that they are case-sensitive. Using the wrong case can produce an unintended result. Note the difference that an uppercase P can make:
′ produces ′
″ produces ″
When using the following codes, please let copy and paste be your friend.
© copyright
|
nonbreaking space
|
accented letters . copyright symbols . mathematical symbols . editorial symbols . arrows . currency symbols . more extended characters
| ← | left arrow | |
| ↑ | upwards arrow | |
| → | right arrow | |
| ↓ | downwards arrow | |
| ↔ | leftright arrow | |
| ↕ | updown arrow | |
| ↖ | northwest arrow | |
| ↗ | northeast arrow | |
| ↘ | southeast arrow | |
| ↙ | southwest arrow | |
| ⇐ | left double arrow | |
| ⇑ | upwards double arrow | |
| ⇒ | right double arrow | |
| ⇓ | downwards double arrow | |
| ⇔ | leftright double arrow | |
| ⇕ | updown double arrow | |
| ⇖ | northwest double arrow | |
| ⇗ | northeast double arrow | |
| ⇘ | southeast double arrow | |
| ⇙ | southwest double arrow
|
¬ not
more mathematical symbols . geometric shapes
|
$ dollar
the following are not displayed on older browsers: | ||
฿ | baht | |
₡ | colon | |
₢ | cruzeiro | |
₤ | lira | |
₦ | naira | |
₨ | rupee | |
₩ | won | |
₪ | shekel | |
₫ | dong | |
€ | euro | |
www.alanwood.net - more currency symbols
|
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
À uppercase grave A
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Ç uppercase cedilla C
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Ð uppercase ETH
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
È uppercase grave E
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Ĝ uppercase circumflex G
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Ì uppercase grave I
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
IJ uppercase IJ ligature
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Ñ uppercase tilde N
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Ò uppercase grave O
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Πuppercase OE ligature
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
ß sz ligature (German double S)
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Ţ uppercase caron T
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Ù uppercase grave U
A . C . D . E . G,H . I . IJ,K,L . N . O . OE,P,R . S . T . U . W,Y,Z
Ŵ uppercase circumflex W
|
character entities for the Greek alphabet
|
Several of the following when rendered show empty boxes, question marks, the character numbers rather than the characters themselves, or nothing at all. It is unadvisable to use these.
|
On some OS, an unsupported character may show up as a ? (question mark), a hollow square, or the actual coding for the entity might be displayed instead of the character itself. With the extended characters on this chart, it may be a good idea to use images rather than entities unless you know categorically that your viewers' OS support these character entities.
mathematical symbols . geometric shapes . Greek alphabet . card suits . more common extended characters
please note that these characters may not be displayed on some OS
′ prime, minutes, feet
|
other mathematical symbols . Greek alphabet . www.w3.org - more complete list
mathematical symbols . geometric shapes . Greek alphabet . card suits . more common extended characters
please note that these characters may not be displayed on some OS
• | filled bullet | |
■ | filled square | |
□ | hollow square | |
▣ | small filled square outlined | |
▪ | small filled square | |
▫ | small hollow square | |
▬ | filled rectangle | |
▭ | hollow rectangle | |
▮ | filled vertical rectangle | |
▯ | hollow vertical rectangle | |
▰ | filled parallelogram | |
▱ | hollow parallelogram | |
▲ | filled vertical triangle | |
△ | hollow vertical triangle | |
▴ | small filled vertical triangle | |
▵ | small hollow vertical triangle | |
▶ | filled triangle pointing right | |
▷ | hollow triangle pointing right | |
▸ | small filled triangle pointing right | |
▹ | small hollow triangle pointing right | |
► | filled pointer pointing right | |
▻ | hollow pointer pointing right | |
▼ | filled triangle pointing down | |
▽ | hollow triangle pointing down | |
▾ | small filled triangle pointing down | |
▿ | small hollow triangle pointing down | |
◀ | filled triangle pointing left | |
◁ | hollow triangle pointing left | |
◂ | small filled triangle pointing left | |
◃ | small hollow triangle pointing left | |
◄ | filled pointer pointing left | |
◅ | hollow pointer pointing left | |
◆ | filled diamond | |
◇ | hollow diamond | |
◈ | small filled diamond outlined | |
◉ | fisheye | |
○ | hollow circle | |
◌ | dotted circle | |
◎ | bullseye | |
● | filled circle | |
◐ | circle - left half filled | |
◑ | circle - right half filled | |
◒ | circle - lower half filled | |
◓ | circle - upper half filled | |
◔ | circle - upper right quarter filled | |
◕ | circle - upper left quarter hollow | |
◖ | left filled half circle | |
◗ | right filled half circle | |
◢ | filled lower right triangle | |
◣ | filled lower left triangle | |
◤ | filled upper left triangle | |
◥ | filled upper right triangle | |
◦ | hollow bullet | |
◧ | square left half filled | |
◨ | square right half filled | |
◩ | square upper left diagonal filled | |
◪ | square lower right diagonal filled | |
◫ | hollow square vertical bisecting line | |
◬ | hollow vertical triangle center dot | |
◭ | up-pointing triangle left half filled | |
◮ | up-pointing triangle right half filled |
geometric shapes . other mathematical symbols . Greek alphabet . Alan Wood's Unicode Resources - geometric shapes
mathematical symbols . geometric shapes . Greek alphabet . card suits . more common extended characters
For use in technical documents employing the occasional Greek character - please note that these characters may not be displayed on older browsers
Α uppercase Alpha
|
mathematical symbols . geometric shapes . Greek alphabet . card suits . more common extended characters
please note that these characters may not be displayed on older browsers
♠ spade suit
|
recommended for encoding . standard characters . extended characters (includes accented letters) . cautionary tale about extended characters . encoding examples
The following example shows how to encode some characters on an HTML page - note the extra space between "address" and the e-mail address itself. (the characters displayed with character entities are in bold).
HTML code using numbered entities for [e-mail address <person@IP.com>] with a mail link on the e-mail address:
e-mail address   <<a href="mailto:person@IP.com">person@IP@com</a>>
Here it is again using named entities. (The equivalent named entities for #046; and #064; are not supported by all OS.)
HTML code using named and numbered entities for [e-mail address <person@IP.com>] with a mail link on the e-mail address:
e-mail address <<a href="mailto:person@IP.com">person@IP.com</a>>
Here is another example using named character entities.
HTML code for [...¾ English & ¼ français]:
...¾ English & ¼ français
Here is another chart with named entities. Also of interest is HTML Special Characters and Browser Compatibility.
It may also be a good idea to identify (with a meta tag) what character system you are using in the head section of your page. For this page, I have placed the following just before </head>:
Edit October 2006:<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
(I do not know if characters other than accented letters will be rendered the same from OS to OS.)
Other charactersets can be found at www.w3.org - Internationalization page.
back to standard Characters for ASCII-art
to popup windows tutorial
© llizard 1998, 2000, 2001, 2003, 2004, 2005, 2006
(Yes, the above © symbol is displayed on this page by using the entity ©)
CWC reference pages . ASCII-art . illustrations and gif animations . llinks to ridiculously useless sites . home page