Creating HTML emails with Dreamweaver and Photoshop

2 days

Course Overview

Previously text-based email was the most common way to communicate, but now with the HTML email you can now create and send a message that is much more visually attractive. When the message is designed and built correctly it will motivate the reader to enjoy and respond to the content. HTML emails are often sent as a valuable part of email marketing campaigns.

Course Objective

This course uses two industry leading tools, Dreamweaver CS4 for the HTML, CSS (Cascading Style Sheets) and layout and Photoshop CS4 for the creation of optimized graphics and images. The collaboration of these two programs will enable you to design and create professional HTML emails.

  • How to quickly and easily design and build an effective HTML email.
  • Learn the specific display requirements for webmail and email clients.
  • Understand the various distribution options.

Target student

Graphic/Web designers, or people transitioning into an online marketing or website related job. At the end of the course delegates will have created and built a professional working HTML email.

Prerequisites

This course is aimed at students with little or no experience of HTML, CSS, Dreamweaver or Photoshop.

Course Outline

How do HTML emails work?

  • The bigger picture – webmail and email clients
  • Examples of HTML emails and e-shots
  • Enabling your HTML email to be displayed correctly
  • Building a user friendly HTML email
  • Distribution of HTML emails

Dreamweaver CS4 Overview

  • Introducing Dreamweaver CS3
  • Learning the interface
  • Dreamweaver Photoshop workflow

Photoshop CS4 Overview

  • Introducing Photoshop CS4
  • Learning the interface
  • Photoshop Dreamweaver workflow

HTML Code

  • Understanding HTML code
  • Viewing examples of HTML code
  • Specific HTML email requirements
  • Basic HTML exercises

Getting Started

  • The research process – understanding your readers
  • The design process – effective layout
  • HTML email best practices
  • Email marketing tips

Basic Page Creation

  • Create a new basic HTML page
  • Add and format text content
  • Insert graphics and images
  • Test and preview the page

Page Layout with Tables

  • Overview of tables
  • Designing a page layout with tables
  • Creating table structures
  • Modifying and nesting tables
  • Formatting text, images and data in tables

Links

  • Understanding links
  • Creating links
  • Creating email links

Working with Graphics and Images

  • Overview of web-based image creation
  • Sourcing, editing and optimizing images
  • Creating and manipulating graphics
  • Creating hotspot links
  • Creating image spacers

Testing

  • Testing your HTML email
  • Uploading your HTML and images

Distribution and Delivery

  • Options – Email service providers
  • Plain-text alternative version
  • Creating a mailing list
  • Managing subscribers
  • Scheduling and when to send
  • Tracking, click-through’s, bounces and reports
  • Anti-spam techniques