How to use HTML Entities | Complete list of HTML entities | HTML KICK

HTML-Entities

How to use HTML entities

Character entities allow users to include characters that cannot be entered using a keyboard or those that are reserved in the HTML language. The table below shows commonly used entities and the characters they represent.

ResultDescriptionEntity NameNumerical reference
non-breaking space  
<less than&lt;&#60;
>greater than&gt;&#62;
&ampersand&amp;&#38;
quotation mark&quot;&#34;
apostrophe&apos;&#39;
?cent&cent;&#162;
?pound&pound;&#163;
?yen&yen;&#165;
?euro&euro;&#8364;
?copyright&copy;&#169;
?registered trademark&reg;&#174;
?trademark&trade;&#8482;

It is better to use the numerical references instead of entity names because of compatibility issues. Also note that entities are case sensitive.

Entities are used to implement reserved characters or to express characters that cannot easily be entered with the keyboard.

ISO-8859-1 is the default character set in most browsers.

The first 128 characters of ISO-8859-1 is the original ASCII character-set (the numbers from 0-9, the uppercase and lowercase English alphabet, and some special characters).

The higher part of ISO-8859-1 (codes from 160-255) contains the characters used in Western European countries and some commonly used special characters.

The HTML Symbol Entities include mathematical symbols, Greek characters, various arrows, technical symbols and shapes.

It is worth noting that Entity Names are case sensitive.

Notation of Entities:

A character entity reference consists of an ampersand (&), followed by a pound sign (#), the number of the character entity, and finishing with a semi-colon (;). Alternately, for some characters you can put ampersand, the name of the character (but no # sign), followed by a semi-colon.

Areas of Entities:

There are various categories, where HTML Entities are used:

  • Entities for mathematical and technical characters (including Greek) i.e. ?
  • Entities for punctuation characters i.e. ?
  • Entities for accented characters, accents, and other diacritics from Western European Languages i.e. ?
  • Entities for characters with special meaning in HTML. i.e. &
  • Entities for shapes and arrows i.e. ->

What is Elements in HTML5?

Entity Names

Entity names use letters to specify which entity to use.

So?&copy;?is an example of using the entity name.

However, not all Unicode characters have a corresponding entity name (as you can see in the above list). However, all Unicode characters are assigned a hexadecimal number which is unique to that character. So if you don’t see an entity name for a character, use the hexadecimal or decimal value instead.

Numeric Character References

You can also use numeric character references to write character entities (as seen by the examples above).

Numeric character references include a hash (#) after the ampersand, followed by some numbers, and ending with a semicolon (;).

Numeric character references can be defined with either a decimal or hexadecimal value. The numeric character reference for the copyright symbol is?&#169;?(decimal) and?&#xA9;?(hexadecimal).

When to use HTML entities?

Generally, you don’t need to use HTML entities if your editor supports Unicode. For some instances, entities can be useful:

  • Your editor does not support Unicode.
  • Your keyboard does not support the character you would like to type, such as em-dash or the copyright symbol.
  • You want specific HTML-specific characters like?<,?&, or?".

Useful HTML entities

&nbsp;?- non-breaking space

&lt;?- less than sign

&gt;?- greater than sign

&amp;?- ampersand (&)

&quot;?- double quotation mark

&apos;?- single quotation mark

&cent;?- cent sign

&pound;?- pound sign

&yen;?- yen sign

&euro;?- euro sign

&copy;?- copyright

&reg;?- registered trademark

Non-breaking Space

A commonly used entity in HTML is the non-breaking space:?&nbsp;

A non-breaking space is a space that will not break into a new line.

Two words separated by a non-breaking space will stick together (not break into a new line). This is handy when breaking the words might be disruptive.

Examples:

  • 10
  • 10 km/h
  • 10 PM

Another common use of the non-breaking space is to prevent browsers from truncating spaces in HTML pages.

If you write 10 spaces in your text, the browser will remove 9 of them. To add real spaces to your text, you can use the &nbsp; character entity.

Advantage of using an entity name: An entity name is easy to remember.
Disadvantage of using an entity name:?Browsers may not support all entity names, but the support for entity numbers is good.

Terry White

Terry White is a professional Drupal & WordPress developer, Web developer, Web designer, Software Engineer, and Blogger. He strives for pixel-perfect design, clean robust code, and a user-friendly interface. If you have a project in mind and like his work, feel free to contact him

View all posts by Terry White →