9 x two-and-a-quarter hour sessions from 18:30 - 20:45hrs Postponed, starting Tuesday April 28th 2015 and running to 30th June 2015 in room 156 (the room previously known G219) in the Media/Hair & Beauty building at Totton College, Water Lane, Totton, Southampton. SO40 3ZX
For further information, contact Jed Gibbs MA by email: jednet@mac.com
Web Design using Adobe Dreamweaver
Intended for anyone who wants to create and maintain Web sites using Windows or Mac computers. Dreamweaver is the industry standard, ideal for anyone wanting to gain employment or design professional sites.
Go straight to this week's information:
Tuesday 28th April 2015
- Introduction to the course, passwords, fire exits, refectory and parking.
Creative Cloud Download free fully-working 30 Day trial versions from Adobe (click the 'try' link) - Setting up your ftp (file transfer protocol) settings to upload your Websites to www.totton.org in Dreamweaver CS5
- Creating Web pages using Dreamweaver's CSS layouts - and experimenting with editing colours and sizes in the header, sidebar and container.
- Inserting a Spry navigation bar vertically or horizontally.
BlueGriffon is a free open source alternative to Dreamweaver that supports HTML5 and CSS3 - review, developer's YouTube examples, and webfonts straight from a menu. Add-ons
Tuesday 5th May 2015
- More options from Adobe's Ajax framework 'Spry' (Ajax = a combination of Asynchronous JavaScript and XML)
- Adding Tooltips, Collapsible Panels, Accordions, Tabbed Panels
- Dw CS5 see Chapter 14 for Spry.
- More Dreamweaver CS5 and CS6 tutorials from Adobe
Tuesday 12th May 2015
- Creating Photogalleries using Adobe Bridge, or Flash and incorporating them into your site. Contact sheets
is a free opensource javascript library that can enhance your sites. It can be downloaded and then included with your site (so you need to remember to upload it to your server!) or you can link to the library on Google or Microsoft servers. Linking has the advantage of always using the most recent version. - interface demo and others, truncatable jQuery tutorials. jQueryui and jQueryMobile
Create an image hover-preview effect using jQuery
- To make photo-galleries (free for non-commercial sites) jAlbum is available for Mac, Windows and Linux
Tuesday 19th May 2015
- Sending an email with images, logos and html layout, useful for product announcements, newsletters and special offers.
- Spry Menu bars (slight return). How to centre and edit them. Also see adobe.github
- using Form options for navigation. Introduction to forms - download chapter here
- Example questionnaire. Example email response.
- Forms usually require a dynamic server-hosted database using MySQL & php/asp/jsp/coldfusion or at least a script to send the details to an email address, which usually needs to be set up by your hosting company. An interesting alternative is wufoo.com which integrates well with Mailchimp - both of which are free for occasional use.
Tuesday 26th May 2015
- Bank Holiday & Half Term: there is no session this week
Tuesday 2nd June 2015
- Individual assistance with your Websites
- Expanding your font options with free Webfonts from Google, FontSquirrel and in May 2013
Adobe Edge Webfonts launched with over 500 free typefaces already. - Tag Clouds - see Tagxedo and others
- Transferring CSS rules to an external stylesheet and then linking them to provide quick site-wide updates.
- Framesets seem to help navigation - why and how they are best avoided.
Tuesday 9th June 2015
Slicing images in Photoshop to improve image quality/file size
optimisation or to create areas with animation
or rollover links. example Also good for cinemagraphs- Animating a gif banner or button using Photoshop's Animation tools
Tuesday 16th June 2015
- Online books and/or video tutorials from creativeedge.com, lynda.com, Total Training and VTC
- The Semantic Web and CSS - separating the content from the layout and styling makes it easier for screen readers to help the visually impaired and also helps you when you want to make changes.
- Creating whole Web pages in Photoshop/Fireworks and then slicing to optimise image quality/file size. Editing in Dreamweaver to create areas with animation or rollover links.
- Usability 101 from Jakob Nielsen (creator of Google's sparse interface)
Tuesday 23rd June 2015
- Meeting the 'success criteria' for W3C Web Content Accessibility Guidelines 2.0
- Search engine optimisation to boost the numbers who find your site, including META tags, alt text and title tags.
- Monetizing your Site: Adding advertising to your site helps pay for hosting and your time and effort in creating your site. An hour or so setting up some ads can repay you many times over for years to come... As a bonus most advertisers give you access to lots of analytic tools and having a well-known brand advertise on your site can lend some extra credibility to your content (since most advertisers will inspect your site before granting their approval). Add advertising revenue to your site through Tradedoubler and LinkShare affiliate schemes or through independents large and small, such as Amazon.co.uk (Note that ads supplied from external sites may be blocked by some security software and especially by Janet - the academic internet provider used by most colleges including Totton. To get the most from this section you will need to browse from home afterwards).
You can choose from a range of sizes and style of banner ad, either just one or a collection or 'pool' which will be rotated. Some advertisers offer an ad which they update to show their latest offers - I had one from Game but dropped it when they advertised Grand Theft Auto on an otherwise small-child-friendly site.
Google provides a system called AdSense which will add text links automatically and pay you commission. They also offer AdWords, where you are the advertiser and pay for example £50 a month to have certain 'keywords' that people search for result in your ad appearing to the right (or above) the natural search terms. You then pay Google say 17p from your £50psm whenever someone clicks through to your site. A good way to get more business for new sites that might not feature well in the search engines until you get more established.
- Advice about responsible advertising from usabilty expert and Google interface designer Jakob
Nielsen also his "Making Web Advertisements Work" It's obviously a good idea to try to match your ads to your visitors - hence this ad for 123-reg is perfect for my Dreamweaver courses, the more so since I have been recommending them for years without commission:
- online shopping cart systems:
www.oscommerce.com .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 
Which leads us to ethics. Would you advertise a product to make money, if you preferred a competitor that you don't have a deal with? How much would that damage your site's credibility and/or make you lose pride in your site? Do you disclose to your readers that you will receive commission from ads (isn't it obvious? Well no, especially from simple text links, such as which are often a surprisingly good option as people tend to filter out obvious graphical ad banners).
Tuesday 30th June 2015
- Individual assistance with tidying up your Websites and uploading
- A look at Dreamweaver CC 2014, including jQuery support, often replacing Spry, CSS designer and the reorganised insert panel and menu.
- WordPress is a useful free alternative to Dreamweaver with many Web 2.0 interactive features available without coding, and usually for free or a small fee. MakeUseOf.com provide a free pdf guide to creating a WordPress website along with several other guides available just through free registration. Sign up!
- Using Dreamweaver to edit WordPress plus chapter to download
aptana Web and rails development
Are there any resources or materials required?
The software is installed on the college computers. For students wishing to do additional work from home free 30 day trials are available from Adobe. Student rates for the software are available and will be discussed on the course.
Are there any other costs?
Free basic Web hosting will be provided for the duration of the course together with advice on purchasing a domain name (.tk addresses are free, .coms and .co.uk about £7 per year) and ongoing hosting (from free to expensive).
How will I be assessed?
No formal assessment. Help during the sessions & via email support. Totton College course completion certificate.
What are the entry requirements?
No previous experience required but some content may be challenging as the software is for professional-level use.
Contact us
For further information, contact Jed Gibbs MA by email: jgibbs@totton.ac.uk
Tel: (023) 80 874 874 • Fax: (023) 80 874 879
Web: www.totton.ac.uk • Email: info@totton.ac.uk
Alternative free open source software for Windows, Mac and Linux:
BlueGriffon supports HTML5 and CSS3 or nvu for Web design | GIMP alternative to Adobe Photoshop
5 alternatives to Photoshop (see comments for more, including Aviary from worth1000.com)
Dozens of books for CS3, CS4 and CS5 versions of Dreamweaver and Photoshop are available. A free Safari Books Online account will let you compare before buying, or you may decide as I did to subscribe to Safari. Follow a Safari link next to any book in the ad widgit below to get a free 10 day account. (If the slightly temperamental widgit is empty please refresh the page... )
Online video training is available from Adobe, Lynda.com, VTC and Total Training
