HTML Cheat Sheet

Brought to you by: theParagon.org

What is covered here:
  1. Making your text BOLD
  2. Making your text ITALICS
  3. Making a LINK
  4. Making a LINK open in a new window
  5. Making an EMAIL link
  6. Making a LINE BREAK
  7. Making a Paragraph
  8. Making a List
  9. Places to learn more about HTML
  10. Contact Me

Making your text - BOLD

<strong>bolded words here</strong>

Just so you know - The <strong> tag is the same as the <b> tag (if you've been using it) but can do much more. Every time an audible browser reads your site it will pronounce any word within the <strong> tag with a strong voice. This helps any person using a audible browser quick a bit.

So which one it better and should be used? The strong tag should be used without a question.

Return to Top

Making your text - ITALICS

<em>italics words here</em>

Just so you know - Like the tag above, the <em> tag has a partner just the same. The <i> tag also creates the same visual effect but doesn't do anything for people with disabilities. The <em> is preferred.

Return to Top

Making a - LINK

<a href="http://www.theparagon.org" title="Small Description of Link">name of site</a>

Important:
When making a link, please make sure to put http:// before the link just as shown in the example.

Return to Top

Making a - LINK open in a NEW window

<a href="http://www.theparagon.org" title="Small Description of Link" target="_blank">name of site</a>

Important:
When making a link, please make sure to put http:// before the link just as shown in the example.

Return to Top

Making an Email Link

<a href="mailto:info@yoursite.com" title="Small Description of Link">Email Us</a>

Return to Top

Making a Line Break

<br />

Same as::
When you are typing an email and you push ENTER to go onto a NEW line. A line break (<br />) does the same thing. It tells the site to break apart the text just like pushing ENTER in an email or in Microsoft Word would do if you did it there.

Return to Top

Making a Paragraph

<p>Your paragraph goes here</p>

A paragraph tag (<p></p>) is used when putting in a block of text - a paragraph. When you open a paragraph tag you must make sure to close it. Just like the example above.

Quick Tip
If you find yourself putting multiple <br /> tags in your page for spaceing - you can probably serve your purpose better with the <p></p> tag.

Return to Top

Making a List

First off we are going to make an "Ordered List". Numbers will automatically show up - your browser knows to add numbers because you placed the <ol> tag around the list (<li>) elements.

Example:
  1. Eggs
  2. Milk
  3. Bread
  4. Butter
Code:
<ol>
<li>Eggs</li>
<li>Milk</li>
<li>Bread</li>
<li>Butter</li>
</ol>

Now we're going to make an "UNordered List". Dots will automatically show up - your browser knows to do this instead of numbers because you placed the <ul> tag around the list (<li>) elements.

Example: Code:
<ul>
<li>Eggs</li>
<li>Milk</li>
<li>Bread</li>
<li>Butter</li>
</ul>

Return to Top

Some resources if you want to learn more about HTML

Return to Top

Something I Should Add/Change?

This page is just a quick tutorial for those that want to know the basics of HTML. Possibly at a later time I will go into more depth and into other languages.

If this page was helpful and you are looking for me to create more pages like this - please let me know by making a suggestion below.

Required Fields

Offer Suggestions

Your Name:

Your Email:
(example: you@yourdomain.com)

AIM name:

Was this page helpful?
Yes, Thank You
No - I am sending suggestions

Message:

Return to Top