Some very reserved characters

DIY Webmaster

DIY Webmaster

We've already looked at how Webmasters use meta tags to tuck away information in Web pages that software agents (or 'bots) can read - but which remain invisible to most visitors. Here's the opposite problem: how to make special accents and symbols appear within your pages. HTML has various "special characters", and by this we don't mean those people who sidle up to you at parties with three lines of Javascript or bore you with those really obscure tags at the back of Writing Web Pages for Dummies.

No, we mean those characters which HTML reserves as part of its mark-up language, but which you might want to include in the actual body of your document. Here's an example: you're doing a page about mathematical equations, or creating a HTML tutorial like this one, and you want to include a "" sign on the page.

The trouble is, as you'll guess if you've written a few Web pages using HTML tags, the "" signs are part of the markup instructions - for example to turn text bold they'd be part of the tag. Both "" provide special signals to the browser's rendering engine. They are two of the four specially "reserved" characters within HTML:

READ MORE

< (the less-than symbol); > (the greater-than symbol);

& (the ampersand); and ["] (double quotes).

So how do you stop the Web browser from interpreting these special symbols as parts of a tag when it "renders" the HTML code? You can get around the fact that they are reserved by using a series of other characters. becomes > < becomes <

& becomes &

["] becomes "

More recent browsers have no problem dealing with the double quotes, so from here on we'll ignore them. It's not too difficult to decipher the other three sets of characters: think of them as a bit like a sandwich, which kicks off with an ampersand or & (and now you know why it's also one of the four specially reserved characters) and ends with a semicolon. In the middle is the filling - a unique code to create the specific character.

In the above cases the codes are quite easy to remember, because they are short "mnemonic" names. In other words,

gt stands for "greater than" lt for "less than" amp for "ampersand"

A far more common problem is the accented characters that crop up in many languages, from umlauts (German) and fadas (Irish) to grave accents (French). To create them in your page is a bit like the way we've just done the special characters above.

Once again you sandwich them between an & sign and a semi-colon, and they are fairly easily remembered mnemonics. To get an umlaut, for example, type ü

Here's a specific example: how to get the word "cafe" in your page with the accent on the "e". In this case you'd type e in the appropriate place - for the whole word you'd type

cafe Here are some of the more common accents:

e

e e

a a

e e

u ü

c c

a â

Note that unlike the HTML code we've dealt with in the series so far, these are case sensitive - type Á to get A.

Another special character you might find useful is the copyright symbol or . Use ©

One of the most important "symbols", as it were, is a sort of invisible one - in the printing trade and desktop publishing it's often called fixed space. Supposing you wanted to do the following effect:

B I G S P A C E

It's no good simply hitting the spacebar a few times between the B I G and the S P A C E. Because this is HTML, the browser will regard all these spaces in a row as only one spacing unit (just as it ignores the RETURN key).

So you need to insert these "fixed spaces" - for each unit worth of space, type

(The mnemonic is, presumably, "NB it's SPace!"). To create the above effect, type:

B I G &Nbsp;&Nbsp; S P A C E

or even (for more space between the two words)

B I G     S P A C E

Besides the mnemonic system, there's another way of getting special characters. Every character on your keyboard should have something called an ASCII reference number. ASCII (pronounced "ass-key") stands for American Standard Code for Information Interchange. To create any character via HTML, type an ampersand (the & sign) followed by a hash sign (#), then the ASCII number, then a semicolon.

For example, to get a blob (or " ") symbol in your Web page, you would find out the ASCII number which gives a blob (in this case it's ASCII code number 149), then in your HTML you would type •

And how do you find out the ASCII codes? We don't have room to list them all here, but we've put a table of them on the Web site devoted to this series (go to http://jump.to/diyhtml).

And before you ask, there's no ASCII character - yet - for that squiggle which pop star Prince uses as his name. . .