An HTML webpage is simply a text file with .htm or .html file extension. You can create an HTML page using any text editor such as Notepad for Windows user or Vi for Linux user or even more Advance web authoring tool such as Microsoft FrontPage and Dreamweaver. I will strongly advice you learn HTML using a text editor, because most web authoring tools will provide you with so much support that you may end up considering writing HTML tag a old-fashioned way of creating a webpage, because you will surely fall in love with the charming and easy to use WYSIWYG features of this tools, folks must have also told you this, but I bet you will be trapped someday unless you are not thinking of becoming a professional in this field of web development; so I’ll advise you to humble yourself and learn the simple tags of HTML very well, so as to have a strong web foundation.
By the way
WYSIWYG: acronym for What You See Is What You Get, It a feature of powerful web authoring software that allows a web designer to view a webpage as it will appear in the web browser, and to directly edit the text, graphics, or other elements within that view without coding HTML.
The exercise we had in the preface shows us how to create an HTML page, so let’s explain what the HTML code does in more detail.
Welcome.htm
<HTML>
<HEAD>
<TITLE> Website title here </TITLE>
</HEAD>
<BODY>
Website content here
</BODY>
</HTML>
The code above is just a skeletal look of an HTML webpage. Before we explain the HTML tag of the page above, we need to understand some HTML rules.
Firstly: The HTML tag are place inside the less-than (open angle bracket) “<” and greater-that (close angle bracket) “>” signs. For example <HTML>, <HEAD>, <TITLE>, <BODY> and so on.
Secondly: “Almost” all the tags come in pairs, that is the opening and the closing tag, which are similar except that the closing tag contains a forward-slash.
For Example <BODY> </BODY>
Thirdly: Many tags provide variety of options or attributes that redefine its functions or how it can be use, for example to display of text or image.
For example <FONT SIZE=”10”>Text may be bigger </FONT>
Fourthly: you can include (nest) one pair of tags within another pair but you must make sure that you close the inner nested tag in the same order they are open.
For example: <FONT SIZE=”7”> <B> Text may be bigger </B> </FONT>
<B> is nested inside <FONT>, therefore you must close </B> first
Finally: Every HTML tag must conform to w3c HTML standard (The body that is create and manages a lot internet standard, including HTML, CSS, XML and many others), this means that you must learn and use correctly the HTML tags, because they all means something to the web-browser. That why you are not expected to put just anything inside the “<” and “>” sign and expect wonder. (Beside it’s the tags we are learning how to use here)
Now that we are clear, I believe we can move on to explaining the code above line-by-line. We start with the HTML opening tag <HTML> and ended page with the pair of the HTML closing tag </HTML>
Now inside the <HTML> and </HTML> we will basically have two main tag sections:
HEAD tag <HEAD> </HEAD>
and
BODY <BODY> </BODY> tag.
By the way
Your HTML opening and closing tag <HTML></HTML> can be place on the same or on different lines as we did; it makes no difference; as far as you can read and understand your code; for example
<TITLE>Website title here</ TITLE>
Is same as:
<TITLE>
Website content here
</TITLE>
The HEAD tag section now contains the TITLE tag <TITLE></TITLE>
<HEAD>
< TITLE> Website title here </ TITLE>
</HEAD>
Notice: I purposely push (indent) the TITLE tag inside a little, for you to understand that it is actually inside our under the HEAD tag, this is for easy readability of the code. Expect more of this indenting style in later programs in this book.
The TITLE is probably one of the visible tags in the HEAD you will be see when you preview your webpage in a browser.
