HTML Tags

Quick history of HTML - how it started HTML is an acronym for Hypertext Markup Language. It was a derivative of something called SGML. The HTML 1.0 standard (for the HTML tags) was finalized in 1993, and was considered to be a simple coding language for formatting (decorating) text and pictures. As you will see in the examples, it is used to change font, color, size and placement of text and images (the content). In November of 1993 NCSA produced Mosaic Web browser that used this standard of markup.
[top]

Introduction to HTML HTML was designed to be simple to implement. However, not all browsers support the same set of HTML tags, complicating matters. Even so, many still like to build their own web pages, and they use a variety of tools to do so. Hopefully we can take some of the mystery out of this so you can feel comfortable doing so yourself. No matter what tool you use, you can only get the most out of it when you have a firm understanding of the different HTML tags used to make up the web page. And when you build your site, be sure to test it in whatever browsers your visitors will use to access it. This web site, SpiderwebLogic.com was tested in Internet Explorer 6.0 & 7.0, Opera, and Mozilla FireFox, and Safari.

HTML is a markup language that is basically used to format text and pictures for viewing on the web. This won't be a complete detailed demonstration of using all HTML tags, since there are plenty of detailed tutorials around. This is a brief overview to help generate interest, give some basic examples, and give some good reference links. At the bottom, you will find a couple of our favorite links.
[top]

A look the very basic HTML code Here is a sample of what html pages look like - at their most basic. All the tags shown here (in green) should be in each HTML web page document. HTML tags are used to display the text and pictures in different ways. Notice the "<" and ">" surrounding the tags. Some even begin with "

The most basic HTML page:
(all web pages have these, at a minimum) *

* the only exception is those pages that are made using frames

You can type the examples of the code here into a text editor like Notepad, and save it as an HTML page. Just open Notepad, copy and paste the HTML tags in the sample, and save as, using the .htm or .html file extension. Don't forget to change the Save as type to "All Files" so it won't append a .txt file extension to the end.
'Save As' picture, when using Notepad to build HTML tags

(If this gets too frustrating to learn and you want to cheat, see our HTML tags generator. This will help generate the HTML tags to put in between the "body" tag.)

This is how to do a HTML link:
(The "a" HTML tag is used to make the link.)

HTML Links

Colorizing text with the "font" html tag:

HTML font color=blue

Making text bold with the "b" html tag

HTML - Bold using b tag

Here is a more complex example:

[top]

Don't forget to close your tags . . . Notice that the text is wrapped in a start an end tag. Look at the "<b>" or "<strong>" tag. It is making the text in between it bold. It has a "<" before it, and a ">" after it. This is a start tag. The end tag looks just like it. But notice that the end tag has a "" before the "b". Forgetting to close your tags is a common mistake for novice and experienced web developers. Internet Explorer may be somewhat forgiving of this but other browsers are not.

If you can't find where you may have forgotten to close a tag you may want to use a special tool. We like to use the free W3C MarkUp Validation Service. This tool will point these out, and make other suggestions too. Not all need to be followed, but they are good ideas to consider. The main thing is that your pages look good in the browsers your customers will likely use.
[top]

Use meta tags for the search engines . . .

Meta tags that you see above are used to help the search engines know how we want our web page described, and what key-words we think is important. These are one of the few HTML tags that don't have end tags. (The "br" HTML tag is another one that doesn't need an end tag. This is because it is telling of a page break, and is not wrapping markup around some text.) They are always in between the "head" tag that is at the top of the document. Many search engines use these, and there is some art in building good ones. The technical term used in defining keywords and web content that the search engines will find is called Search Engine Optimization, or SEO for short. Also, search engines look at the frequency of your key words within the body tags and the title of your web page, and don't rely on the key words.

Many web-site owners like to hire this out, since you need to keep up on the changing tricks available to keep your site visible to a web search. Like they say in real-estate, it's all about location. Is the website in the top ten of the listing? Or even the top 30? What key words will bring your site up? We do offer Search Engine Optimization services for your site. You may also use our free tool to get yourself started building Search-Engine friendly meta tags: HTML Meta Tag Generator
[top]

Some tags don't work in all browsers . . . There is a finite list of HTML tags that are used to mark up a web document. DevGuru.com is one of the best places to visit to see the complete list and what they are for. Just remember that all browsers may not support all tags. Researching this is part of the art of the webmaster. For example, the "blink" HTML tag is not supported in all browsers. (It works in Netscape, Mozilla, and Orion, but not in Internet Explorer.)
[top]

We hope that you enjoyed this little overview of HTML basics. If you are interested in having us build a website for you, please contact us.

HTML Tags

Web Design

FAQ: