Web Design T5659

Web Production Skills
ABC Awards: Level 3 Award

last updated 8th May 2006

Dreamweaver MX & 8 supported by Imageready CS, Photoshop CS, Flash MX

Thank you to everyone who has attended this course for your enthusiasm, patience and excellent attendance which has made this course one of the highlights of my week - I hope we will all meet again for a social once your work has been assessed and moderated.

Next September Totton College hope to run a Multimedia and possibly a 'time-based' Web design course, both of which will feature more Flash. It would be great to see you back.

Enrol at Totton College Web site

live sites are at http://abc.moonworksmedia.com

Thursday evenings starting 29th September 2005 from 6.30pm - 9pm, with a break for coffee and chocolate about 7.30pm. 24 weeks with a projected end date of 27th April 2006.
Sessions held in the ESF computer suite, Art and Design Department, Totton College, Southampton UK.

This level 3 qualification course will ease your introduction to Web design and help you make more sense of the books and online help that we all have to rely on as we develop our skills in this huge and fast changing field.

Dreamweaver links to online resources. Recommended booklist

Buy Studio 8 at education price of just £88, sadly available only to teachers and some full-time students
or download free fully-working 30 Day trial versions from Macromedia (click the 'try' link)

Free open source Web design software for Windows, Mac and Linux is available at http://www.nvu.com

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 each evening.

Official course qualification document

Week 1  Thursday 29th September 2005
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 MX 2004 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. View source code in Dreamweaver or the browser - a peek at the html code you are creating with Dreamweaver.

Week 2  Thursday 6th October 2005
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.

Week 3  Thursday 13th October 2005
Rollovers in Dreamweaver
More on graphics, creating simple Rollovers and buttons. Dreamweaver writes the JavaScript.

Week 4  Thursday 20th October 2005
Improving layout control
Introduction to using layers to structure your page layout. 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 (800 x 600 or 640 x 480 pixels recommended). Rulers and tracing images.

Week 5  Thursday 3rd November 2005
Dynamic HTML, animated gifs
Simple animation within Dreamweaver using DHTML to move layers around. Converting layers to tables. Animating a gif using Adobe Imageready. Multiple rollovers. Browser compatibility.

Postponed Thursday 10th November 2005
NO SESSION - DUE TO COLLEGE OPEN EVENINGS
Sorry but all evening classes have been postponed on Wednesday 9th and Thursday 10th. A session will be added to the end of the course to compensate.

Week 6  Thursday 17th November 2005
Experiment with Flash animation
Investigate Flash, a natural partner (and perhaps rival) to Dreamweaver.
Flash enhanced sites and online tutorials.

Week 7  Thursday 24th November 2005
Adding interest and enhancements
Adding sound, QuickTime movies, Flash .swf and Shockwave .dcr animation elements. Web video formats.

Week 8  Thursday 1st December 2005
Search engines, META tags, The Q of Q&A
Help search engines with META tags to boost the numbers who find your site... Add links to your own site at wikipedia.org or when leaving comments at an online forum. Making informed decisions about how many of your target audience can access a feature. Domain Names. Submit to Web directories. Question and Answer session to try to resolve any issues outstanding. Your trickier questions will have to wait until next week for answers!

Week 9  Thursday 8th December 2005
Templates, Library Items and Frames
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 frame sets.

Week 10  Thursday 15th December 2005
CSS
Using external Cascading Style Sheets in 8 to master text, control background images and remove underscores from links. Dreamweaver links for CSS including Zen Garden. Free CSS for Dreamweaver MX chapter from the Quickstart guide as an Acrobat pdf file.

Have a Great Christmas and New Year !

Week 11  Thursday 5th January 2006
CSS - A little more...
Back still full of the Christmas spirit - or the hangover from it? HTML is dead - long live XHTML. The semantic Web and CSS - separating content from style. This is a big step towards improving usability for people using alternative browsers and devices such as phones and Palm PDA's. It is also a great help for people with disabilities... as we see next week.

Week 12  Thursday 12th January 2006
Accessibility Issues
Common sense is a big part. Always use Alt text, which along with proper use of the <h1>Headline tag</h1> will also help with search engine ranking. Most sites improve for ALL users once the needs of some users are considered. Testing your site with online tools such as WebXACT (previously Bobby). Lynx text only browser. Lynx user guide. Access keys

Week 13  Thursday 19th January 2006
Progress review
An evening reviewing what you have created so far, where you are going and what additional areas you would like taught: "Navigation Bars, Drop-down menus, more Tables, Flash buttons, transparent GIF buttons..."

Week 14  Thursday 26th January 2006
Upgrading to Dreamweaver 8
Now Dreamweaver 8 has been installed on all PCs, let's see what has changed since MX. More than a single update's worth since we have leapfrogged the version released as MX 2004. 7.30pm - 8.30pm Student Union Cards in Refectory (50p and a passport photo). Drop-down lists and jump menus.

Week 15  Thursday 2nd February 2006
Navigation Bars
Graphics for this exercise can be obtained here. Example at Stone Arts Ltd.

Week 16  Thursday 9th February 2006
Tables revisited
Table spacing and padding. Download this transparent spacer.gif to help control table cell width and height.

Half Term  Monday 13th - Friday 17th February 2006

No Session, you may wish to use the time at home to plan your site or a simple animation.

Week 17  Thursday 23rd February 2006
Using assets & library items for navigation bars
Navigation Bars in Library items and assets, Meta Tags: Keywords and Descriptions.

Week 18   Thursday 2nd March 2006
History of the internet & WWW. Imageready rollovers
History of the Internet and Sir Tim Berners-Lee, inventor of the WWW - wikipedia entry. Imageready rollovers

Week 19  Thursday 9th March 2006
Imageready rollovers, favicons
Rollovers mark 2.

Favicons - the 16x16 pixel images in the address bar and bookmarked favourites list: best try html-kit which also creates animated gifs, plus favicon.co.uk MicroSoft guide and Photoshop plug-in from iconfactory.com Free CSS for MX chapter from the Quickstart guide as an Acrobat pdf file.

Week 20  Thursday 16th March 2006
©, Working on your project site
Copyright © facts. Roger Dean's copyright warning. Using Photoshop to add a text layer with reduced opacity to your images to deter online theft and adding a digimarc from the bottom of the filters menu. Individual review and assistance with project development.

NB Tuesday 21 March
6.00-8.00pm Adult Course Information, Advice and Guidance Event

Week 21  Thursday 23rd March 2006
Photoshop Web Gallery. Working on your site
Creating a Web gallery from a folder of images quickly using Photoshop. Example from Stone Arts Ltd. Individual assistance will be available.

Week 22  Thursday 30th March 2006
Ads, Going Live. Image Maps/Hotspots. Working on your site
YOUR live sites are at http://abc.moonworksmedia.com

Start group Web site. E-mail me at jednet@mac.com for details to access and update these sites from outside college (for security reasons I cannot post the information here!). Image map hot spots to create links on specific areas of a picture. Adding advertising to cover costs or make profits. For pointers about responsible advertising, try this from Jakob Nielsen. Google Toolbar for Firefox on Mac. Individual project assistance will be available.

Adobe (and Macromedia) Events in April 2006

Friday 31st March 2006 - Last day of term for students

Tuesday 18th April 2006 - Start of Spring Term

Week 23  Thursday 20th April 2006
First Session of new term . . . html
Getting all sites live, either to your own hosted space or to the group site at http://abc.moonworksmedia.com
Viewing and printing the source files from a browser, annotating the code. Individual assistance will be available. An article on Web 2.0

Week 24  Thursday 27th April 2006
Final Session
Work on and then hand in your written documentation, annotated code print outs and screen captures in an A4 ring binder marked with your name, e-mail address and phone number.

CSS revision, especially making interesting rollover effect links quickly. A little on html - hypertext mark-up language - coding.

End of course session afterwards as discussed at The Farmouse public house in Totton.

Return of work to be arranged after initial assessment and subsequent college and exam board moderation. Work to be either uploaded to a live site or submitted on a CD, preferably both.

Please keep in touch by e-mail, I will try to help you further as you develop your skills.

free online shopping cart systems :
www.oscommerce.org .php and MySQL system which can be run on Macs, Linux and Windows
www.comersus.com .asp system for Windows IIS servers and can be administered from Macs, Linux and Windows. Advanced features require purchase of a range of options.

recommended paid-for e-commerce solution :
http://www.easywebstore.co.uk good telephone support, cheap, £30 set up, £20 per month thereafter, no long contract. Flexible interface, well integrated with online merchant payment systems such as paypal or the better alternatives such as nochex and protx. No limit on web space or traffic.

alternatives include actinic.com, 1and1.com, ecommercetemplates.com and ekmpowershop.com

Looking for companion or follow on courses in September 2006? I recommend the Tuesday evening Photoshop class at Totton College. Totton College Services to Business also run many relevant courses, call Sue Lambert or Julia Bateman on 023 8081 4578 or 023 80874874 or email: info@servicestobusiness.com

We hope to run a follow-on Multimedia course in September 2006 at Totton College.

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...

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@mac.com