"Yellow Bird"

"God grant me the serenity to accept the things I cannot change,
courage to change the things I can,
and wisdom to know the difference."
~The Serenity Prayer~

~ Welcome to my Advanced HTML Help Page ~

HTML is the "language" that designers use to create their unique pages on the World Wide Web. It is easy to learn and constantly changing.

To stress the importance when using HTML Tags PLEASE REMEMBER each HTML Tag requires both an opening <>and closing <"/"> Tag. If a closing Tag is not inserted then your entire message will be what your LAST opening Tag was. Below you will find a chart that will help you with the basics of HTML.

  • Block Quotes
  • Adding Two Columns
  • Create Bullet Lists
  • Create Numbered Lists
  • Preformatted Text
  • Link Within Document
  • Link in your Directory
  • Link to Someone Elses Page
  • Link with an Image
  • Link with no Line
  • Add a Banner in Guestbook
  • Add Fancy Fonts in Guestbooks
  • Lake Applet Code for Guestbooks
  • Music on Guestbooks
  • Using Various Fonts in Cards
  • Let Others Upload Zipped Files
  • Add a Signature to E-mail
  • Add "mailto" on E-Mail
  • Hints & Tips

    • ~ Block Quotes ~

    <blockquote> When you use a "BLOCK QUOTE" both the left and the<br> right sides are indented to separate the text from<br> the rest of the document. </blockquote>
    When you use a "BLOCK QUOTE" both the left and the
    right sides are indented to separate the text from
    the rest of the document.

    Go to HTML Index.

    ~ Adding Two Columns to your Page ~

    <table><tr><td valign=top><ul> <li>your text <li>your text </ul></td> <td valign=top><ul> <li>your text <li>your text </ul></td> </tr></table>

    Go to HTML Index.

    ~ Creating Bullet Lists ~

    The format to use to create bullet lists is...

    <ul> <lh>Fruit <li>Apples <li>Oranges <li>Bananas </ul>
      Fruit
    • Apples
    • Oranges
    • Bananas

    Go to HTML Index.

    ~ Creating Numbered Lists ~

    The ordered list consists of items in a specific order. An ordered list is ideal for a set of instructions or a table of contents. The format to use to create numbered lists is...

    <ol> <lh>Fruit <li>Apples <li>Oranges <li>Bananas </ol>
      Fruit
    1. Apples
    2. Oranges
    3. Bananas

    There are five number styles you can use to number a list. These are... 

    A     A,B,C
a     a,b,c
I     I,II,III
i     i,ii,iii
1     1,2,3

    Go to HTML Index.

    ~ Creating Preformatted Text ~

    The Web browser usually ignores any new lines, paragraphs and extra spaces you place in an HTML document. You can retain the appearance of a section of text by using tags.

    <pre> Apples Robin Cat Oranges Blue Jay Dog Bananas Eagle Tiger </pre>

    The finished product looks like this...

    Apples    Robin     Cat
Oranges   Blue Jay  Dog
Bananas   Eagle     Tiger

    Go to HTML Index.

    ~ Creating a Link within your Document ~

    To create a link (such I have done with my "HTML Index") within your document that can be clicked to jump to another part of the document requires two steps.

    • Insert a target to where you want the link to jump to.
    • Insert a link to be clicked to cause the jump.
    <a name="target_name_here"> <a href="#target_name_here">hotlink</a>

    Go to HTML Index.

    ~ Link to another File in different Directory ~

    To create a "hotlink" that will open another file located on the same server the format is...

    <a href="relative_path_and_file">hotlink_text</a>

    If the file is in the same directory as the calling file, it is only necessary to specify the filename. If the file is in a different directory then you must give the relative path and filename.

    <a href="callingcards.html">Go to Calling Cards</a>

    Go to HTML Index.

    ~ Link to a Document on another System ~

    To create a link that goes to a document on another system somewhere else on the Internet use this format.

    <a href="http://www.altavista.com/">Go to AltaVista</a>

    FTP sites store huge collections of files that anyone can copy. You can place FTP links on your web pages to give readers quick access to FTP sites. When your reader selects the link, the FTP site you specified will appear.

    <a href="http://www.jumbo.com">JUMBO!</a>

    Go to HTML Index.

    ~ Using an Image as a Link ~

    You can have an image in your Web page link to another page on the Web, or to another page within your document or within your directory. An image link often displays a border.

    <a href="http://www.altavista.com/"><img src="altavista.gif"></a>

    To place or align your image you simply add (ALIGN=?) like this...

    <img src="left.gif" align=top> <a href="#index">Go to index</a>

    Simply change align=? to top, center, bottom or change to left, center, right as you wish.

    A web browser usually leaves 2 pixels of space around an image. You can increase the space between the image and the surrounding text by adding (HSPACE=?) replacing the ? with the amount of space you want to add to the left and right sides of the image in pixels. Likewise type (VSPACE=?) replacing the ? with the amount of space you want to add above and below the image in pixels.

    <img src="flower.gif" hspace=10 vspace=10>

    Go to HTML Index.

    ~ Create a Link without Underlines ~

    Under Basic HTML I explained how to create a link. An example is...

    <a href="http://geocities.datacellar.net/5245">Charo's</a>

    You can also create the text so that it is clickable but doesn't have the line underneath. Use the following code...

    <STYLE TYPE="text/css"> <!--A:link, A:visited { text-decoration: none; } A:hover, A:active { text-decoration: underline; }--> </STYLE></HEAD>

    The code should be placed just before (/HEAD)which is located at the beginning of your document.

    Go to HTML Index.

    ~ Leave a Banner in a Guestbook ~

    <br><br> <center><a href="http://geocities.datacellar.net/charo6"> <img src=" http://geocities.datacellar.net/charo6/thxsignbook.jpg"> <border=0></a></center>

    I have found that it is nice to leave one or two spaces below your message. The next line is your URL address. The next is your banner or image. You need the above if you want to leave a picture and a link back to your homepage. If you don't want a border to show around your picture add (border=0) as above. If you just want to leave a picture use the following.

    <a href="http://geocities.datacellar.net/5425/image.gif"> <border=0></a>

    Go to HTML Index.

    ~ Adding Fancy Fonts to a Guest Book ~

    To add a fancy type when you sign someone's guestbook use this format changing the size, color and/or face that you wish...

    <font size="+1" font color="0000FF" font face="Script MT Bold">type your text</font>

    Go to HTML Index.

    ~ Lake Applet Code for Guestbooks ~

    If you would like to put a lake applet in a guestbook so that when someone clicks on the applet it will take them to your page here is the code to use for the applet below. Change the address, name of picture, width and height of your picture accordingly.

    <div align="center"><center><table border="3" cellpadding="0"cellspacing="1"><tr><td> <applet code="Lake" codebase="http://www.homepageaddress.com" align="absmiddle" width="xxx" height="xxx"> <param name="image" value="http://www.homepageaddress.com/picture.jpg"> <param name=href value="http://www.homepageaddress.com"> </strong></applet></td></tr></table></center></div>

    Go to HTML Index.

    ~ Adding Music on your View Guest Book Page ~

    To get music to play in your guestbook, you need to go the Utility page, and on to where you can add backgrounds and text. Insert the following code with your own MIDI source.

    <embed src="http://geocities.com/5425/summer.mid" height="0" width="0" loop=true autostart=true>

    Go to HTML Index.

    ~ Using Various Fonts in Cards ~

    There are several fantastic cards sites on the Internet. I have discovered that most of them are geared for using HTML language within your text. To add a fancy font when you send a card that does have this capability use this format changing the size, color and/or face that you wish...

    <font size="+1" font color="0000FF" font face="Script MT Bold">type your text</font>

    Go to HTML Index.

    ~ Enabling Someone to Upload a Zipped File From Your Site ~

    After you upload the zipped file into GeoCities, you then post this...

    <a href="myfile.zip">Name of your Zipped File</a>

    Go to HTML Index.

    ~ Adding a "mailto:" address on an Email ~

    When you would like someone to respond to a different email address than you are using, use the below format on your email. This will create a hyperlink which when clicked will bring up a new message box.

    mailto:mycurrentabode@yahoo.com

    Go to HTML Index.

    ~ Adding a Signature to Your E-mail ~

    You will want to make up a signature which can be as creative as you want it to be. Save your endeavor to your C-drive. This will have to be saved as TEXT document, not just document. Go to your mail section and find the OPTIONS... MAIL AND NEWS PREFERENCE... click on Identify and you will see a signature file... browse until you come across the file you just saved and click OK. You should have a signature at the bottom of each e-mail that goes out!

    Go to HTML Index.

    ~ Hints & Tips ~

    Blank Spaces on your page ~ When you are trying to get blank spaces on the page, many people use . This will work in some browsers, but if you want to be sure they will work in most browsers, use instead. The ; is important at the end of the code. It is not punctuation!

    Pictures on your page ~ Remember that before you can put pictures onto your homepages, you have to upload them to GeoCities first as they won't work from your hard drive.

    Make Your Pages Load Faster ~ If you want your pages to load faster, you can specify the size of your graphics. The browser will set aside the space for them and continue to load the page while the graphic is loading, instead of waiting for the graphic to load completely.

    Find the Size of your Image ~ To find the size of your graphic simply right click on the graphic, then click VIEW graphic. The width is always posted first, height second. Now you can define them in the tag like this...

    <img src="yourpicture.gif" width="150" height="200" border="0" alt="imagelink">

    Posting border="0" will keep your linking graphics clean without the border around them. Posting alt="____" is simply the name you give the graphic.

    Closing your Tags ~ When you include tags inside other tags, make sure that the closing tag closes the tag that you most recently opened. Do this:

    <p><a> .... </a></p>

    Instead of this:

    <p><a> .... </p></a>

    Bandwidth & Linking ~ With the hundreds of thousands of people on the Internet today, setting up homepages for pleasure and fun or for business, the rage is to own your own domain. If your site contains written html for a graphic, it should look like this:

    <IMG SRC="graphic.gif">

    The incorrect way would be to have your image or midi like:

    <IMG SRC="http://www.not_your_server.net/name_of_image.gif">

    This is called stealing bandwidth. This is using another person's server to display your images and/or music. With all of the free websites being offered today, such as Geocities, there is no reason to link to someone else's images and/or music.

    A WORD OF WARNING ~ Most engineering artists change their images often. Some have taken the strategy of removing one image and replacing it with one that is not quite so becoming. If they have done this and you are linking to their images, you may end up displaying something on your website that could prove to be very embarrassing.

    Go to HTML Index.



    If you would like to reach me, you can email me at:

    MAIL

    BASIC HTML

    ~ CHARO'S INDEX ~
    ABOUT ME CYBERFRIENDS CALLING CARDS
    QUOTES POETRY FREE INTERNET CARDS
    WEBPAGE FINAL CHECK CREDITS MEMBERSHIPS
    AWARDS WEBRINGS HOME

    Last updated: Thursday, September 7, 2000

    Read my Dreambook!
    Sign my Dreambook!     		Dreambook

    CopyrightŠ byCharo1998, 1999, 2000
    All original graphics are digitally
    watermarked for identification.

    This page hosted by   Get your own Free Home Page




    1