This part of the website aims to take you on a journey of discovery by introducing structure to our web pages through (X)HTML. We will start with the basics, introduce some more detailed concepts in the intermediate tutorials before going into some advanced techniques. Each part is cross referenced and complemented by the reference section for HTML5.
In this lesson we gather the tools required to create our first HTML page and make a folder to store our HTML Basic practical files in. We do our first practical and view the results in a default web browser. You'll be amazed how easy it is to get going with HTML, try it and see.
The Basic Tools
All we need to get going is a basic text editor such as Notepad for windows. So for instance using Windows XP:
click Start>>All Programs>>Accessories>>Notepad
Creating A Folder For Our HTML Basic Files
Let's create a folder for our HTML basic lessons
double click My Computer icon
double click C:\ drive (or whatever your local drive is)
right click the mouse in the window
from the drop down menu Select New
click the Folder option and call the folder _HTMLBasics and press enter.
Saving Our First File
Ok, with Notepad or a similar text editor open, type in :-
We just wrote a web page
Click file from the toolbar and then click the save option.
In the Save in: tab at the top make sure you are pointing to the _HTMLBasics folder we created above.
In the File name: text area type lesson_1_webpage.html and then click the Save button and close the Notepad.
The .html file extension lets the system know that this is a hypertext document, you must save the file with this extension to view the document in your default web browser. If you do not save the file with the .html file extension Notepad and other text editors save the file with the .txt file extension. This will stop you viewing the file in a web browser.
Viewing Our Saved File
From the C:\_HTMLBasics folder, double click on the saved file and it will appear in your default web browser and look something like the following image.
Lesson 1 Complete
That's it! We have just created our first HTML, pretty simple eh?
In the next lesson we learn the syntax behind a HTML tag, by explaining start and end tags, tag attributes and some of the terminology commonly used. After this we take a quick tour on the basic structure of a HTML document. The lesson ends with a second practical where we add some HTML tags to the file we created in Lesson 1 and compare the results.