Introduction to the Internet - Part 3 - Quick Guide to Writing Internet Pages using HTML

by: David Ledgard

They are two languages for writing Internet Pages HTML (Hyper Text Mark-up Language) - the easy one, and Java - the difficult one. I know next to nothing about Java so will tell you about HTML, the language used to write the BAEC Web Site. Hyper Text is the underlined text you see on Internet pages, that when clicked takes you to another page, or different section of the current page. HTML was invented by a British programmer at the CERN particle accelerator laboratory near Geneva. The project included scientists, engineers and technicians who spoke over a dozen languages, and used over 100 different types of computers. So it was found to be very difficult to pass information from one computer to another, HTML acted as a common standard where by all information was first converted into HTML format and then could be put on a network and available to anyone on any computer. HTML stills works this way not caring which operating system or computer type you use, or even what size your monitor is adjusting the text to fit.

HTML is really just a simple word processor, like on of those really early ones where you entered the formatting codes in yourself instead of selecting them from a menu. There are programs to write HTML code for you, but I find them to be inefficient, you get more control if you write the code yourself. If in Microsoft Explorer for example and you go to the View menu then select Source you will either see some HTML code, or a Java applet which basically decides whether you want to use frame or not, all other Java code is hidden. HTML code can always be read.

HTML uses tags <...> to distinguish formatting commands from text, anything in a tag never appears on your internet page, a </...> tag just deactivates a current tag. HTML never reports errors, jut ignores them, so if your screen doesn't look like you expect it to look you just have to check the code very carefully for backslashes the wrong way, transposed letters etc...

Here are some of the more commonly used tags:

<!-- This is a comment that won't be displayed on the screen, just useful for reminding the programmer of stuff -->

·        <CENTER>Text</CENTER> - Text is centred in the middle of the Screen (don't put CENTRE)

·        <H1>Title</H1> - Title is displayed in Bold and Font 1 (the biggest), the smallest font is H6

·        <FONT SIZE=4>Font</FONT> - Font is displayed in size 4, then the precious Font size is restored

·        <BR> - This acts like a carriage return, forcing the cursor to the start of the next line i.e. New Line

·        <P> - This creates a blank line, then starts the cursor at the start of the next line i.e. Paragraph

·        <IMG SRC="pic.jpg"> - This gets and displays a picture from the place specified. While writing your pages this will be you computer hard disk drive, so keep the code and picture in the same directory. HTML looks the same whether it is derived from your computer or the Internet. Images come in many types including .jpg, .bmp, and .gif. The .gif format is desirable as this uses less space, meaning images download faster, and you can have more of them if you account space is limited. To download a picture from the internet click on it with your right mouse button and save it to your desktop. Packages like Paint Shop Pro (available for a free 2 month trail) allow you to edit current images or create new ones.

·        <A HREF="page2.htm">Click on this to go to page two</A> - This is a Hyper Text link, if you click on it you will be taken to page two, providing it exists and is named correctly.

Tags can be combined:

·        <A HREF="page2.htm"><IMG SRC="pic.jpg"></A> - This will mean if you click on the picture you will be taken to page2

·        <UL> - For Universal List

·        <LI>This is the first entry is a list</LI>

·        <LI>This is another entry</LI>

·        </UL> - This ends the list

If you put <UL TYPE=A>, at the start the entries will be numbered A, B, C... You can also use: a (lower case), I (Roman numerals), i, or 1.

The format of the page, should also have the following Tags, but you can leave them out without damaging the page. They are however used by search engines.

<HTML>

<TITLE>Title of the Page</TITLE>

<HEAD>Put Meta Tags here for Search Engines, these allow then to index your site</HEAD>

<BODY>

This is where everything else goes

</BODY>

</HTML>

You can define your background in <BODY> above:

<BODY BACKGROUND="..."> - Just go to a site, click on the background with your right mouse button (if it is a picture) and choose save as background, save this on your desktop and use in the quotes. Normal pictures can be used as well.

<BODY BGCOLOR ="#RRGGBB"> - Where R, G, and B are Hexadecimal numbers between 0 and 255 e.g. #FF0000 gives you a totally Red background. You could also put =Black, Olive, Teal, Red, Blue, Maroon, Navy, Grey, Lime, Fuchsia, White, Green, Purple, Silver, Yellow, Aqua.

Format tags include:

For more detailed information on tags go to http://werbach.com/barebones/barebone.html

To create your own HTML page, click on you desktop with you right mouse button, choose New then Text Document. Type the following:

<CENTER><H1>My First HTML Page</H1></CENTER>

Aren't I smart.<P>

This is another paragraph.<P>

Just save this as index.htm, if the file says it is going to save it as a text document go to save as type and select *.*. Then the word processor icon on your desktop should change to an internet one. Click on it, and you can see the text. You should call it index.htm as this is the default page that computers look for, meaning an address like https://members.tripod.com/~baec/index.htm

can be shortened to https://members.tripod.com/~baec. You can also use the .html extension but some older computers might not like it, so it is best to stick with .htm. Also limit your file names to 8 characters (plus the extension), it's a lot easier to fix now than later, when you have links all over the place, and have uploaded it to the internet. Use view -> source to edit the text and add more complex tags. Go through the process to create page2.htm then you can link them as described above.

To upload your pages to the internet, you need an ftp (File Transfer Program). I got mine for www.tripod.com

with some free internet space. Once you've got this you just connect to the internet and upload your data to the address they have give you. Of course it's no good having an internet page if no one knows it's there, some people say you should get them listed in search engines but being entry number 200 in a list isn't very helpful, and many search engines won't even list small sites any more. I find getting connected to a WebRing of related sites is much more helpful, or advertising your site in none internet related ways. And before you create a site think whether it is really needed, does the World really need a 101st Star Trek site? After all there are now more Web Pages of the Internet than people on the Planet, no one has time to view them all, and too many of them are full of rubbish. If not, then write about something no else has done yet, or provide material for a popular existing site.

Happy Webmastering!