Here we are, after traveling back in time. Think of the late 90s and designing with tables; oh yes, you read right, designing with tables.

Today, things are not any different when it comes to creating e-mails: we have to use tables for layout. Why? It's simple. There aren't any wars. E-mail client wars, that is.

Unlike the browser wars of 1995, where Netscape and Internet Explorer battled for market supremacy, e-mail clients have been living their own separate lives practically oblivious to each other since anyone can remember.

Thanks to the browser wars, we now have such awesome standard-compliant browsers that are full of features, customization capabilities, constant updates, and so on, making everyone's online life a bit easier.

E-mail clients, on the other hand, evolve at their own pace and that pace is slow because there really isn't any competition. Moreover, the vast majority of corporations are already locked in with Microsoft's Outlook. In the more recent versions of Office, Outlook has actually become worse than its earlier counterparts, thus not really helping the e-mail landscape improve in support of more modern technologies.

To top this off, there are e-mail clients that are relatively new and radically reject support for the <style> element or even media queries altogether.

But e-mail is an incredibly efficient and formidable marketing tool that—regardless of the level of technology—we need to be prepared to work with soon or later.

In other words, e-mail as a medium of communication is not going anywhere any time soon, and we as web designers/developers have to design e-mails with tables and inline styles.

But don't worry, I will show you that with the basic principles of RWD, a little bit of common sense using progressive enhancement, and by always trying to keep things simple, designing and implementing responsive e-mails is not difficult and can be fun.

In this chapter, we're going to talk about the following topics: