A Quick and Dirty Guide to Learning HTML for StumbleUpon
If you're new here, you may want to subscribe to my RSS feed. Thanks for visiting!
When you make a post on StumbleUpon, you’re not stuck just using the default plain-text look. SU allows you to use some HTML (Hypertext Markup Language) and CSS (Cascading Style Sheets) to change the look of your posts. Today, we’ll look at the HTML that you can use, and what it does.
In HTML, everything you want to tell the computer to do, goes inside brackets like this <>. Anything outside of the brackets will be seen by everyone. When you want to tell the computer to stop an action, you add a slash in front of the action: <b></b>
<b>Bold</b>
HTML is a language that was created to be easy to remember, and for the most part it really is.
B or b (capitals don’t matter with HTML) = bold.
<i>Italic</i>
I = italic
<u>Underline</u>
U=Underline
You can also use HTML to create lists:
- An unordered list is:
- one without numbers
<ul>An unordered list
<li>one without numbers</li></ul>
To make a list, you have to use two codes. The first says what kind of list you want to use, either ul = unordered list or ol = ordered list. The second part is the li = list item. Use <li> in front of each item you want to include in your list, and use </li> at the end of each item. If you are using an ordered list, the numbers will count down for
- An ordered list is:
- one with numbers
<ol>An ordered list is:
<li>one with numbers</li></ol>
Using the <font> code, you change different aspects of the font:
<font size=”4″>font size=”4″</font> Changes the size of the font.
<font face=”papyrus”>Test</font> Changes the face of the font. It’s a good idea to get used to putting the variables in quotes (” “) although it’s only required if the variable is more than one word (”times new roman”)
<font color=”orange”>Test</font> Changes the color of the font. When you are using colors in HTML, you can either use the name of a color or a six digit code that describes the color.
Font information can all be included together…<font size=”4″ face=”papyrus” color=”orange”>
The last two items add links to your post. A = anchor and it anchors a link to either another web page or an e-mail address.
<a href=”http://sucomments.com“>links to website</a>
<a href=”mailto:mye-mail@email.com“>Send me mail</a>
Here is a quick list of the codes:
b=bold <b></b>
i=italics <i></i>
u=underline <u></u>
ul=unordered list <ul></ul>
ol=ordered list <ol></ol>
li=list item <li></li>
font size <font size=”4″></font>
font face <font face=”papyrus”></font>
font color <font color=”orange></font>
a=anchor <a href=”www.mywebsite.com“></a>
<a href=”mailto:gobbledegook@email.com“>
I didn’t mention adding pictures, because I’ve covered it extensively here, and here is a fairly basic list of Windows fonts. (If anyone on a Mac would like to send me a list of their fonts, I’ll include it also.)
Want to learn more about HTML? Here are some great references to help you get started:
webmonkey’s Color Codes
webmonkey’s HTML Cheatsheet
W3 Schools HTML Tutorials

and Download!


Comment from Jimmy
Time November 11, 2007 at 5:27 pm
Your Quick and Dirty Guide is first-rate, as is the other help & hints here. I will be back very soon to read all your fine articles!
—————————————————————————————-
Please reply to me at the above mail address; previously established mail channels (outbound particularly) apparently aren’t working as they should, since recipients (you included) seem to have not been getting my mail. Thanks, Jimmy @ SU