Search Helium

Home > Computers & Technology > Internet > Web Design

A beginner's guide to HTML

by Sarah Parrish

Created on: March 28, 2009

A brief history

In 1980 Tim Berners-Lee devised a way for people to share documents through his prototype called ENQUIRE. Nine years later, a colleage and Berners-Lee devised a simple markup language and the following year the World Wide Web project was proposed and accepted.

These days HyperText Markup Language (HTML) is the most prevalent code on the internet, forming the basics of webpage formatting.

How it works

Elements of HTML are written between angled brackets. Most elements have two basic properties: the attribute and the content. Using a link tag as an example, the element would look something like the following:

<a href="http://www.foobar.com" > This text will appear linked</a>

Notice that in the above example, you have an opening tag and a closing tag. The opening tag dictates the nature of the element, in this case a link, including the specified link address. This is followed by content, i.e. the text between the two links that will appear on the webpage modified by the tags that surround it. This is followed by a closing tag. The closure is denoted by a backslash in the beginning of the tag. That is to say "this element is ending" and no text following the closing tag will be linked.

A few elements have only the attribute like <br> which needs no content.

The list of elements and tags is far-ranging and enables modification of text and formatting, including the creation of tables, links, background colors, font colors, and even inserting images. The range of possibilities available using nothing more than basic HTML is significant.

A simple tutorial

Open a simple text editor on your computer and save the document to the desktop under the title "test.html".

Next, copy and paste everything between the two asterisks below.

*

<html>
<head><title>this text appears at the top of the browser window</title>
</head>
<body>
<p>This is an opening paragraph. <b>This text will appear in bold</b>. <strike>This text will have a strikethrough.</strike> And now the paragraph will end.</p>
</body>
</html>

*

Next, go to your favorite browser, be it Internet Explorrer, Opera, Firefox, or Safari, and under "File" select "open" and find the file you saved to the desktop. You will see the text only between the brackets in your text-edited document. You can upload this text document to a web hosting service and create your very own simple webpage.

Play around with different tags and colors until you get the exact look you want. You can find comprehensive lists of the hundreds of available html element tags by doing a quick google search or by following the link at the bottom of this article.

You can create a webpage as a simple "about me" page for your friends, create a blog, advertise a business, or practice graphic design. Webpages are both fun and informative but as a final word of warning, some of us will quickly move on if the page is garish or an eyesore so please avoid the use of blinking text.

And finally, the following webpage is a great html resource, allowing you to play around with tags dynamically right in the webpage before you decide to copy and paste it to a text document and save it as your own. The page also has more in-depth tutorials in a very understandable format and can be found here: http://www.w3schools.com/htmL/.

236625_m Learn more about this author, Sarah Parrish.
Click here to send this author comments or questions.

261026

Featured Partner

Pulitzer Center on Crisis Reporting

The Pulitzer Center promotes in-depth engagement with global affairs through its sponsorship of quality international journalism across all media platforms and an innovative program of outreach and education.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
#