Resources

Basics of Web Page Creation

Below are tips for creation of web pages. There are many books and online tutorials which will give more in-depth detail on specific topics.<examples here>

File Organization

Store all images in a folder called "images"

Break your web site up into logical sections or topics. Create a folder for each section and save all related web pages in that folder.


An example of how to organize your web site files.

File Naming

HTML web pages should end the the extension: .html

Web pages named index.html will be loaded automatically when a user enters a url without a filename at the end. For example if a user types in http://www.marlboro.edu into their web browser, the index.html page will be sent to the user.

JPEG images should end with the extension: .jpg

GIF images should end with the extension: .gif

File names are case sensitive. hello.html and HELLO.html are different files. You'll save yourself headaches by naming all your files using only lower case characters.

Only use letter and number characters (a-z 0-9) in your file names.

Do not use spaces in your file names. You can use underscore _ or dash - characters to increase the readability of your file names.

Images

Images must be saved as JPEG's or GIF's. All graphical web browsers support these types of images. Most image manipulation programs (PhotoShop, etc.) support saving images as JPEG's or GIF's.

It is recommended to provide "ALT" text for each image. ALT information is a description of the image which is displayed when graphics are loading, or not capable of being displayed. Not everyone uses a browser which can display graphics, and some people don't load graphics by default. Screen readers used by the blind, can also read ALT tags.

Page Layout

HTML wasn't designed for complex web page layouts. However, there are couple ways to arrange images and text on your web page to make them easier to read and better looking. Tables are recommended because older browsers support them. However, do not depend on precise location of text and images because different web browsers may display them slightly differently.