Creating a Responsive HTML Email
4,280 students enrolled
Creating a Responsive HTML Email
Create attractive, responsive, HTML Emails, that work in over 30 combinations of the most commonly used email clients.
4,280 students enrolled
Current price: $13.99
Original price: $19.99
Discount:
30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
- 1.5 hours on-demand video
- 2 downloadable resources
- Full lifetime access
- Access on mobile and TV
- Certificate of Completion
Training 5 or more people?
Get your team access to 4,000+ top Udemy courses anytime, anywhere.
Try Udemy for Business
What you'll learn
- Learn to create an HTML Email layout compatible with a wide range of email clients
- Discover techniques to design elements that will "gracefully degrade" in older email clients without losing the design integrity
- Add CSS to your HTML Email to take advantage of newer email clients and varying screen sizes
Course content
Expand all
34 lectures
01:43:30
+
–
Introduction and Set-up Files
4 lectures
04:55
+
–
Creating the Graphics
2 lectures
05:46
Creating the Banner and Background Graphics.
03:26
Creating content graphics for multiple screen sizes.
02:20
+
–
Creating the HTML Email
7 lectures
18:16
Creating the Base HTML Structure.
03:37
Formatting and styling the logo row.
02:24
Formatting and styling the headline row.
02:32
Formatting and styling the content row.
02:51
Formatting and styling the promos row.
02:55
Formatting and styling the callouts row.
02:47
Formatting and styling the footer row.
01:10
+
–
Creating Buttons with HTML and CSS
2 lectures
06:39
Converting links to buttons with CSS.
02:06
Creating a call-to-action button.
04:33
+
–
Adding CSS to the Email
6 lectures
26:29
Adding the media queries for medium and small screens.
04:22
Switching the headline and banner for smaller screen sizes.
03:14
Adjusting the layout for content and footer for smaller screens.
03:04
Adjusting the promos for smaller screens.
04:45
Adjusting the promos for callouts for medium screens.
05:35
Adjusting the promos for callouts for small screens.
05:29
+
–
Pushing the Envelope
6 lectures
27:45
Setting custom inbox preview text.
01:39
Using web fonts in your email.
02:20
Adding HTML5 video into your email
06:13
Encoding and embedding base64 images
04:44
+
–
Validation and Testing
5 lectures
10:11
Validating the code of you HTML email.
01:42
Suggested adjustments for Blackberry 5 OS.
00:54
Suggested adjustments for Lotus Notes 6.5, 7, and 8.5.
01:14
Requirements
- A modern web browser, capable or viewing responsive design
- An HTML/code editor (free or commercial)
- Willingness to do some coding
- A little bit of patience
Description
Did you know that over 46% of email is now read on mobile devices?
Designing HTML email can be quite challenging, considering the limited capabilities of many email clients (readers). In contrast, most new email readers supports many of the latest trends in web design. What to do?
Enter Responsive HTML Email. This course will show you how to design and construct an HTML email design that will render properly in such email readers and Outlook 2003 and Gmail, all the way through modern Android, Apple, and Windows phones. We will also explore online tools and services that will help you test your campaigns. Learn what is possible with HTML email.
Running Time: 88 minutes
Who this course is for:
- Designers, marketers, or anyone tasked with creating HTML Emails across a range of screens and devices.
Featured review
Dawn Calder-Murphy
(
16 courses,
5 reviews
)
a year ago
A great course! Very detailed yet still easy to follow and understand any new concepts. I particularly appreciated the info about creating different graphics according to high resolution screen needs, and the way the differences were explained. The lesson on setting client expectations was also brilliant - this is something that should be addressed in any design or development course, because it seems to be a big stumbling block between creatives and their clients.