HTML Text Basics - Lesson 1

HTML is one of the most common computer languages, and also one of the easiest to learn. HTML stands for Hyper Text Markup Language, and is a text file, that contains various markup tags, which are the things that tell the browser what to show. HTML files always end with either .html or .htm, and can be made with any text editor, such as Notepad.

Since you are just starting out, I'm not going to throw lots of tags in to confuse you, so we'll start with the very basics. The tag that must be always be present in an HTML file is the HTML tag. The tag will be at the beginning and the end of the file, and all other tags will go within the HTML tags.

To write the HTML tag, simply put the following in your text editor:

<html>

This signifies the start of your HTML document. It can either be in upper case or lower case. To close this tag, enter the following on a seperate line below:

</html>

The forward slash represents the closure of the tag. We are going to enter some text that will show up in the browser window. There are different ways of doing this. You could simply enter your text in between these two tags, but the standard way is more organised. The body tag holds all the text in the body of the browser, so enter open and closed body tags, as you did with the HTML tags, put enter them between the two HTML tags. Your text file should now look something like this:

<html>
<body>
</body>
</html>

If you open the file in your browser, you will see a blank page at this point, so now we will add some text. Enter any text in between the two body tags, like so:

<html>
<body>
Your text
</body>
</html>

Now you will see that the text you entered is displayed in the browser at the top left. This is the most basic thing you can do with HTML, so we're going to add some different variations of text. To bold the text, first, add some more text saying "Bold text"

<html>
<body>
Your text.
Bold text.
</body>
</html>

If you enter the text as I did above, and then preview in a browser (preview it by double clicking your HTML file) you will notice that all the text is displayed on the same line, even though you put it on a line beneath the initial text. This is because of the way HTML is formatted. There is a way to make the text go on a seperate line, but you don't need to worry about that at the moment.

So back to bold text, enter it on the same line as the previous text, as follows:

<html>
<body>
Your text. Bold text.
</body>
</html>

Now, to bold the text, you need to add the open and closed bold tags, which are simply tags. Add the tags to your text, as follows:

<html>
<body>
Your text. Bold text.
</body>
</html>

Now if you open the HTML file in your browser, the second line of text will be bold. There are other forms of text manipulation, including italics and underline, which are and tags, respecitvely. Using these tags, you can change your HTML file to include them:

<html>
<body>
Your text. Bold text. Underline Text Italicized Text
</body>
</html>

You may notice it's starting to get a little unorganised, so we can use the line break to show each sentence on different lines. The tag is used for this. If you add the at the end of each line, the next text that is entered will be shown on next line down. To implement this, follow the below example:

<html>
<body>
Your text. 
Bold text. 
Underline Text 
Italicized Text 
</body>
</html>

Not only is your code more organized, but so is the text when you preview it. These are the basics of changing text in HTML, and there are so many different tags to make your HTML page more complex.