From Scratch Web Games: A Beginners Guide to Game Development using HTML, CSS, and JavaScript

Chapter 2.5: Special Symbols

Tags are simple enough, but the fact that they start with a < and end with a > is a bit of a problem. Namely, what do you do when you need to use a < or a > sign in your document. Anybody who has looked at my cheat sheet can see that it is choked full of both these symbols, so what is the trick to adding these symbols to a document?

In other programming languages, there are sequences of characters known as escape codes. The W3C uses something called named character references. These codes start with the & symbol, are followed by a shorthand description of the symbol such as an acronym or abbreviation, and ends with a semicolon (;). So, for the less-than symbol, we would use &lt; and for greater-than we would use &gt; solving the tag problem.

This leads to a new problem as to how to have an ampersand symbol, and that is simply to use &amp;. There are many different special symbols, with some of my favourites being in the table below.

The codes shown are a very small subset of the named character codes. A complete list of these codes can be found at https://html.spec.whatwg.org/#named-character-references which is part of the specifications for HTML.

There are more than just the named codes. In the table you will notice that I listed a Unicode value. Unicode is the method we are currently using for encoding the value of symbols. Computers can only understand numbers (technically, it is high-low voltages used to represent the binary digits 1 and 0 but we will hold out on number systems until a later chapter). To represent symbols, computers assign each symbol to a number, with there being many ways of encoding the symbols. Unicode has become the current standard. Unicode numbers can be used in place of a named character code by using &#unicode; with Unicode being the value to us. For example, &#9829; will draw a heart suit symbol (♥).

Most of the Unicode tables that are available, do not use decimal numbers but instead use a different number system known as hexadecimal to represent the numbers. Hexadecimal is base 16 so uses the letters A through F in addition to the digits and allows for more compact numbers. We will take a closer look at hexadecimal later. It also has the advantage that it maps more directly to binary numbers, which can be important for low-level programming. You do not need to convert from hexadecimal to decimal to use these values, but can instead use &#x…; with the x indicating that you will be using a hexadecimal value instead of a decimal value for the code.