OK, it is now time to start actually creating a webpage. In this lesson, I am going to introduce you to HTML. In the following lessons, we will get into specific areas of HTML.
HTML stands for Hyper Text Markup Language. An HTML file is just a text file which contains small “markup tags”. A markup tag is a small little bunch of text which tells the web browser how to display things on a website. And HTML file must have an HTM or HTML file extension, and that file can be created in any simple text editor. HTML is NOT a programming language.
[hidepost=1]
In this and the next several lessons, I am going to show you the actual HTML code and how to create it by hand. You can use a WYSIWYG editor to create HTML pages much quicker, but I am a firm believer that true understanding of this subject requires the ability to manually create HTML. The subject is not complicated at all, as you will soon find out.
Create Your First Basic Webpage
Let us now create our first basic webpage. If running Windows, open up Notepad. If running OS X, open up TextEdit or SimpleText. Now, type in the following:
<head>
<title>Title of page</title>
</head>
<body>
This is my first webpage. <b>This text is bold</b>
</body>
</html>
Now, save this file as “mypage.htm”. Now, open up your file manager (Explorer in Windows, Finder in OS X), navigate to the directory you just saved mypage.htm, and double-click that file. You will then open up this new web page in your web browser. Now, this file is currently on your hard drive and that means nobody can access it besides you. The moment you upload this file to your web server, it would become accessible via the Internet.
Structure of The Document
Let’s go over the above example. This illustrates the basic structure of any HTML document.
The first tag in your document is <html>. This tells the browser that this is the beginning of a new HTML document. Note that the last tag of the document is </html>. All HTML tags must be closed, telling the browser that any particular HTML tag is no longer in effect. You will notice that all HTML tags in this document are first opened then closed using the same exact tag, but with a backslash.
The header section of an HTML document is between the <head> and </head> tags. In our above example, the only information in our header is the title of the document, referred to as the TITLE tag. Anything placed in the TITLE tag will appear in the title bar of your web browser’s window. In the above example, you will notice that “Title of page” appears in the title bar of your browser.
The text between <body> and </body> is the part of the webpage which is visible to a viewer. This is the only part of the document which is visible in the web browser.
The <b> and </b> tags are included here to illustrate a simple BOLD. Anything surrounded by <b> and </b> will show up as bold text.
Below is a video where I will show you how to create a simple HTML document and upload it to the web server.
[flv:http://pcmech.s3.amazonaws.com/introhtml/Intro_HTML.flv 610 458]
[/hidepost]
Like what you read?
If so, please join over 28,000 people who receive our exclusive weekly newsletter and computer tips, and get FREE COPIES of 5 eBooks we created, as our gift to you for subscribing. Just enter your name and email below:
