Create Amazing Responsive Email with Foundation for Emails 2

Create, Prepare and Send HTML Responsive Emails that works, say goodbye to hard HTML for emails! 100% practical course!
4.8 (23 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
168 students enrolled
84% off
Take This Course
  • Lectures 33
  • Length 2 hours
  • Skill Level All Levels
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works


Find online courses made by experts from around the world.


Take your courses with you and learn anywhere, anytime.


Learn and practice real-world skills and achieve your goals.

About This Course

Published 6/2016 English

Course Description

Foundation for Emails 2 makes really simple the process of creating AMAZING responsive Email.

This is a 100% practical course, with 2 projects, we will create our projects, test them with Litmus and finally send through MailChimp

This course si 100% code, if you´re not a coding person don´t be scared, with Foundation for Emails the amount of code is minimum and i´m gonna show you how to start with nothing and finish with two amazing Emails.

Most of the courses out there only taught the coding part, here we´re gonna test our emails before delivery and finish the course sending them through MailChimp, the most popular Email Marketing Tool.

By the end of the course you will have all the tools you need to start developing AMAZING, Responsive Email that looks consistent in different services like Outlook, Gmail and more.

Start developing amazing Responsive HTML Email for your Blog, Business our work with this course!

What are the requirements?

  • A Code Editor (i will be using atom)
  • We will install the ZURB Stack, so a computer with internet and the administrator password is enough
  • We will type some commands in the terminal or windows command promp, don't be scared, everything will be shown in the screen and won't take more than 5 minutes :)

What am I going to get from this course?

  • Create Amazing Responsive Emails with Foundation For Emails 2
  • Deliver your Email with Mailchimp
  • Test before sending with Litmus
  • Learn Inky, a new Template Language
  • Understand the ZURB Stack
  • Understand the weird parts of Email Design and work with a really easy to use tool like Foundation for Emails 2

Who is the target audience?

  • If you're a blog owner, business person, designer, developer that one to learn the most efficient and easy way to develop your emails, this course is for you!
  • Received a scary quote by a designer to develop the emails for your company or blog? in this course you will learn everything you need to know to do it yourself!
  • If you're not a coding person, don't be scared, i will teach you everything you need to know with ease

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.


Section 1: Introduction to Foundation for Emails 2

Let´s see a quick introduction to Foundation for Emails 2


If you're using MAC this video is for you, here we will install the ZURB Stack


if you're using Windows, this video is for you, here we will install the ZURB Stack in Windows 10


This is a practical course, in this video you will find the images that you need to follow along the course

Section 2: First Project: E-Commerce Newsletter

So let's start working creating our first project with Foundation CLI, this might take a while installing, but it really worth it!


Foundation for emails, created a whole structure, let's review the most important files and let's write our first code


Let's continue working with our design, let's add an image with Inky and some titles


Understanding the grid is one of the key concepts, let's learn the grid in 5 minutes :)


Let's finish the products section, adding and changing images and titles!


Let's add a custom stylesheet, that will hold all the custom CSS


Let's finish the Products or Designs Section for this newsletter!

Working with the Footer and a Social Network Menu

Let's add the final styles to this Newsletter before we add our images to the server


You can use a server or you can use Dropbox, if you have a small list, you can use dropbox which is free :)


Your email needs to have inline styles, but that's really boring, thanks to the ZURB Stack you can do so with just one line in the terminal


Litmus is free, and will help you to test your email before sending, let's see how this thing works!


Now that our email is ready, we can deliver it using Mailchimp, a  service with a really cool plan for free users


Let's see the final product in Outlook, Gmail for desktop and smartphone 

Section 3: Second Project: Newsletter for Travel Blog

Time for the second project, here we're gonna be using more inky, less CSS and more ZURB Stack tools like Partials!


Before we start, let's copy our images to our project and create the partials!


Let's start working with the Header of our project


Let's work with the Post of the Week section in this video


Let's style the Post of the Week section with some SASS


Let's continue working, time to work with the Recommended Post section for this newsletter


Let's work with another Component, the Callouts, and let's see how you can modify a UI Element


Let's add some SASS to our Tips 


Time to finish the Travel Tips section, small and easy fixes in this video :)


Let's create a Footer for this Newsletter


Let's change our images from Local to a Server using Dropbox


Before we send our email, let's add inliner to our work


With litmus you will ensure that your email isn't broke, let's see how this design looks with Litmus before sending


Let's send this with Mailchimp, you have to feel really proud of yourself, if you came to this stage :) you started with nothing and now you have a product that you can share with the world!


Let's see the result of our hard work :)

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Juan Pablo De la torre Valdez, Freelance Web Developer and Owner of Easy-WebDev

My name is Juan Pablo De la torre Valdez, i´m from Guadalajara. Mexico.
For the last 10 years i been working with the web, i have a lot of experience in modern Web Technologies such as Foundation, Bootstrap, RWD, WordPress, Drupal, PHP, JavaScript & jQuery, HTML5, CSS3, SASS and Photoshop.

I started a company called CreativaWeb where i design and develop WordPress based websites.

I really like to design and develop websites, in the recent years i made hundreds of websites for Government, Universities, Startups and Medium-Size Companies from my city, the whole country and  from another countries.


Soy diseñador y programador web desde hace más de 10 años, tengo amplia experiencia y trabajo diariamente con tecnologías como Foundation,  Bootstrap, WordPress, Drupal, PHP,JavaScript y jQuery, HTML5, CSS3, SASS y Photoshop.

Comencé una compañia llamada CreativaWeb, donde principalmente diseño y desarrollo sitios web en WordPress.

Me gusta combinar mi trabajo en diseño y programación; en los años anteriores he hecho cientos de páginas para dependencias del Gobierno, Universidades, Pequeños y Medianos de negocios de mi ciudad, a nivel nacional y de otros países.

Ready to start learning?
Take This Course