Adobe Dreamweaver, Photoshop & CSS Training - 4 Days

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

HTML

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