Creating a small Web site       
Totton College logo

last updated 6th June 2009

Dreamweaver CS3 supported by Photoshop, using Macs but the same software is available for Windows

Saturday 6th June 2009 from 12.30pm - 4.00pm, with breaks.

Room 164
Totton College

Dreamweaver links to online resources. Recommended booklist

Download free fully-working 30 Day trial versions from Adobe (click the 'try' link)

Free open source Web design software for Windows, Mac and Linux is available at

Activities are subject to change depending on the needs of the group. There should be some time for you to work on your own sites in addition to the subjects discussed.

Introductions and first Web page
Introduction to the course. Setting up your site. Create first Web page using page properties, the toolbox and properties inspector. index.htm page. Setting typefaces, font size, style and colour. (If using CS3 you can make it use html font sizes of 1-7 by changing preferences>general and unchecking the box for 'use CSS instead of html tags'). Adding a second page and links. Previewing your Web site in a browser by pressing F12 or choosing File > Preview in Browser > Safari . or clicking on the little globe symbol to the right of the title box. View source code in Dreamweaver using the Split button at the top left of your window or in a browser - a peek at the html code you are creating with Dreamweaver can be helpful when resolving problems.

Personalise your site with images
Adding your own pictures from disc, by scanning or digital photography. Editing images with Adobe Photoshop or Imageready. Optimising graphic file formats: jpeg, gif and .png.

Rollovers in Dreamweaver.
More on graphics, creating simple Rollovers and buttons. Dreamweaver writes the JavaScript.

Improving layout control
Introduction to using layers to structure your page layout. Converting layers to tables for version 3 browser compatibility. Using tables to improve layout. Table spacing and padding. Download this transparent spacer.gif to help control table cell width and height.

Spell checking. Designing for your readers using the Window Size pop-up to prepare your site at a suitable size (955 x 600 for 1024 pixel wide screens recommended).

Onto the Web
Testing your site so far. Browser compatibility.

Dynamic HTML, animated gifs
Simple animation within Dreamweaver using DHTML to move layers around. Animating a gif using Adobe Photoshop. Multiple rollovers.

Experiment with Flash animation
Investigate Flash, a natural partner (and perhaps rival) to Dreamweaver.
Flash enhanced sites and online tutorials for those who would like to know more.

Adding interest and enhancements
Adding sound, QuickTime movies, Flash .swf and Shockwave .dcr animation elements.

Search engines, META tags, The Q of Q&A
Help search engines with META tags to boost the numbers who find your site... Making informed decisions about how many of your target audience can access a feature. Domain Names. Submit to Web directories.


Templates, Library Items and Frames, CSS.
Templates and Assets such as Library items help ensure consistency throughout your site and allow faster site-wide modifications. Frames may help navigation but we look at some consequential problems and some alternatives to framesets. Using internal and external Cascading Style Sheets to master text, remove underscores from links and control background images.


online shopping cart systems:
.php and MySQL system which can be run on Macs, Linux and Windows .asp system for Windows IIS servers and can be administered from Macs, Linux and Windows

To add advertising revenue to your site, click on this ad for tradedoubler. It's easy, free and you might make back the cost of your course...

For pointers about responsible advertising, try this from Jakob Nielsen

© Jednet 2000-2018. External links are of course subject to change.
Jednet cannot be held responsible for other people's sites.
If any of these links are broken or lead to unsuitable content please contact

jednet home page