HTML tags

Even if you never come close to programming a web site (and that’s a big IF), you need to know would basic HTML tags. HTML stands for hypertext mark-up language, and that is the basic language that tells a web browser (Internet Explorer, Safari, Firefox, etc.) what to do with a web site or web page.

The basic tags are relatively easy to learn and to use.

Almost all actions that HTML tags provoke come in two parts: a beginning tag and an ending tab. For instance, if you want to boldface words, you would put a beginning tag <b> before the words and an ending tag </b> after the words. Thus, this sentence:

Abraham Lincoln delivered the <b>Gettysburg Address</b> on Nov. 19, 1863.

would appear like this on a web site:

Abraham Lincoln delivered the Gettysburg Address on Nov. 19, 1863.

So here are the tags you should know:

  • Boldface
    <strong> </strong>
    (An alternative to this tag is <b> </b>.)
  • Italic
    <em> </em>
    (An alternative to this one is <i> </i>.)
  • Paragraph
    <p>
    This tag does not need an end tag. It creates a line of space.
  • Break
    <br>
    This tag does not need an end tag. It puts text on a new line but does not create a line of space.
  • Center
    <center> </center>
    This tag centers type or an image on the page or within a container.
  • Block quote
    <blockquote> </blockquote>
    This creates an indent on both sides of a line.
  • Link
    <a href=”http://www.jprof.com”>JPROF</a>
    This is one of the most important tags to learn. Note that there is a space between the a and the h. There is no space between the f and the equals sign. The URL (http://www.jprof.com) is inside quotation marks. All of the words between the beginning and ending tags will appear as a link. A link to a home page of a wide will often appear as the one above. A link to an inside pag, such as this page, will appear like this:
    <a href=”http://www.jprof.com/onlinejn/webjn-htmltags.html”>
  • Image
    <img src=”http://www.jprof.com/images/MarkTwain2.jpg”>
    The image tag calls an image onto the page from its web location. The image must have a web location for this to occur. No end tag is necessary.
  • Lists
    There are several types of lists that you can make with HTML tags. The one that you will use most often will probably be the “unnumbered list.” This list indents the items and puts a bullet (•) in front of each item. The entire list should be surrounded by paragraph tags. Here what a list looks like in HTML:<p><li>
    <il>red</il>
    <il>white</il>
    <il>blue</il></li><p>

    This list would look like this on the page:

  • red
  • white
  • blue

These are the basic tags, but they are by no means all of them. Your instructor may have additional tags that he or she will want you to learn.

Nesting

Nesting tags — putting them in the proper sequence — is important when two tags are applied to something. For instance, in the following sentence:

Harper Lee is the author of To Kill a Mockingbird.

you may want to make the title of the book both bold and italic. With the appropriate tags, the sentence would look like this:

Harper Lee is the author of <strong><em>To Kill a Mockingbird.</em></strong>

It does not matter which beginning tag comes first. The important thing is that the ending are in reverse order from the beginning tags.

Here’s another example. In the following sentence:

You can find much about journalism at the JPROF web site.

you may want to make “JPROF” a link and you may also want to boldface the type. The tags for this would look like this:

You can find much about journalism at the <a href=”http://www.jprof.com><strong>JPROF</strong></a> web site.

and the sentence will look like this:

You can find much about journalism at the JPROF web site.

Notice again that the sequence of the ending tags is the reverse of the sequence of the beginning tags. With the beginning tags, the link tag comes before the bold tag. This is called nesting. If you are going to apply two or more tags to an object, the order of the ending tags should be the reverse of the order of the beginning tags.

Get a FREE copy of Kill the Quarterback

3d ktq small

Get a free digital copy of Jim Stovall's mystery novel, Kill the Quarterback. You will also get Jim's newsletter and advanced notice of publications, free downloads and a variety of information about what he is working on. Jim likes to stay in touch, so sign up today.

Powered by ConvertKit

About Jim Stovall

Jim Stovall, a retired journalism prof, is now a novelist, self publisher, watercolorist, gardener, woodworker and beekeeper -- among others things.

No comments yet.

Leave a Reply

Share