When the Wine and Spirit Education Trust (WSET) called to ask for an overhaul of their emails, how could this girl who takes gin* as a tax deductible refuse? WSET are all about excellence – providing qualifications in wine, spirits and sake. They needed quite a few MailChimp templates so my starting approach was to wireframe, usually a step reserved more for full scale websites. This wireframing step helped both myself and the client get to a quicker design layout, so more time could be spent on photography, colour and type. Also retina images for the logo and header were chosen – making sure everything could be read super crisply on iPad.
One quirk that came up in testing was for Android. Frustratingly the header section appeared broken, shortened down to almost 50%. I built this email using the fluid technique, coding images and inside container tables to 100%. These email builds work really well on mobile and fablets, like the iPhone 6s and Galaxy S7. The only problem is, Android reads the fluid width as 100% of the content, rather than the table, so the content gets shrunk down to fit itself, not the width of the table.
I decided to make the header table 2 columns and 2 rows, and the header image this time split into 2. By creating this structure we get the correct result… the forward button and social icons are forced into a 100% width, and the retina logo and image fill the space perfectly. Cheers!