I’ve recently created a video training course that covers what I like to call The Old School Method of building HTML emails. Using a series of carefully prepared screencasts, I walk through all the steps necessary to plan, organize, and code foolproof HTML emails that work across a wide variety of email applications, operating systems, and mobile devices.
The sample email that I use to demonstrate the method is a real-world example, but the techniques covered in the course will definitely work for general purpose emails as well. It’s a tried and true method that I’ve used for several years. I’ve found it to be one of the best methods to ensure that your emails reach the highest number of email clients as possible. There’s even a handy bundle of exercise files in case you want to follow along with the videos. HTML emails may not be fun to build, but why not learn how to build them using a proven method that could eliminate a lot of the typical frustration and guesswork that you might be experiencing with other methods? Sound good? Then let’s get to it…
Recommended Viewing Order
The course can be viewed in a linear fashion, as a baseline for beginners; or out of order, as a refresher for experienced email developers. If you view them out of order, it’s recommended to view parts 1 – 3 before proceeding to parts 4 – 7, which can be viewed in any order. The short Course Introduction provides a good overview of topics covered in the course as well as some words of encouragement for all developers.
Total training time for this course: 1 hour, 37 minutes
Don’t forget to download the bundle of exercise files so that you can follow along.
Welcome! This video screencast provides a brief introduction to The Old School Method of building HTML emails. We also cover a few helpful points to consider in your own workflow as well as some words of encouragement.
Video duration: 3:15
In the first part of our HTML email training series, we take a close look at the Photoshop design comp and carefully consider the task ahead.
Video duration: 2:23
In the second part of our HTML email training series, we take a critical look at the underlying structure of the “hero” section and plan out our coding strategy.
Video duration: 10:07
In the third part of our HTML email training series, we take a walk through our HTML boilerplate and consider our workspace and tools.
Video duration: 7:58
In the fourth part of our HTML email training series, we dive headlong into the HTML code. No more planning; it’s time to do some actual development.
Video duration: 24:48
In the fifth part of our HTML email training series we continue down the Photoshop comp and add another section of code for the details and questions section. Just a couple more simple sections to go and we’re done.
Video duration: 25:10
In the sixth part of our HTML email training series we add the next section of code from our Photoshop comp. One more simple section to go and we’re done.
Video duration: 15:31
In the seventh part of our HTML email training series, we finish coding the last section of our Photoshop comp and take a final look at the completed email.
Video duration: 7:53