Search Helium

Home > Computers & Technology > Internet > Web Design

A beginner's guide to HTML

by Aaron Conor

Created on: March 17, 2007   Last Updated: December 07, 2011

There are many different ways to develop a website. One such option is with HTML. In this article, I will cite some HTML(HyperText Markup Language) code examples.

*Very Important! For some reason, brackets were causing some of my HTML coding below to disappear. It's probably due to some sort of safeguard that Helium uses. To compensate for this, everything that should have a bracket around it has been replaced with a parenthesis. So make sure that you change your HTML to make up for this. If you fail to change your code, then it will not work. For clarification: () = <>.*

First, the basics. The (HTML) tag is always at the beginning of your code. After this comes the (HEAD) tag, which is where you put more complex code such as CSS or JavaScript. Next is the (TITLE) tag. The (TITLE) tag is where you would name your website. After this comes the (BODY) tag, and this is where the majority of your content goes.

Tables, text, graphics; etc are, for the most part, found under the (BODY) tag. And don't forget to close these tags. For instance, once you have finished inserting information into the (BODY) tag you would then close that tag. It's simple. To close the (BODY) tag, you would type (/BODY) after all of your content has been entered. You close all of your tags that way. It's a very easy yet important step.

Now let's do an example webpage.

(HTML)
(HEAD)
(TITLE)My example webpage.(/TITLE)
(/HEAD)
(BODY) This is where my content goes.(/BODY)
(/HTML)

Okay, do you want to test it out? Simply save it in Notepad as test.htm, and open the file in a browser. If you did it right, then all of the tags should be gone in the browser. The body text should appear below the url address bar, and the title should appear on the left side of the screen at the very top.

How about a few more easy tags? Instead of using the enter key like you do for a word processing program such as Microsoft Word, you use another tag in HTML. The tag is called (BR). How about adding a space? Again, it's different than a word processing program. You would use the code to add a space in between letters for HTML. The brackets are not necessary in this case.

What about bolding, italics; underlining words? Simple. For bolding, use (strong)(/strong). Use (em)(/em) for italics, and use (u)(/u) for underline. Just to be clear, place whatever your word is in between the above code for it to work. Also, be careful when underling text because you don't want your viewers to think the underlined word is a link. The viewers might become annoyed and leave.

What if you want to change the font? In this case, you would use the (font face) tag. To change the color of the font you would use the (font color) tag, and to change the size of the font you would use the (font size) tag. However, if you wish to do all of that at once simply combine all three tags. This is what you would have: (font color="blue" size="1" face="Verdana")

How about inserting an image? For this, use the (img src="image.jpg") tag. Where it states "image.jpg", change the name to whatever your file is called. And what about linking? Easy, (a href="http://weather.com")Hello(/a) is the tag to use. Change "http://weather.com" to whatever url you wish to use, and swap out "hello" with the name you would like to use.

HTML is an easy language to learn, and with practice you'll become an expert. I hope this article helps you to take those first steps in building your first website. And don't forget to always close your tags!

More information: http://www.web-source.net/html_codes_chart.htm

Learn more about this author, Aaron Conor.
Click here to send this author comments or questions.

Helium Debate

Cast your vote!

Should social networking sites be regulated?

Click for your side.

122054

Featured Partner

Buckeye Institute

The Buckeye Institute for Public Policy Solutions is a nonpartisan research and educational institute devoted to individual liberty, economic freedom, personal responsibility and limited government in Ohio. It is committed to quality res...more


CONNECT WITH US

Read
our blog
Helum for writers

Write and get published
Share with other writers
Polish your freelancing skills

Join our active writing community
Helium Content Source for Publishers

Quality articles from proven freelancers
Exclusive rights, fast turnaround
Brand engagement, business blogging -- our writers do it all

Get custom content today!

INFORMATION


Helium, Inc.
200 Brickstone Square Andover, MA 01810 USA
#