Over many years I have helped students and teachers get started on creating their own websites. While working on the Internet in the Curriculum Project some of this material was refined and published.
Outlined below are 5 basic steps to creating a usable web page. It does not really matter what brand software is used so long as it is easy. I mainly use Dreamweaver and occasionally FrontPage. All of these have a graphical interface - I refuse to learn HTML coding. Some of the pages on my site have been edited in 3 or 4 different programs but still work okay as they do not include any non-standard special effects. Once you have made a basic web page you can then concentrate on planning a well designed site - it can have creative graphics, many pages and lots of links but should still be easy to use and quick to download.
Start a new web page in your web authoring software. Type in some text. You can adjust the colour, size, allignment, etc pretty much the same as in a word processor. Give your web page a title - it used when people add your site to their list of favourites or bookmarks. Save your work with a simple file name (e.g. webpage.htm) Do not use spaces or special characters in the filename.
Use a digital camera to take a photo. Make sure the image is no larger than 640 x 480 pixels or you will need other software to reduce (crop) it to a smaller size. Do not click on the image in an editor until you see 'handles' and drag it to a smaller size as this does not reduce the number of pixels! Once the photo has been loaded onto your computer place the cursor where required and insert the photo (via menus or drag-and-drop). The sample image below is only 7 KB and 35 x 45 pixels. You will usually work with a higher number of pixels but as a general rule try to keep the image file sizes below 100 KB for fast downloading.
Links are entered in the web editing software but can only be tested in preview mode or in a browser such as Firefox or Explorer. There are five main types:
- links to other pages in your site (e.g. page2.htm)
- links to other web sites (e.g. http://www.zardec.net.au/keith/index.html)
- links to your email (e.g. mailto:email@example.com)
- links to documents (e.g. slides.ppt)
- links to other places on same page (e.g. #top)
Some working examples are included at the bottom of this page.
Web pages have limited layout options compared to a word processing document (typically no tabs or multiple spaces)
One easy strategy is to insert a table (e.g. 2 rows by 1 column) and place text, images or links in a suitable cell.
The border of the table can be made invisible if required by setting the table border size to 0 (this table has a border size of 1).
- test your site thoroughly in common browsers (e.g. Firefox, Explorer)
- ensure you have sufficient privileges to run FTP (File Transfer Protocol) software
(web authoring software such as Dreamweaver includes FTP tools)
- connect to your web space provider (user name and password required)
- upload all web pages AND all images
- confirm in a browser that your site uploaded successfully