HTML Email Bootcamp
via Noble Desktop
Affiliated with Course Report
Build responsive email layouts in Noble Desktop's HTML Email Bootcamp. The course applies HTML and CSS to the constraints of email clients, including single- and multicolumn designs, images, and mobile styling. You practice adapting code so a message can be read across different applications and screen sizes.
What's included with live classes
- Free course retake within one year to refresh the material and gain practice.
- Course workbook
- Class recordings
Overview
Email marketing is a core component of marketing campaigns. In this hands-on course, you’ll learn how to code emails with custom-designed layouts and graphics to engage your customer base. Learn how HTML and CSS are used to code emails, and how the coding techniques differ from those used to code webpages.
Learn to code responsive emails that adapt to look great across different device sizes. Learn how to send emails, from initial tests to final sends, using an email service provider like Mailchimp.
Prerequisites
You should have HTML and CSS coding experience equivalent to our Web Development with HTML & CSS class.
Topics included
Schedule & enrollment
Find dates that fit your schedule, then book on Noble Desktop.
- Live tuition
- $425
- Course length
- 6 hours
All class times are Eastern (ET).
-
Dates
Class time
Starts at 10am ET
Final session ends at 5pm ET
Attend
In-person or live online
-
Dates
Class time
Starts at 10am ET
Final session ends at 5pm ET
Attend
In-person or live online
-
Dates
Class time
Starts at 10am ET
Final session ends at 5pm ET
Attend
In-person or live online
Confirm current dates and availability on Noble Desktop before booking. Enrollment opens in a new tab.
Self-paced tuition & enrollment
Learn through recorded lessons on your own schedule.
- Tuition
- $425
- Course length
- 6 hours
- Format
- Self-paced online
This course is available for 30 days. You can choose when to start your access period. Once you activate, you will have 30 days to complete it (access the course materials, quizzes, projects and videos). You may request one extension of seven (7) days. Other extension requests will be evaluated on a case-by-case basis. Videos are not downloadable.
Loading enrollment options…
Prefer to enroll directly? Open the course website.
Curriculum
What you'll learn
- Learn how to code effective HTML email messages that are cross-mail-client compatible
- Build and work with multiple layouts, including single and multi-column layouts
- Gain a deeper understanding of email-friendly HTML and CSS, and how to manage issues across different email clients
- Create responsive emails that adapt across various devices
- Optimize images and swap graphics to enhance mobile device compatibility
- Use media queries to fine-tune mobile styles
Course syllabus
Section 1
Simple Responsive Layout
- Coding the table structure
- Fixing a gap below images
- Making the email responsive
- Introduction to CSS media queries
2-Column Layout: Media Queries
- Coding the nested table structure
- Writing styles for desktop & mobile versions
- Media queries for fine-tuning mobile responsive design
- Modifying media queries
Mobile-Friendly Column Layout
- Coding the table for the 2-column content
- Converting the mobile layout to 1-column
- Adding the other date listings
- Refining the CSS
Section 2
Optimizing Images for Mobile
- HTML email image quality: a balancing act
- Dealing with hi-res/retina images
- Swapping the banner on mobile
- Further optimizing the mobile banner
Responsive Footer
- Structuring the footer layout
- Styling the footer
- Optimizing the footer for smaller screens
Sending Tests & Email Fixes (Preflighting)
- Adding a preheader to entice mobile users
- Inlining the CSS
- Sending test emails
Self-paced course
Learn through recorded lessons on your own schedule.
This course is available for 30 days. You can choose when to start your access period. Once you activate, you will have 30 days to complete it (access the course materials, quizzes, projects and videos). You may request one extension of seven (7) days. Other extension requests will be evaluated on a case-by-case basis. Videos are not downloadable.
View self-paced tuition & enrollmentEmail marketing plays a key role in modern marketing campaigns. In this hands-on course, you’ll learn how to code custom-designed email layouts and graphics that help engage your audience. You’ll explore how HTML and CSS are used specifically for email development and how these techniques differ from coding standard webpages.
You’ll also learn how to build responsive emails that display well across a range of screen sizes, along with the full email workflow, from testing to final delivery, using an email service provider such as Mailchimp.
Self-paced prerequisites
You should have HTML and CSS coding experience equivalent to our Web Development with HTML & CSS class.
Self-paced curriculum
What you'll learn self-paced
- Learn how to code effective HTML email messages that are cross-mail-client compatible
- Build and work with multiple layouts, including single and multi-column layouts
- Gain a deeper understanding of email-friendly HTML and CSS, and how to manage issues across different email clients
- Create responsive emails that adapt across various devices
- Optimize images and swap graphics to enhance mobile device compatibility
- Use media queries to fine-tune mobile styles
Self-paced syllabus
Section 1
Simple Responsive Layout
- Coding the table structure
- Fixing a gap below images
- Making the email responsive
- Introduction to CSS media queries
2-Column Layout: Media Queries
- Coding the nested table structure
- Writing styles for desktop & mobile versions
- Media queries for fine-tuning mobile responsive design
- Modifying media queries
Mobile-Friendly Column Layout
- Coding the table for the 2-column content
- Converting the mobile layout to 1-column
- Adding the other date listings
- Refining the CSS
Section 2
Optimizing Images for Mobile
- HTML email image quality: a balancing act
- Dealing with hi-res/retina images
- Swapping the banner on mobile
- Further optimizing the mobile banner
Responsive Footer
- Structuring the footer layout
- Styling the footer
- Optimizing the footer for smaller screens
Sending Tests & Email Fixes (Preflighting)
- Adding a preheader to entice mobile users
- Inlining the CSS
- Sending test emails
What's included with self-paced
- Course workbook
Course Reviews
Is this course right for you?
HTML and CSS coding experience is required. Choose this course for the email-specific application of those skills. Compare the HTML Email Certificate if you also need the underlying webpage coding instruction before tackling email compatibility.