Creating an Email Newsletter in Photoshop and Dreamweaver
In this tutorial, we'll learn how to design and develop an email newsletter.
What you'll learn
In this tutorial, we'll learn how to design and develop an email newsletter. Throughout these lessons, we'll create an email newsletter for a fictional company. We'll start with a wireframe design and convert it to a true concept using Photoshop. Then we'll slice and export our design images and code out the email in Dreamweaver with standard code techniques that are commonly used to build out HTML emails.
Table of contents
- Reviewing Pre-production 6m
- Utilizing a Wireframe for Content Placement 10m
- Adding External Assets 9m
- Slicing Images 9m
- Preparing Images for Export 8m
- Coding the Basic Email Structure 9m
- Adding Tables and Inline CSS 7m
- Finalizing the Code Layout 10m
- Adding Main Body Content and Styling Copy 7m
- Adding Second Column Content and Styling Copy 7m
- Setting up Styling for Hypertext Links 10m
- Establishing a Responsive Email Design 6m
About the author
Andy Mitchell is an interactive designer in the Atlanta area and currently designs email, banner, and social media placements for an agency in the retail sector. His interest in the interactive dates back to his previous career in audio engineering when he did sound design for “new media”. Andy has worked in both in-house and agency roles creating for clients such as NOPI Motorsports, Care.org, College Board, Quebecor, Benjamin Moore, Callaway Golf, Kodak Dental, Verizon, Coca-Cola, Home Depot, ... more