Power Tips: Cool HTML Formatting Tricks

Want to learn some easy HTML formatting tricks? HTML (or hypertext markup language) is the computer language used to build and format web pages. We understand that many folks don't want to fuss with HTML code, and you can get along without it - especially if you are using a WYSIWYG editor. But if you want to add some extra panache to your web site, a little HTML can help.

One of the easiest ways to spice things up is to experiment with different kinds of text formatting.

Font Formats
When using HTML, you'll write the text that you want to format and surround it with a pair of formatting tags, which indicate where the formatting starts and stops. To create bold or italic text, place the text you want to format between opening and closing tags like in the examples below.

Write This Code	To Get This Effect
This would be cool if it were <b>bold</b>.	This would be cool if it were bold.
I like to make a point with <i>italics</i>.	I like to make a point with italics.
It would be even cooler if it were <b> <i> bold and italics</i> </b>.	It would be even cooler if it were *bold and italics*.

Font Sizes
Want to make your text appear large or small on demand? In the Custom path of Site Building's Appearance task, you set site-wide font settings. But if you want to throw in the occasional eye-catching headline or sentence, you could change the size of individual words, sentences, or paragraphs with the tag. Just place the text you want to resize between opening and closing tags like in the examples below.

This is the sentence I want to change.

Will look like:

This is the sentence I want to change.

And:

This is the sentence I want to change.

Will look like:

This is the sentence I want to change.

Experiment with different font size numbers to find the size you like best.

Font Colors
Web colors are written as unique, six-number codes. To change font colors, you'll need to find the six-digit code for the color you want to use and place it inside the opening tag. For example, to create text with a deep red color, you'd write this code:

deep red color

Changing Fonts
You can also use HTML to change the font of your text. Your site visitors must have your font on their computers for it to display properly in their web browsers, so be sure to choose a common font, such as Arial, Verdana, or Times New Roman.

I want to see this line in Times New Roman.

Will look like:

I want to see this line in Times New Roman.

Combining Font Attributes
You can combine font sizes and colors — the font attributes — in interesting combinations. Remember, each attribute needs an opening and closing tag to indicate where the formatting should begin and end.

I want these words to be small, blue, and bold.

Will look like:

I want these words to be small, blue, and bold.

And:

I really want this to stand out!

Will look like:

I really want this to stand out!

Keep in mind that too many colors and font sizes may make your text hard to read, so experiment, but use font formatting wisely!

Bulleted and Numbered Lists
To highlight items in a list with bullets, you can use the unordered list or list item tags. To make bulleted text, place the text you want to format between opening and closing tags like in the examples below.

Write This Code	To Make This Kind of List
<ul> <li>bullet item 1</li> <li>bullet item 2</li> <li>bullet item 3</li> </ul>	bullet item 1 bullet item 2 bullet item 3
<ol> <li>bullet item 1</li> <li>bullet item 2</li> <li>bullet item 3</li> </ol>	bullet item 1 bullet item 2 bullet item 3

"ul" stands for unordered list.
"ol" stands for ordered list (numbered).
You can also bold, italicize, change font face, size, color, etc., by adding those codes to the string.