HTML/Basic formatting

These are some of the simplest HTML tags to learn. These tags will help make your page more organized and interesting to read. Keeping a web page organized is key principle and helps keep the page more user friendly. For example, compare Google's homepage with Yahoo's home page. Google's homepage is simple and has one function, to search. Yahoo's homepage has many services listed so users can find a diverse range of services as opposed to only being able to search. The goal is to keep your page organized and efficient.

Bold text
To make text bold, we use the  tag, like this: Normal text - Bold text! Which would display like this:
 * Normal text - Bold text!

Note: You may have seen the  tags used to make text bold. The  tag bolds text, but it is meant to be used to stress important words and concepts. The visual is the same, but the semantic meaning is different. As computer algorithms become smarter and better able to interpret semantics and context, semantic clarity is becoming increasingly important.

Italic text
Italics are much the same, but using the  tag instead, like this: This text is in italics
 * This text is in italics

Note: You may have seen the  tags used to italicize text. The  tag italicizes text, but it is meant to be used to emphasize specific words and concepts. The visual is the same, but the semantic meaning is different. As computer algorithms become smarter and better able to interpret semantics and context, semantic clarity is becoming increasingly important.

Nesting Tags
HTML Tags should be nested. When you have text in bold and in italics, the " " and the " " should go around each other like Russian dolls.  Like this 
 * Like this

Not:  This is wrong  Nor:  This is also wrong 

" " is fine.

Line breaks and horizontal rules
Browsers ignore single line breaks, so the following:

This is HTML

Would still render as:


 * This is HTML

However, if you use a line break, you can force a new line to occur whenever you want. Take the following code:

This is   HTML

Which would render as:

This is HTML

Another (less common) formatting tag is the horizontal rule, which will produce a line across the page. A horizontal rule is as simple as this:

Which produces the following:

You can also alter the size of the line, like this:



Which will make a smaller line:



Color can also be added to the tag. Use the color atribute . Used along with the size atribute for thickness, and defined by pixel size, this renders a nice red horizontal rule across the page.

The Center Tag
Note how the line is still on the left? This can be fixed using the  tag, which aligns things to the centre of the page.



This makes a nice, central line:



You can also use the  tag around text. This works well for poetry, as in the following example, which combines a few tags we've learned:

 Twinkle, twinkle, little meatball, Off my pasta did you fall! From the plate piled so high, Like a lump and landing with a sigh. Twinkle, twinkle, little meatball, 3 second rule but the dog beat me to you! 

Which would render like this:

 Twinkle, twinkle, little meatball, Off my pasta did you fall! From the plate piled so high, Like a lump and landing with a sigh. Twinkle, twinkle, little meatball, 3 second rule but the dog beat me to you! 

The  is deprecated. This means that it is no longer a standard by the W3C standards. The standard now is the use of attributes and CSS, which you will learn later on.

The tag in use now is the div tag and its attributes are left, center and right such as div align="center" enclosed in the proper brackets<>. formatted would look like:

center