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 < and for greater-than we would use > solving the tag problem.

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

Symbol | HTML | Unicode | Description | Symbol | HTML | Unicode | Description | |
---|---|---|---|---|---|---|---|---|

< | < | 60 | Less than | ← | ← | 8592 | Left arrow | |

> | > | 62 | Greater than | → | → | 8594 | Right arrow | |

& | & | 38 | Ampersand | ↑ | ↑ | 8593 | Up arrow | |

© | © | 169 | Copyright | ↓ | ↓ | 8595 | Down arrow | |

® | ® | 174 | Registered Trademark | ♣ | ♣ | 9827 | Club suit | |

™ | ™ | 8482 | Trademark | ♦ | ♦ | 9830 | Diamond suit | |

≠ | ≠ | 8800 | Not equals | ♥ | ♥ | 9829 | Heart suit | |

∞ | ∞ | 8734 | infinity | ♠ | ♠ | 9824 | Spade suit |

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, ♥ 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.

The cheat sheet for this chapter.

A brief history of HTML

What makes up a HTML file

How tags are used to create HTML elements

How to display things such as <, >, &, 😀

Linking to other pages, other sites, and within the page

Adding images and image maps to your page.

Ordered and unordered lists and nesting lists.

Tables with spanning rows and columns.

The game of NIM is the project for this chapter.

How my solution to the NIM game was put together

Solving Nim.