Receive a 10% discount on all training bookings made throughout July 2011
Training Enquiries
For all training enquiries:
07872 037590

Adobe Dreamweaver, Photoshop & CSS Training - 4 Days

Adobe Dreamweaver TrainingAdobe Photoshop TrainingCSS Training

Platform: Windows PC and Apple Mac

Courseware: Comprehensive training manual provided per person

Prerequisites: Basic knowledge of Windows or Apple Mac operating system

Software version: Adobe Dreamweaver versions CS5.5, CS5, CS4, CS3, 8, MX 2004, MX and Adobe Photoshop versions CS5.5, CS5, CS4, CS3, CS2, CS, 7, 6, 5.5

Course Overview:
This 4 day hands on training course is designed to give you sound knowledge of web design using Dreamweaver, Photoshop and CSS . You will first learn how to use Adobe Photoshop to create a wide variety of professional web ready graphics and backgrounds before moving on to Adobe Dreamweaver and CSS. You will first look at planning, creating and maintaining sophisticated web pages with Dreamweaver before learning how to use CSS within Dreamweaver for precise and standards compliant control over your page content.

This training course is perfect for those who want an in-depth look at Web Design using the industry standard Adobe applications and CSS.


Dreamweaver, Photoshop and CSS - 4 Day Training Outline

Training Course Introduction - Dreamweaver, Photoshop and CSS Overview

  • About Adobe Photoshop, Adobe Dreamweaver and CSS
  • How to plan a successful web project
  • Understanding compliant web design
  • Implementing CSS
  • Working with graphic types for the web


Day 1 - Working with Photoshop

Web Graphics

  • About Photoshop
  • Working with bitmap and vector images
  • Images on the web
  • Download considerations
  • Planning and preparation

The Interface

  • Interface overview
  • Opening and importing images/graphics
  • Creating new documents
  • Navigation and magnification
  • Saving customised workspaces

Basic Image Manipulation

  • Cropping
  • Resizing the image for onscreen display
  • Working with image resolution for web
  • Using the RGB colour mode
  • Making greyscale images

Image Enhancement

  • Basic levels
  • Basic curves
  • Using Hue and Saturation
  • Using the Channel Mixer
  • Creating sepia effects
  • Sharpening images with Unsharp Mask

Correcting Mistakes

  • Undo shortcuts
  • Using the History palette

Working with Selections

  • Using the range of selection tools
  • Working with selection options
  • Saving selections to channels
  • Loading selections
  • Editing selections
  • Transforming selections
  • Feathering images with selections
  • Editing selected content

Changing Image Content

  • Using the retouching tools
  • Working with the paint tools
  • Using the History Brush


Day 2 Morning Session - Photoshop Continued

Working with Layers

  • About Photoshop layers
  • Creating/deleting layers
  • Automatic layer creation
  • Adding text layers
  • Hiding/locking layers
  • Setting layer attributes
  • Transforming layers
  • Blending layers
  • Working with layer effects
  • Text layers
  • Creating shapes and paths
  • Editing & transforming shapes
  • Using adjustment layers for non-destructive editing
  • Creating various gradient effects for CSS backgrounds

Preparation for Web

  • PSD documents for preservation and future editing
  • Flattening layers for export
  • Slicing images for faster download
  • Export slice options
  • Working with the Save for Web feature
  • File formats - JPEG, PNG and GIF
  • Optimising files in the correct format
  • Saving and exporting images


Day 2 Afternoon Session - Working with Dreamweaver

Concepts and Preparation

  • About Dreamweaver and Web Design
  • Understanding HTML
  • Planning a web site
  • Screen design considerations
  • Creating efficient web pages
  • Web browsers
  • Download times
  • Images, animations and PDF’s
  • CSS content

Web Site Structure

  • Setting up a local site
  • Using the site window
  • Setting preferences
  • Site management
  • Creating a new file

The Assets Panel

  • About the assets panel
  • Adding and deleting objects
  • Adding objects to a page
  • Organising assets

Working with Text

  • Adding text
  • Importing text
  • Text formatting
  • Basic HTML styles


Day 3 - Dreamweaver Continued


  • Understanding HTML
  • How browsers and search engines read your pages
  • Viewing HTML
  • Editing in HTML code view
  • Effective tips and techniques for HTML

Working with Graphics

  • Placing graphics on a page
  • Using image formats: GIF, JPEG, PNG
  • Applying and changing attributes
  • Positioning text to graphics
  • Working with the colour palettes
  • Using safe colours
  • Creating alternate text

Working with Hyperlinks

  • Internal and external links
  • E-mail links
  • Working with anchors

Basic Interactivity

  • Creating rollover buttons/images
  • Creating a navigation bar

Working with Tables

  • Creating a table
  • Table attributes
  • Absolute and relative measurements
  • Nested tables
  • Applying contents and colour

Page Layout

  • Planning your page
  • Using tables for layout
  • Using layout mode
  • Working with layers
  • Manipulating layers
  • Tables versus layers


Day 4 - Using CSS with Dreamweaver

Cascading Style Sheets

  • CSS planning
  • Using CSS selectors including classes
  • Using external, embedded and inline styles

Styling Text

  • Using custom classes for text
  • Targeting HTML tags
  • Controlling text properties with CSS

CSS for Images and Backgrounds

  • Adding background images
  • Creating repeating and fixed backgrounds
  • Setting image borders
  • Styling a lists with images

Tableless Design

  • Understanding CSS positioning rules, relative vs absolute positioning
  • Understanding the difference between fixed and fluid designs
  • Nested Div's
  • Using Background Images to style Div's
  • Creating CSS based navigation with text and images
  • Working with Dreamweaver Spry objects

Building Templates

  • Building and applying templates
  • Advanced template techniques
  • Adding optional regions and repeat regions to a template
  • Working with editable regions

The Upload Process

  • Checking links and preparing the site
  • Setting server details
  • Uploading
  • Synchronising/editing posted files



Training Availability and Bookings | Training Prices | Training Information

If this Web Design outline does not match your requirements bespoke training is available.

If wish to discuss any aspect of your Web Design training please do not hesitate to contact me


Related Training Courses


Back to top


Home | About | Graphic Design Training | Web Design Training | DTP Training | Bespoke Training | Training Prices | Availability | Training Information | Contact
Training courses are available onsite throughout the UK including Leeds, Sheffield, Manchester, Birmingham, Liverpool, Newcastle, London, Cardiff and Edinburgh