HTML or HyperText Markup Language is the predominant markup language for web pages. HTML is written in the form of HTML elements consisting of tags.
Every web browser is capable of reading HTML, once it is received by the web browser, it is then read and translated into a form visible or audible to the user. The browser does not display the HTML tags, but uses the tags to interpret the content of the page.
With that said, learning HTML would then enable you to create web pages. Now what is a web page? An example of it is the one you are reading right now, this is a web page.
Note that there are many programs and platforms that enables you to create web pages, there's Adobe Dreamweaver, MS Front Page, MS Word, etc. Yes, even MS Word can create pages although this one is not recommended as it does not seem to follow W3C's standard.
Now, what is W3C? W3C stands for World Wide Web Consortium, it is an international community that develops open standards to ensure long-term growth of the web. As you can see, there are lot of web browsers that are currently being used. There's Windows Internet Explorer, Mozilla Firefox, Opera, Google Chrome, Safari, etc. and each of these web browsers interpret HTML differently, and if your markup language doesn't follow standard writing, it may appear good on one web browser, but won't appear correctly on another. Thus, W3C maintains a standard that should be follow so to enable your language to work correctly on all browsers. As previously said, there are many programs and platforms that could generate a hypertext markup language for you automatically, but as for us... let's use the Notepad or Wordpad. You can find these programs under Accessories if you are using Windows OS. Anyway, just use any program that could save text as HTML.
Let's begin...
The HTML opens with the tag HTML Note that the tag should always be enclose within the < and > container. See below:
<HTML> or it can also appear in small letters <html>
Also note that when you open a tag, it also needs to be close. The closing tag begins with a slash. For example for <HTML>, the closing tag should be </HTML> or </html>. However, the closing tag for HTML should need to be always found at the very end of the page as other HTML tags should need to be contained within the HTML element.
HTML should always be the first and the last tag to appear. It marks the beginning and the termination of the HTML code.
The other tag to follow HTML is the <head>. The head has several elements contained therein. And since this is the basics, let's get acquainted with the <title>.
The <title> is the title of the page. The word or texts contained in between the open and closing title tag will appear as the title of the page. For example, <title>Phantom Maelstrom</title>, this will create a web page with the title Phantom Maelstrom.
After closing the title tag, proceed by closing the head tag with a </head>. The codes should appear like this:
<html>
<head>
<title>Phantom Maelstrom</title>
</head>
</html>
<head>
<title>Phantom Maelstrom</title>
</head>
</html>
The result of this code would be...
You see? Now the page has a Phantom Maelstrom title when opened on a browser.
Now let's proceed to the body or the <body> tag.
The body tag contains the body of a page. This displays the contents. The body tag follows the closing head tag and ends before the closing html tag. It has many elements to employ, but let's start with the simplest of them all. The paragraph tag or <p> tag.
The <p> tag is contained within the body tags. The tag is use to display texts or a paragraph if it's comprising of sentences. The texts should be contained within the open p and closing p tag. For example, I want to display a text with the message "Hello World".
The code looks like...
<html>
<head>
<title>Phantom Maelstrom</title>
</head>
<body>
<p>Hello World</p>
</body>
</html>
<head>
<title>Phantom Maelstrom</title>
</head>
<body>
<p>Hello World</p>
</body>
</html>
It would come out as...
So there you have it... The basics! Now go ahead and try it. Write these codes in a Notepad then save it as htm or html. For example phantommaelstrom.htm or phantommaelstrom.html, where phantommaelstrom is the file name, and htm and html is the extension name. This will tell your computer that these files should be opened in a web browser ie. Internet Explorer, Firefox, etc.
If you have questions, feel free to drop me a comment... next tutorial would be about how to color the background of the page. Stay tuned...
Related
Basic HTML Tutorial: Background Colors
No comments:
Post a Comment