Web Development

Special Characters in HTML

Special Characters in HTML is the section 15 of Beginner’s Guide to HTML.

If you want to place < or > characters on your HTML page how would you do that? Go on, try to simply type it there. Seems not like an easy task, isn’t it? If you can remember < and > characters are used to define tags in the HTML. So you wouldn’t be able to type it there because browser will try to process it like a start of an element and will get confused and mess everything up. So reserved characters in HTML must be replaced with something called character entities.

Entities

Entity syntax is like follows. It can be presented in two ways. Either by a name or a number.

&entity_name;OR&#entity_number;

We suggest you to use the name because it is easier to remember. But the thing is numbers are supported by almost all browsers. Keep in mind that entity names are case sensitive. Following are the most commonly used entities.

< less than <
> greater than &gt;
& ampersand &amp;
© copyright &copy;

Following code snippet tells you how to use them in name syntax. Number syntax follows the same way.

[code language=”html”]

Copyright &amp;amp;copy; Let’s Design &amp;amp;amp; Develop

5 &amp;amp;gt; 2

[/code]
Copyright © Let’s Design & Develop5 > 2

Non breaking space

When you try to type more than one space, browser will not display all of them. It will only show a one space. Trick is to use the non breaking space entity. It is widely used entity in creating web pages to enter additional spaces. The syntax is &nbsp;

Diacritical Marks

Diacritical Mark is a glyph added to a letter. Some diacritical marks, like grave (  ̀  ) and acute (  ́  ) are called accents. Diacritical marks can appear both above and below a letter, inside a letter, and between two letters. Diacritical marks can be used in combination with alphanumeric characters, to produce a character that is not present in the character set (encoding) used in the page. The thing is, to represent these marks, you have to use the number.

Following are few diacritical marks.

 Õ               ã               ê              

Symbol Entities

HTML symbols are like mathematical operators, arrows, technical symbols and shapes, are not presented on a normal keyboard. Following are few examples of each.

Mathematical Symbols

&forall; FOR ALL
&sum; N-ARY SUMMATION
&prod; N-ARY PRODUCT

Greek Letters

Δ &Delta; GREEK CAPITAL LETTER DELTA
Γ &Gamma; GREEK CAPITAL LETTER GAMMA

Common Symbols

&larr; LEFTWARDS ARROW
&clubs; BLACK CLUB SUIT
&trade; TRADEMARK
&euro; EURO SIGN

Other important topic we cover in this section is Character Set.

Character Set

To display an HTML page correctly, a web browser must know what character set to use. So what does it mean by character set? We also called it as the charset or character encoding.

ASCII was the first character encoding standard. It defines 127 different alphanumeric characters that could be used on the internet. ASCII supported numbers (0-9), English letters (A-Z), and some special characters like ! $ + – ( ) @ < > .

ANSI (Windows-1252) was the default character set for Windows (up to Windows 95). It supported 256 different codes.

ISO-8859-1, an extension to ASCII, was the default character set for HTML 4. It also supported 256 different codes.

Because ANSI and ISO was too limited, the default character encoding was changed to Unicode (UTF-8) in HTML5. Unicode covers almost all the characters and symbols in the world.

To display an HTML page correctly, a web browser must know the character set used in the page.

This is specified in the tag. Can you remember it. We talked about it in a previous section HTML Head.

[code language=”html”]


[/code]

Let’s go deep in each encoding standards.

ASCII

ASCII uses the values from 0 to 31 (and 127) for control characters.
ASCII uses the values from 32 to 126 for letters, digits, and symbols.
ASCII does not use the values from 128 to 255.

ANSI

ANSI is identical to ASCII for the values from 0 to 127.
ANSI has a proprietary set of characters for the values from 128 to 159.
ANSI is identical to UTF-8 for the values from 160 to 255.

ISO-8859-1

8859-1 is identical to ASCII for the values from 0 to 127.
8859-1 does not use the values from 128 to 159.
8859-1 is identical to UTF-8 for the values from 160 to 255.

UTF-8

UTF-8 is identical to ASCII for the values from 0 to 127.
UTF-8 does not use the values from 128 to 159.
UTF-8 is identical to both ANSI and 8859-1 for the values from 160 to 255.
UTF-8 continues from the value 256 with more than 10.000 different characters.

 


So in this section we learned that we cannot type every character just with pressing the keyboard in HTML. We need to use entities. Also we covered several character sets used in several HTML versions. In the next section we are going to learn about URLs.

WHAT’S NEXT?

Let’s findout more about URLs in HTML.

Join Our Newsletter Today

Stay updated with all latest updates.
Give it a try, you can unsubscribe anytime.
Subscribe
SUBSCRIBE NOW

About the author

Sandeep Likhar

Sandeep Likhar from Indore India, Blogger, eBook Designer and Founder of LetsDnD. Having five years of experience in industry as a Digital Publishing Expert and eBook Converter providing services to Authors, Publishers and distributors worldwide. Proficient in converting books into various formats HTML, epub, mobi, word, PDF including all major online platforms iTunes, Kobo, Kindle, Createspace, B&N, Smashwords and more.

Leave a Reply

12 Comments on "Special Characters in HTML"

Notify of
avatar
Sort by:   newest | oldest | most voted
Gilda Stearns
Guest

Hi colleagues, its great post about educationand
completely defined, keep it up all the time.

Josie
Guest

I used to be recommended this blog through my cousin. I am no longer certain whether this post is written by
means of him as no one else recognise such particular approximately my trouble.
You’re incredible! Thank you!

Kaylene
Guest

Great article! We will be linking to this great article on our site.
Keep up the great writing.

Retha
Guest

If some one wants to be updated with hottest technologies then he must be pay a quick visit this web site and be up to date everyday.

Tonia Magnus
Guest

We absolutely love your blog and find the majority of your post’s
to be just what I’m looking for. Would you offer guest writers to write content for you?
I wouldn’t mind publishing a post or elaborating on some of the subjects you write related to
here. Again, awesome site!

Mikayla Starling
Guest

Wonderful post! We are linking to this particularly great content on our site.
Keep up the great writing.

Mozelle
Guest

Hello, I check your blogs regularly. Your story-telling style is awesome, keep up the good work!

Tegan
Guest

whoah this weblog is fantastic i love reading your posts.

Stay up the great work! You know, a lot of people are hunting around for
this info, you can help them greatly.

Austin
Guest

I like the helpful info you provide in your articles.
I will bookmark your weblog and check again here regularly.
I’m quite sure I’ll learn a lot of new stuff right here!
Best of luck for the next!

Teodoro
Guest

Very great post. I just stumbled upon your blog and wished
to mention that I have truly loved surfing around your blog posts.

In any case I will be subscribing to your rss feed and I’m hoping you write
once more soon!

Francesca
Guest

Hi! I could have sworn I’ve visited this blog before but after
going through a few of the articles I realized it’s new to me.
Regardless, I’m definitely delighted I stumbled upon it and I’ll be
book-marking it and checking back regularly!

Roxanna
Guest

I have read so many posts about the blogger lovers except this article is truly a
nice post, keep it up.

wpDiscuz
DON’T MISS OUT!
Subscribe To Newsletter
Be the first to get latest updates and exclusive content straight to your email inbox.
Stay Updated
Give it a try, you can unsubscribe anytime.

Join Our Newsletter Today

Stay updated with all latest updates.
Give it a try, you can unsubscribe anytime.
Subscribe
SUBSCRIBE NOW