In HTML, tags are the basis of your programming. They allow you to create hyperlinks, tables, and more. In this tutorial we shall give a list of most HTML tags, tell you what they do, and even give an example for you to better understand how to use this tag. All these tags are very important in HTML. Without them about the only thing you could do is just type the plain text you see here. These tags are listed in alphabetical order for your convenience.

Below is the list of tags:

Tag: <!– … –> This tag is the comment tag. It is used so that you can make notes to yourself about your web page. It will not show anything on the page and will only be seen on the page source. Start your tag with <!– and put your text in the middle. Then once you are finished with your comment you must close it with –>. Otherwise the rest of your script will all be comments! Example: Comment Tag.

Tag: <a href=”"></a> This tag is the anchor tag. It is basically linking your text to another website or another part of your website. To use this tag, start out with <a href= It is required, otherwise your link will not work. After <a href= add a ” and then type your links name. If you want to link to another website, make sure you always type http:// before proceeding. Otherwise the link will link to your website. After typing your link name, add another “. Make sure you have two, otherwise your link will not work. Then add > and type the text you want to appear. For example, if you were linking to hyperreader.com, you might make your text HyperReader Home Page. After this, finish with </a>. At the end, your link will look something like this: <a href=”http://www.hyperreader.com (of course, replace this with the link you want)”>HyperReader Home Page (replace this too)</a>. Example: Anchor Tag (In fact, this link is an example!)

Tag: <strong>/<b> This is the bold tag. It puts the text inside the tag into bold font, such as this: Put your text here. There are two ways to write this tag, but both give the same results. However, for this tutorial, I shall use the <strong> tag. Another tag you can use is the <b> tag. To start out, first type <strong>. Then immediately afterwards type the text you want to be in bold. After that end it with </strong>. It is very important that you end with </strong>, otherwise all of the text after your <strong> tag will end up being in bold too! Example: Bold Text

Tag: <big> This tag puts the text inside it in big letters: Put your text here. You see that all the text inside the tag is bigger than the text around it. To add this tag, simply start with <big>, then put the text you want to be big inside, then close the tag with </big> Again, remember to close the tag properly! Example: Big Tag

Tag: <body> This is the <body> tag. It basically tells you when the body of a web page starts. Remember to end it with </body>!

Tag: <br> This is the line break tag. To use it, you first type a line of text. But let’s say you want some more text to be on another line. How do you do that? By adding the <br> tag. So you first type your line of text, add <br>, and then type your second line of text. In this tag, there is no such thing as </br> (well actually there is but that’s not the point of this tutorial; it will just make this more confusing) so you do not need that. Example: Line Break Tag

Tag: <center> This tag does exactly what its name says: It centers text. Start with the center tag: <center> Then type your text you want to be centered. Lastly add the closing tag: </center>. So in the end the tag will look something like this: <center>Type your text here</center>. Example: Center Tag

Tag: <em> This is the emphasis tag. It puts the text in it into italics: Put your text here. To start off, add <em>. Then type your text, and close with </em>. Whala! You have your text in italics! Example: Emphasis Tag

Tag: <font> The font tag changes the font, color, size, etc. of your text. It can be used in a variety of ways. To start out, add <font. But wait! DO NOT add the > yet. You can make your font red, in old english text, whatever, simply by adding more tags such as color=”red”, size=”24px”, etc. So basically your tag will be like this: <font size=”24px” color=”green”>Put your text here</font>. Example: Font Tag

Tag: <h1>, <h2>, etc. These are header tags. In the example below you can get a more detailed view of each of them. There are 6 different tags: <h1>, <h2>, <h3>, <h4>, <h5>, and <h6>. Note: There is NOT a <h7>, or anything like that. To close the tag, simply type the end code with a slash. E.g. <h1>Text</h1>. You canNOT do this: <h1>Text</h3>. It will NOT work. Examples: Header Tag

Tag: <head> This tag basically tells you that it is the head of and HTML document. To close this tag simply type at the end of your header </head>. This tag is NOT required, nor is the <body> tag

Tag: <hr> This tag draws a line straight through the middle of your page. HR stands for horizontal rule. In the example there will by more ways that you will see this being used, including changing the position and color of the line. Example: Horizontal Rule Tag

Tag: <html> This is the HTML tag. It basically means that you are starting some HTML script. When you are finished with HTML script, close the tag with </html>. This, like the <head> and <body> tag, is not required. HTML will still work if you do not have this tag in your script.

Tag: <img> This is the image tag and is used when you want to put an image on your page. To start out, type <img src=”. The add your image URL and close the quotation marks: <img src=”your image url here” /> You can also add borders and other options to your image, which can be seen in the example. Example: Image Tag

Tag: <input> This tag inputs a text field, button, and more. It, like many other tags, can also be manipulated in many ways, as you will see in the example. To start out, type <input type=”. Then add what type you want. If you want a button, type <input type=”button”> If you want a text field, type <input type=”text”>. To add a textarea, it is the same code, only replace input with textarea and add at the end </textarea>. Radio buttons, drop down menus, and checkboxes are also created using the input tag. Example: Input Tag

Tag: <li> This is the list item tag. If you want a list, simply start with <li> and then type the text inside the <li>. Once the text is done, add the closing tag: </li>. There is an unlimited amount of times that you can do this. In the example you will see that we can even combine some of our tags. Example: List Item Tag

Tag: <marquee> This tag is probably the coolest one. It makes your text scroll. Simply start with the <marquee> tag and then add the text you want to scroll. After that end it with </marquee>. Cool and gets the attention of your visitors! Example: Marquee Tag

Tag: <p> This is a paragraph tag. It is used, as its name says, to write paragraphs. Start with <p>, then type the paragraph, and end with </p>. Example: Paragraph Tag

Tag: <small> This tag does the opposite of the <big> tag. It makes the text smaller than the other around it: Put your text here. To start, type <small>. Then put the text you want to be small inside the tag. Close the tag with </small>. Example: Small Tag

Tag: <table> This tag is used for making tables. Depending on what software you have you should be able to choose how many rows and columns you have, so we will not talk about this here. To start a table add <table>. Then close it with </table>. Inside the table you should have something similar as the example. In the example you can also see the source code by right clicking and then clicking on the option source code. Example: Table Tag

Tag: <title> This tag is used to put a title on your webpage. The title is shown on the status bar. For example, the title of this page is “HyperReader ยป HTML Programming Tutorial One: An Overview Of All HTML Tags”. To add a title, start with <title> Then type your selected title and close the tag with </title>. Do not forget to do this otherwise your whole page will be just a title! It is best to put the title at the very beginning of your script.

Tag: <u> This is the underline tag. It underlines the text inside it. Start with <u> and then type the text you want to be underlined. Don’t forget to close the tag with </u>! Example: Underline Tag

Tag: <ul> This tag stands for unordered list. It is similar to <li>. To use this tag, start with <ul> then type the text you want to be inside the list. Then close with </ul>. Like <li>, this list can be used an unlimited number of times. Example: Unordered List

Congratulations! Now you know all the basic tags of HTML! You’re almost ready to explore the world of HTML with your webpage! But just knowing how these tags work is not enough. That’s why HyperReader will have other examples of how to use these tags in real life situations that you may need on your website! You can also start an account on HyperReader and post your own ideas on HTML, PHP and JavaScript.