Basic HTML Tutorial

Is HTML Coding new to you? This basic HTML tutorial provides a simple overview of HTML and its importance.

Even though HTML coding may seem overwhelming at first, believe us, it's not as complicated as it looks!

The easiest way to learn HTML, is to look at a web page that is already designed. To view the HTML coding on this page, select "View" on your browser, click "Page Source", and then read through the HTML information below to find out more...

What Is HTML Coding?

Hyper Test Markup Language, or HTML coding, is the "Hyper Text Markup Language" that's used to build online content. The most common HTML documents are web pages, which are made up of markup tags (a.k.a. HTML tags) that describe the overall structure, lay out, and presentation of the page. Most importantly, these tags are what web browsers use to interpret ANY content online.

HTML Tags

Also known as markup tags, HTML Tags are the commands that web browsers need in order to interpret a web page.

Visually, HTML tags are merely words that have been surrounded by angle brackets (<words>). That is, they always begin with a "less than" symbol (<) and end with a "greater than" symbol (>). These symbols surround the content apply meaning to the text (for web browsers to use).

HTML tags normally come in pairs (such as <b> and </b>) - with the first tag as the start tag and the second as the end tag. Here are three types of HTML tags:

HTML start tag - the command that begins an operation (<tag>)
HTML end tag - the command that stops an operation by including a forward slash before the command itself (</tag>)
HTML empty tag - is simply a single tag that can make a demand by itself. These do NOT require a closing tag. Common empty tags are used in images, line breaks, and horizontal rules.

Basic HTML Document Structure

Here is a basic HTML document structure:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head></head>
<body></body>
</html>

Don't worry! We will further explain this HTML coding throughout the rest of this post...

Before we list HTML tags and commands, here's some basic HTML info:

Extra spaces and line breaks (blank lines) in an HTML document do NOT matter, because they are ignored when HTML is interpreted.
If you're creating a web site, learning HTML is optional because web editors (like Macromedia Dreamweaver) are available today that can create a website for you - just as you would use Word to create a normal document.
In order to decipher your HTML content online, a DOCTYPE Declaration (DTD or Document Type Declaration) code is needed to tell web browsers what type of web page coding your HTML content complies with.
Tags in HTML are not case sensitive, so commands will work whether a word is capitalized or not.

Basic HTML Tags & Commands

<html> - The text between <html> and </html> describes the web page and is known as the "root element". ALL elements are contained in this tag, because it specifies the beginning and the end of an HTML document.
<body> - The text between <body> and </body> is the visible content of your page, known as "document body elements".
<head> - The text between <head> and </head> is known as "document head elements", which are used to display headings. In HTML coding, there are six levels of headings (H1 through H6), with H1 being the most important to search engines, H2 slightly less important, and so on...with H6 being the least important.

Getting Started With HTML Coding

Other than a computer, you will need the following to begin using HTML:

A text (*.txt) editor of your choice where you can securely save all of your HTML work - Notepad (found in your "Accessories" folder) will work fine for now. For future reference, most people opt for programs like Macromedia Dreamweaver or Microsoft FrontPage once they are ready to move onto more advanced HTML formatting.
Any web browser - such as FireFox or Internet Explorer.
Space to save all of your HTML work. Hard drive space, your web server, or a decent-sized flash drive is fine.
A web page (of your choice) where you can put your HTML to use!