Follow on Twitter Follow on YouTube Follow on Facebook Subscribe via email

Basic HTML Tags

By Robert Niles

Hypertext Markup Language [HTML] is the language of the World Wide Web. You can use HTML tags to mark up content for display on the Web.

The most important tag in HTML is the hyperlink. This is the code you use to link text or an image on one Web page to another URL [Uniform Resource Locator] on the Web.

Hyperlinks use an HTML tag called an anchor tag. Like many tags in HTML, the anchor tag comes in two parts...

Here is a hyperlink in action:

<a href="http://www.domain.com/folder/page.html">This is a hyperlink</a>

The a in the tag stands for "anchor." The href stands for "hyperlink reference." And the Web address after the equal sign is the Web page that the text between the anchor tags will link to. (Just substitute the URL of the page you want your readers to see when they click the hyperlinked text.)

Sample HTML page

Here is a simple Web page that uses a variety of common HTML tags. Feel free to copy and paste sections of the code below, as appropriate, when posting content to the Web.

<html>
<head>
<title>This is my webpage</title>
<meta name="description" content="This is a sentence describing the content on this Web page.">
</head>

<body>

<h1>This is a really big header, or headline</h1>

<p>I am writing a paragraph. And <b>this is bold text</b> within the paragraph. And this is <a href="http://www.domain.com/folder/">a hyperlink</a>, too.</p>

This is the second way of writing a paragraph.<p>

<h2>The is a secondary header</h2>

This is <i>italic text</i>, followed by a single-line break, instead of the double-line paragraph break done above.<br>

<blockquote>The blockquote tag provides a nice way to set off a really long quote.</blockquote>

This is a numbered (1, 2) list:
<ol>
<li>Item 1</li>
<li>Item 2</li>
</ol>

This is a bullet point (unordered) list:
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>

<img src="http://www.robertniles.com/html/photo.jpg" width=300 height=200 alt="This is a picture">

<p><a href="http://www.robertniles.com/"><img src="http://www.robertniles.com/html/photo.jpg" width=300 height=200 alt="This is a hyperlinked picture, contained in a paragraph" border=0></a></p>

<div align=center><img src="http://www.robertniles.com/html/photo.jpg" width=300 height=200 alt="This is a picture, centered on the page"></div>

<table border=1 cellpadding=10>
<tr>

<td align=center>Upper left table cell</td>
<td align=right>Upper right table cell</td>
</tr>

<tr>

<td>Lower left table cell</td>
<td>Lower right table cell</td>
</tr>
</table>

</body>
</html>

© Robert Niles. Read more in the column archive.