Skip to main content

Learning the Basics of HTML

By August 15, 2019March 24th, 2020Website Development

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 as 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 underlying 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!