Learn HTML Easily - Part 2
page  Main   1   2   3

Here are some background images to save
- the page may take a few minutes to load,
but there's quite a good selection
Writing text:
    Referring back to Part 1 - Lesson 3 (making Page1.html), let's look at the code again -

<html>
<head>
<title>
Web Page 1 Title </title>
</head>
<body>
Web Page 1
</body>
</html>

- and get ready to do some more BODY writing, as soon as we've covered a few items.

    It's obviously quite easy to write "Hello, Mum" on the page (by simply writing this in the BODY section), but we need to further understand what happens when the browser reads this.

About ASCII / ANSI codes: (skip this bit if you already know it)
    Roughly speaking, ASCII (pronounced Askey) and ANSI (pronounced Ansey) codes are the same thing, so we'll use the name ASCII, if that's alright with you!
    Each character shown (and some NOT shown) has a reference number (an ASCII code number). Capital 'A' is 65 and lower-case 'a' is 97. Before you start worrying, there's NO NEED to know these. Just typing 'A' or 'a' is enough. However, due to a technical reason with the way that web pages are sent on the Net, characters with an ASCII code of more than 127 are sometimes kicked out. These are usually 'foreign' letters - French and German letters with accents, Esperanto characters etc.
    In 'Word' or similar, it's possible to write these letters directly into the text by using, for instance, Alt+0233 [holding down Alt, typing 0233 on the number pad, then releasing the Alt key] to produce é (as the ASCII Code for 'e acute' is 233).
    However, if you use the above methods in your web-page to mention, say, a friend called Hélène, you will see Hélène on your computer screen, but she will probably only see Hlne on hers, via the Net.
    "What's the answer?" you cry. Well, there are (at this level) two methods to choose from, both of which have the same 'shell'.

To use special characters:
    With tags (as we already know), the command has to be surrounded thus
<tag>. With Special Characters, the data is surrounded thus &data;
    The two ways of using these special characters are i) by "ASCII number", in the form
&#number; (it's therefore possible to write the word Cat by writing &#67;&#97;&#116; - the ASCII codes of the letters - but why should you, as they are all less than 128), and ii) by "Character name", in the form &CharacterName;

    i) The ASCII code for Character 233 (e acute) is put in thus &#233;

    ii) The "Character name" for e acute is, funnily enough, eacute (and Eacute for the upper-case letter), and is put in thus &eacute; or &Eacute;

Just one bit more before we go on to using this stuff on the next page:
    As well as foreign characters etc, various Command Characters cannot just be typed in. For example, if you wanted to use a less-than or greater-than bracket in your text, the browser would assume that you had written a Tag, so for the less-than bracket &lt; or &#60; is used, and for the greater-than bracket, &gt; or &#62;
    For Ampersand (&), we use &amp; or &#38;, which leaves us with the final character in this section - the Non-Break Space (or Hard Space) represented by &nbsp; or &#160;. For those who know about this (or don’t want to know about this), you may go onto the next page now.

The Non-Break Space (or Hard Space)
    Web browsers recognise SPACE (ASCII code 32) as a special character. They know that they can (usually) expand and compress these to make things fit. Also, to make writing web-pages easier, they have made it so that when the browser comes across more than one space together, it replaces them with just one space. Further, if no space is at the beginning of a continued line, the browser will insert one for you. It will also only generate an 'end of line' character when it comes across the command <br />.
The following pieces of red code generate the green text below.
The            
                         cat       sat


       on

the
mat
The cat sat on the mat

    This can be really useful, but sometimes it is just not suitable.

To have an indent, here is the code (in blue) of the line above.
&nbsp;&nbsp;&nbsp;&nbsp;This can be really useful, but sometimes it is just not suitable.<br />

    A Non-Break Space is also useful to put at the beginning of the title, in the HEAD section, as it stops the title being too close to the left-hand edge. Another use is to put one between Mr and Jones. This stops them being pulled wide apart, or Jones being moved to the next line during formatting.

    At last - finished, and so, on to the next page.
                 \|/ 
                (@ @)
     +----oOO----(_)-----------+
     |        Home made        |
     |        web pages        |
     |      are the best!      |
     +-----------------oOO-----+
               |__|__|  
                || ||
               ooO Ooo