Html files, like computer programs, must be written with an editor that does not insert any characters into the file except those which are keyed in. For example, Notepad.
If you're serious about web programming, you'll eventually have dozens, if not hundreds of files. You'll need to be consistent in naming them, so you won't have to remember how you wrote each name.
Html files can be given either the extension ".htm" or ".html". Pick one and stick with it.
If you always used Microsoft products, it wouldn't matter if you capitalized your filenames or not. 'Filename.htm' would be the same as 'fIlEnAmE.HtM'. At some point, however, you are likely to be using a Unix based web hosting service. With Unix, Linux, etc., your file and directory names are case sensitive. Thus you need a system for remembering whether or not you capitalized them.
It is easiest to just use lowercase.
When a filename has two or more words, I like to capitalize the second and succeeding words: e.g. "bubbleTest.htm". Some folks like to separate the different parts of the name with an underscore, thus: "bubble_test.htm". As before, pick a system and stick with it.
It is easiest to write all html tags, attributes, and other commands in lowercase. This is also best, because it may one day be mandatory.
Some of the most common mistakes in html files are forgotten angle brackets, or forgotten stop tags. To avoid this, it is wise to begin by writing all the angle brackets first, thus:
<><>Then backspace into the brackets, and write the tags:
<h3></h3>Finally write the text.
<h3>Text for Heading</h3>
The same holds for writing text in quotation marks, curly braces, and so on. This simple habit will go a long way toward minimizing programming errors.
Html files may contain comments. Comments are notes you write to yourself, that no one else can see. They are ignored by the browser.
<!-- html comments are done like this Comments may cover several lines. They are for the web page writer's benefit only, as they do not show up in the web page. -->
Web pages commonly use four types of external files:
The browser must be able to find all these files. Here again, you'll need a system so you can remember where the files are.
All files pertaining to a web page can be placed in the same directory.
However, it is helpful to have a directory for images, another for stylesheets, another for JavaScript, and so on. Thus files used by more than one web page need not be saved twice.
This might seem to present a problem, if you build your web page on your home computer, before you upload it to a website. Windows based computers use backslashes for addresses, while web addresses always use forward slashes. It would be horrid to have to go through your files, and change all your image and file references from something like "..\img\filename.htm" to "../img/filename.com".
However, this is not a problem. Your browser will understand forward slashes, even if the directory is on your local Windows based computer. If you always write your addresses with forward slashes, you will be fine. You will be able to upload your page, directories and all, is a few seconds.
Both Windows and Unix based systems use the symbols . and .. for the current and parent directories.
If you are a Windows user, an easy way to open a web page in your browser is to open Windows Explorer, find the file, and double click on it.
If you keep your editor and browser windows both open while you are typing, you can save your results, refresh your browser, and see the results immediately. This not only helps you spot errors in html code, but the webpage is way more readable than the ".htm" file.
Great auk by William Macgillivray
Copyright by Natural History Museum London
Source = The Zoology Museum
Retrieved Dec 2, 2005.
This watercolor was painted by William Macgillivray from a specimen of the now extinct great auk owned by John James Audobon.
Much information on the web can be borrowed, if proper credits are given and permission is obtained. Images, such as this one, can be saved by right clicking on the image, and then "Save Picture As ...", and so on.
