HTML Tags You Need To Know
Sunday, May 18th, 2008The following are some of the most common HTML tags you’ll use as a beginning web designer:
Text tags
To make a word of text on your website bold, simply enclose it with a <b> tag, as in the following example: <b>Please</b> be on time! You can follow the same structure to italicize or underline text using <i> or <u>, respectively. When you’re working with HTML tags, it’s important to remember to close the tag – using the </i> or </u> after the words you want to change.
You can also use HTML tags to edit the color of your text. For some of the most commonly used colors, you can simply use the tag <font color=”red”>. If you want a less common color, like a specific shade of purple used in your business’s logo, look up the six digit hexadecimal code online. For example, you could wind up with a tag that looks like this: <font color=”FF0000”>.
Another common use of HTML tags in modifying text is in the creation of headers. When you want to create definition to a line of text – or a single word – you can change its size with a header tag. Headers come in six sizes with a “1” being the largest, and a size “6” being the smallest. To change a piece of text to a header, simply enclose it with the tag: <h1>, <h2>, <h3>, and so on, depending on the size you want.
To change the look and feel of your web page, you can change the way text is aligned on your page with HTML tags. Before a paragraph of text, insert the tag <p align=”left”>, <p align=”center”> or <p align=”right”>. Be sure you close your paragraph with a </p> tag. Play around with these different styles until you find the one that works for your site.
Creating a bulleted list
Using lists on your web page is a great way to break up information and highlight important points – and it’s easy to do using HTML tags. To start a bulleted list, type the tag <ul>. Next, before you type the first item to appear in your list, add the tag <li>, which stands for “list item.” At the end of your first item, close the tag with a </li> and then add as many list items as you want using this formula. When you’ve added all the items you want, close the text with a </ul> tag.
Adding space between paragraphs
When you’re working with several paragraphs of text on your web page, be sure to enclose each paragraph with a <p></p> set of tags. This will automatically insert a certain amount of space between each paragraph to improve readability. If you want to add extra space, you can insert a <br> tag, which corresponds to a forced break in the text. This tag is unique because you don’t need to add a corresponding </br> tag – just insert it wherever you want extra space.
Combining tags
On their own, these tags may seem simple, but adding them together can get complicated. For example, what happens if you want a centered, bold, underlined piece of text? Whenever you’re working with multiple tags, make sure you close them in the correct order. To create the headline mentioned earlier, the correct structure is: <p align=”center”><b><u>Headline</u></b></p>. As you can see, each tag is closed in succession.
Working with HTML tags can be a lot of fun and knowing them will give you an unprecedented level of control over the design of your webpage. Practice with them using a drag and drop editor – or look at the source code for web pages you like to see how certain elements are created in code. Although you may need to seek the help of a professional web designer when you’re first getting started, you may soon find yourself able to complete most web design tasks on your own.