Return to Home Page
This class is for HTML and CSS. HTML is an acronym for HyperText Markup Language. CSS is an acronym for Cascading Style Sheets.
I am not going to attempt a detailed explanation of what HTML is. If you want a detailed explanation of what HTML is, you should view the W3 Schools HTML Tutorial. Similarly, I am not going to attempt a detailed explanation of what CSS is. If you want a detailed explanation of CSS, then you should go to the W3 Schools CSS Tutorial. What I do propose to do is to give you a quick and dirty practical course on creating your own Web Pages. Once you get the hang of doing this, you can study the finer points to your hearts content.
Return to Table of Contents
Return to Home Page
HTML, or HyperText Markup Language, is the language of The World Wide Web. If you view a Website, using a Web Browser such as: Internet Explorer, Netscape or Mozilla Firefox, you will actually be viewing a collection of HTML documents.
The W3 Schools HTML Tutorial will give you a detailed explanation of what HTML is and what it does. For the time being however, taking advantage of the proverb, which says that a picture is worth a thousand words, here is a sample HTML document:
So, now that you have seen what a Web Page looks like you are probably wondering: "Well what, exactly, am I supposed to do with that?" You didn't know I was a mind reader, did you dear reader? So, this is what you do:
Hey Presto! You have now created your very first Web Page!
Return to Table of Contents
Return to Home Page
CSS, or Cascading Style Sheets, is a mechanism, which can be used for adding formatting information to an HTML document. The thing that makes CSS especially powerful is that one can either include the CSS instructions within the body of one's HTML file, or one can place all of one's CSS instructions in a separate CSS file, which all of one's HTML pages can link to. This second option is powerful because, if all of one's Web Pages use the same CSS file, one can maintain a similar look and feel throughout the entire Website. Better still, if one alters just one single CSS file one can amend the format of very single Web Page which refers to it. If your Website contains 100 separate Web Pages you can amend every single one of those Web Pages with a single one line amendment to the CSS file they all reference. I am not going to say too much about this now. Once you start working through the practical examples on this course you will see this feature in action
Here, below: is a sample HTML document in which there is a CSS section. The CSS section is used to define a class and that class is used in order to format a section of the document. I will not say too much at this point, about what I mean by a class. Let's see it in action? Once we have done that, we can debate what it is, what it does and even, if you wish, what it means. This is a practical course. We will learn by doing fist. We learn the finer points later.
Return to Table of Contents
Return to Home Page
In order to link between one HTML file and another you need to use the HTML anchor tag. An anchor tag looks like this: "<a>".
Anchor tags are generally used in pairs in order to define a link. There is the start tag, which looks like this:
<a href="FileName.html">
And there is the end tag, which looks like this:
</a>
The two tags are used together as shown in the following sample piece of HTML code:
When the above code is inserted into an HTML file, it creates a link such as the following:
To view the Web Hosting information please click here: Open Web Hosting File.
As you will see, if you click on the above Link, clicking on it takes you to a file name "Web_Hosting.html". As you will have noticed from the HTML code sample, copied out above, the filename "Web_Hosting.html" is the filename that was quoted as the href parameter to the opening anchor command.
If the above is as clear as mud, please experiment with putting anchor tags in two separate HTML files. Name one file TestFile1.html and the other file TestFile2.html.
In the body section of the file named TestFile1.html place the following HTML code.
In the body section of the file named TestFile2.html place the following HTML code.
If you open TestFile1.html, using Internet Explorer, you should be able to click on the link to Test File 2 and go to Test File 2. Once Test File 2 has been displayed, you should be able to click on the link to Test File 1 in order to go back to Test File 1.
Once you have experimented with these techniques for a while you should soon get the hang of them.
Return To: Table of Contents
Return To: Home Page
In order to display an image, one uses the image tag. In its simplest form, the image tag looks like this:
<img src="Picture.jpg">
The above code will insert an image, contained in a file named Picture.jpg, at the current point in the web page defined by the HTML document in which it appears. Unlike other HTML tags, the image tag does not need an end tag.
Return To: Table of Contents
Return To: Home Page