Learn HTML: Basic Procedure For Building HTML Documents

Dec 17
08:42

2008

Tim Whiston

Tim Whiston

  • Share this article on Facebook
  • Share this article on Twitter
  • Share this article on Linkedin

This article will walk you through the process of building your own basic HTML documents with ease.

mediaimage

While there are many languages and codes that can be used to build Web pages,Learn HTML: Basic Procedure For Building HTML Documents Articles HTML is the simplest, easiest to learn and most commonly used. Get a brief intro to HTML here.

This article will give you a very quick overview on how to build an HTML document from the ground up.

The first thing you'll need is some type of editing application. Be aware that you can use notepad or any other text editor to write/edit HTML docs; simply enter your code and then save as .html when you're done. However notepad and other apps are obviously pretty limited in terms of user benefits. I recommend the 1st Page device from http://EvrSoft.com as a good free HTML editor to start with.

You should avoid using any WYSIWYG "wizards" and really learn to work with the actual code. If you're not willing to do this I urge you to just hire a pro to build your sites for you. The fact is software that builds the code for you does a slop job and your end result will be less than quality.

Once you have an editor open and ready, you'll enter this line at the top of the blank document:

This is your document declaration, and it essentially explains to a browser what kind of info is about to be relayed. Don't overthink this part, just lay it down.

Next, you'll need to open your HTML with this tag:

I recommend you also go ahead and scroll down the page, then add your closing tag as well:

What you have done here is define for browsing software like Internet Explorer where to find the instructions and format rules for the Web page being read/displayed. As you probably know, browsing software is used to interpret Web documents onto our monitors in a way our eyes and brains can register, so it's your job as Web designer to help the browser.

Everything you enter from here forward will go between your opening and closing tags. And your HTML doc will consist of two primary parts: the head and the body.

The head area contains such data as your page title, keyword and description tags, perhaps a few CSS parameters, and any specifications that need to be made in terms of dynamic scripts or software to be applied to the page that follows. You will open and close your head as follows:

Enter relevant tags and data here. For example:

Page Title Here

(above line explains where browser will find external style sheet for CSS Info)

Also enter META tags and any javascript info if applicable.

The body area of your document contains all of the publicly visible content. Here is where you'll add your foreground and background, tables and columns, menus, images, page content, and all the many things that make up a great Web page.

You'll open and close the body the same as any other tag:

All of the tags, attributes, and elements that make up your Web page go here.

This brief article has given you a solid overview of how to set up your own HTML documents. Your next obvious step is to study the actual tags and attributes for populating the head and body of your page document.

One simple way to learn this is to visit your favorite simple Web pages and use the "View Source" function of your browser. This can be executed by right clicking your mouse anywhere on a page (other than over an image or link) and choosing the view source option; also many browsers have a view source tab on the toolbar.. When you open the source for a page you'll see a notepad document that displays all the HTML and other code for the Web page.

Just start playing around with some of the tags and code you find. A lot of this will be common sense, and you might just pick up the basics on the fly.