basic HTML tags

To get you started on your homepage...

All HTML documents are written with codes called tags. Tags are put between the greater than, less than signs below the L and K on your keyboard. The tags tell browsers how to set up and read the page.

HTML documents always begin with the html tag <html> The next tag that all HTML documents contain are the head and title tags... <head><title>Title of Page</title></head> the second set of tags with the / in front of the text turns the first set off, you must always turn a tag off once you have turned it on. The last tag turned on is the first tag turned off. Now you're ready to start... Open your text editor (a text editor is the same as a word processor, except with less features. Wordpad that came with Windows 95 should work fine) and begin a new file, type the following lines just as they appear here... <html> <head><title>Practice Page</title></head> <body> </body> </html> The body tag follows the head and title tags, everything in between the opening and closing body tags will appear on your page. You can use the body tag to set backgound, text, and link color like this... <body BGCOLOR="white" text="black" LINK="red"> Try adding this to your body tag... Save your practice page as test.htm, then open your web browser. Go to file at the top left of your browser and click on open file, or open page-choose file. Find test.htm and open it, all you should see is a white page. If you are seeing funny characters somewhere on your page it is probably your text editor, it may actually be a word processor and not a text editor. Word processor come with more features than text editors and sometimes aren't very good for writing web pages. If you are using Windows 95, try the Wordpad that is on your start menu under accessories.

If you are seeing anything else you may need to go back and edit your test page. To put in a background instead of a color use <body background="nameofimage.gif"> instead of BGCOLOR...

Now you're ready for text...

Any text that you type in between the opening and closing body tags will appear on your page...Try it! You can use the <center> tag before a line of text to place it in the center of the page. Otherwise your text will be aligned to the left. To put a break in a line use the <br> tag, and to leave a blank line use the <p> tag. Type the following lines in your text editor... <html> <head><title>My Homepage</title></head> <body BGCOLOR="black" text="white" LINK="red"> <center>This is my first homepage!<p> <center>Comments? Just <a href="mailto:your email address here>EMAIL ME</a> </body> </html> Now save it and go and look... You should see a black page with the words "this is my first homepage!" in the center of the first line in white, and the words "comments? just email me" in the center of the second line. Put the mouse over 'email me' and you should see 'mail to: your email address' in the bottom window of your browser. If you click on 'email me' your mail program should open and set up a message addressed to you.

You can change the size of your text using the header tag, like this.. <H3>This is my first homepage!</H3> You can use the numbers 1-6, with 1 being the largest and 6 the smallest.

Add an image...

Right click on the image above and go to save as...save the image in the same folder as your test html page. Now you can add this image to your test page, and your browser will find it! Do this with the img tag... <img src="mouth.gif"> You can put the image in the center or on the right of your page by using align.. <img align=center src="mouth.gif"> or <img align=right src="mouth.gif">

Add a link...

Now you're ready to put some links on your page. This is done with the <a> tag <a href="http://geocities.datacellar.net/">Geocities</a> Make sure you put the entire web address in the quotation marks! The word geocities appears between the opening and closing <a> tags, so it will be the link... This should get you started on your homepage! You can find links to images, backgrounds, and more HTML help at backgrounds and images.. If you need help or have any questions feel free to EMAIL ME!

Advanced HTML tags

Frames..

In order to put your web page in frames, you will have to write an extra HTML document that sets up the frames, here is the code... <Frameset COLS="20%, 80%" Border="1"> <Frame src="menu.htm" name="menu_frame" scrolling=auto> <Frame src="main.htm" name="main_frame" scrolling=auto> </Frameset> <noframes>This page uses frames...Your browser is frames challenged....</noframes>

The frameset tag sets up the frames, you can use ROWS instead of collums, and you can change the %'s to whatever you want The two frame src tags tell the browser what to put in each frame when the page is first brought up and the name tag names each frame so that you can direct the browser to put links in certain frames. Scrolling can be set to 'auto', 'yes', and 'no'. The no frames tag is for those whose browsers do not support frames, anything in between the opening and closing no frames tags will be seen by people whose browsers don't support frames.

Meta Tags

Meta tags can be used to enter keywords that search engines will find for your page... <meta name="keywords" content="list, the content, of your page, using keywords"> This tag is placed between the <head> and </head> tags.

Buttons...

<form> <input type="button" value="homepage" onclick="window.location.href='http://address'"> </form> The input type tells the browser to display a button, the value is what will appear on the button, and the address is where the link will go...

Back buttons..

This button will take the surfer back to where ever they came from.. <form> <input type="button" value="back" onclick="history.go(-1)"> </form> Thanks for stopping by...I hope this has helped!

Get your own Free Home Page