HTML Tips, Shortcuts, and Resources: HTML Part 3

Basic HTML code for myspace and more 

By Joey Delli Gatti

In the <TABLE> tutorial, we made a table and put things in the table cells or <TD>s.  We learned how to combine cells (or make one cell fill the space of X amount of cells.  We also learned a little about the potential of <TABLE>s and about putting tables inside of table cells of a larger table.

A lot of attributes can be specified in tables such as width, height, padding (within cells), spacing (between cells), background=”” (background images), colors, and more.  And, if we want to do something with our tables that we don’t know how to do, we can always search the Internet.  My favorite source is www.w3schools.com/html/html_intro.asp.

Today, JavaScript will be discussed, and some simple cut-n-paste HTML code will be provided.

JavaScript:

I am not a javascript pro. So, when I need something fancier than standard HTML, I turn to online resources for help.  Many Web resources will show the java-scripted effect, show the code for creating it, and tell you how to put it into your page correctly.

JavaScript tends to deal with more action and animation on the page.  For instance, you can have something happen when the site visitor puts the mouse over an image.  Links and specific page controls can be implemented as well. Check out this site to see some of the neat things that you can do with your HTML pages: javascriptkit.com/cutpastejava.shtml.  The site also includes code that you can just cut and paste into your HTML page.  

Cut-N-Paste Codes

I find that I use <TABLE width=”” align=”” border=”” padding=”” spacing=””> a lot, followed by <TR> and <TD width=”” height=”” valign=”” halign=”” colspan=”” border=”” bordercolor=”” rowspan=”” bgcolor=”” background=””>.  Besides these, here is a list of <TAGS> and attributes=””.

Here is a generic img src tag.

     <img src=”” height=”” width=”” border=”” vspace=”” hspace=”” align=”” alt=”” title=””>

Here are basic external link tags:

     <a href=””></a> This one is just a basic link.

     <a href=”” target=”top” alt=”” title=””></a> This one opens a page in this window

     <a href=”” target=”blank” alt=”” title=””></a> This one opens in a new page

Other tags that you might want to use are…

     <blockquote></blockquote> makes a block quote

     <b></b> bolded text

     <i></i> italicized text

     <u></u> underlined text

     <s></s> strike text

     <big></big> larger-than-normal text

     <small></small> smaller-than-normal text

     <br> or </br> but not both drops the next text down to the next line

     <code></code> computer code can be written out for page viewers 

     <font></font> can have color=”” face=”” size=”” specified

     Bulleted lists:

    <ul>
         <li>First item
         <li>Second item
         <li>Third item
     

      <ul>
           <li>First item
           <li>Second item
           <li>Third item
      </ul>

    </ul>

     

     The results of this are:

  • First item
  • Second item
  • Third item
    • First item
    • Second item
    • Third item

Some common attributes to use in tags are as follow:

     align=”” can be left, right, center

     bgcolor=”” usually the 000000 format is best.

     border=”” in pixels

     height=”” in pixels

     width=”” in pixels

     valign=”” top, bottom, middle

Again, a really good resource for these tags and attributes can be found here.

In fact, any time you find a mistake in your code or aren’t sure what to do to get the right effect, google it.  Virtually everything you need to know is online somewhere, and you’re almost guaranteed to find a page written in a way that teaches you in a way that’s easiest for you to understand.  Just using these lessons, if you can get through them, will help you to make awesome pages by hand and to recognize portions of code to adjust in fancy programs that do the coding for you.

Good luck and have fun!

P.S.  You can involve a lot more programming and database-type features in your Web site.  To learn more about those features, try searching these few topics on the Web: Flash, Java, CSS, PHP, and MySQL.