Marketer's Space - Responsive Email Design

Marketer's Space - Responsive Email Design

In the previous marketer's space, we discussed about dormant campaigns. The topic for this week's marketer's space is responsive email design and its techniques.

In the recent past, we've witnessed a huge increase of internet enabled devices. The range of device screen size and resolution has widened. So, the email we design will definitely not look the same in all kinds of devices and email clients. Now that being so, it is as important to render our email equally good in all devices and email clients as is designing a creative one. We could easily accomplish this with responsive designing. Unlike static design, responsive design uses fluid widths for columns, definite style for various viewports and multiple breakpoints. Over the week, we shall discuss four different design techniques and the respective html code that could be adopted for responsive email design.

​

Stacking content, images and videos

Stacking content, images, and videos in your email requires more than just an understanding of the basic table structure. Planning out our design ahead of time in a grid with appropriate dimensions is an essential part of the process. Let’s see a simple example of 2 column layout on a desktop that will stack to 1 column on a mobile device. Attached with this post is the html code that can be used to stack content in your email.