Dynamic Emails using iFrames?

Dynamic Emails using iFrames?

Recently we read with interest about the Detroit Pistons sending emails to fans that displayed dynamic information when the emails were opened.

What Movable Ink - the agency behind the emails - are doing is changing the image every time there is a change in the scoreline, traffic congestion, or similar.

The image is located on a single URL, so when the customer opens the email they are getting/pulling the image which has the latest Detroit Pistons match score. Without knowing technically what is going on behind the scenes, it is hard to see how or if they are getting around caching problems. If a customer reopens the email - we suspect it will then show the old score (or content). That said, reopening of emails is not a core journey, so the idea is still strong.

 

 

It got us thinking about dynamic emails in our Monday morning cuddle meeting (Where we discuss 'cool' things we've seen) . We discussed the issues around emails and how we might try to make them dynamic. You may have heard about video in email; unfortunately that is only supported by Apple Mail. :(

We then discussed the old-school element, iframes.

If you’ve never heard of an iframe - and no, they are not an Apple invention - then that’s probably because they are considered a bit old-school and not often used due to security implications (search clickjacking and framejacking for example) and styling and UX problems, and many consider their very use to be bad practice. But we didn’t want to dismiss it out-of-hand without looking further at their potential use to provide dynamic information into emails. After all it is what they were built for:

The HTML Inline Frame Element represents a nested browsing context, effectively embedding another HTML page into the current page.
https://developer.mozilla.org/en/docs/Web/HTML/Element/iframe

Upon a quick search, we found an old article and can see that it is not widely supported

Most articles on the subject just seemed to state “it’s not widely supported, so don’t bother”. We wanted to dig a little further...

However, there are some big clients in that list that have a Yes next to their name: iPhone/iPad, Thunderbird, Windows Mail. So it is not to be sniffed at.

 

In fact, by our calculations, in November 2015 it would be approx. 61.5% that do support iframes (as always, there are assumptions baked into this figure).

The top client listed is Apple iPhone; this might mean people are on an iPhone but using an email app like Gmail. Or it might mean the default Apple Mail app. If the latter, then this means the #1 client does support iframes!

Given that MailChimp shows us the recipient’s ‘preferred’ email client and we can target it:

We could potentially send two versions of the same email, one that is dynamic using iframes to email clients we know support them. With fallback, static emails would be sent to those recipients using a client that doesn’t support iframes.

However, we already knew we were very far from having the idea working. Anyone that has ever tried to use an iframe know they are riddled with rendering and styling issues, add to this the fact that creating code for email clients is like time-warping back to the 90’s and having to use table based layouts, we just knew this might lead to nowhere.

Another thing popped into our heads: surely the mere fact that we hadn’t seen examples, articles or blogs advocating the use of iframes in emails and so many people were discounting it, surely meant people had tried this before and failed. 

But we wanted to be sure. We moved on…

We created a simple test on the excellent Litmus site/service, using our Watch newsletter to see the initial results:

 

It was quickly clear that it was a mixed bag, Apple Mail 8 and 9 were showing the iframe, but not listening to the width attribute. Outlook 2002 was showing the iframe and at the size we specified. The full results, of clients that could render the iframe, that we were able to test were:

Email Client

Showed iframe?

Looked correct?

Lotus Notes 8

Yes

Yes

Outlook 2016 on OSX

(Didn’t work on Windows)

Yes

Yes

Outlook 2000

Yes

Yes

Thunderbird (38)

Yes

Yes

iPhone (tested 5s, 6, 6s, 6 plus, 6s plus) on OSX 7,8 and 9

Yes

Yes

iPad (tested retina, mini) on OSX 9

Yes

Yes

Android (default client, 4.4)

Yes

Yes

 

Clients that rendered the iframe but didn’t apply the width attribute:

Apple Mail 8

Yes

No (ignored width)

Apple Mail 9

Yes

No (ignored width)

N.B We were unable to test: Apple Mail 3 and 4, Outlook Express 6, Windows Mail and Windows Mobile 6

We still have some big concerns that using iframes can't be used, such as:

  • We think certain email providers and services may strip iframes from sources due to the aforementioned security concerns.
  • If you reopen the email later - whilst offline, we presume the iframe content won't have been cached.

But our initial tests showed some interesting results and we are going to do some more checks and see if we can get a real working example to see how this might be utilised using iPhones and iPads which take #1 and #3 on the market share list. Obviously we'd advise that if you are going to try using iframes in emails you should only do it to clients you know it works on (do multiple tests) and only use sparingly for additional/supporting information in the email rather than for essential information.

Have you come across any dynamic or innovative emails?

 

Want to discuss a project?

Got a question? Want some more detail? We'd love to hear from you, contact Jason on +44 (0)1923 261166 or jason.treloar@clock.co.uk.

Related

screenshot-1.jpgRead
Article
9 August 2016

Pokemon Go!

Whether you're a "goer" or not, this is a MUST read...

#clockculture-opt2.jpgRead
Article
10 November 2015

#ClockCulture

Our culture here is intangible and something you’ll only understand by living or working in it, but that won’t stop me from trying to describe it to you.

Balloonsv2.jpgRead
Article
6 November 2015

Clock - Happy 18th!

Close your eyes and take yourself back to November 1997. It was a very different time. Syd Nadim, founder and chairman of Clock was a mere 23-year-old lad with a dream.

IMG_4325.JPGRead
Article
3 September 2015

7 Unspoken Rules of Twitter

Everyone knows how to use Twitter. So, here’s an idea, why not have an article that outlines all the things you should avoid doing?

Come and work for Clock

Clock is made up of bright, hard-working and talented people and we're always on the look out for more. You can browse the current jobs below or follow us @clock for the latest vacancies.

View Latest
Vacancies