Every day the web continues to progress at a rate of knots that a speed boat would struggle to keep up with, allowing for richer and more interesting experiences for users. Emails on the other hand still feel like they were left back in the 90’s, when table layouts were the best way to display content in a pleasing manner. There has been some progress over the years, the more modern email clients will allow CSS and div tags to be used to help style up your new template, but unfortunately there are still plenty that will look at it like it’s not even there.
This means that pretty much all templates will need to use a table layout to ensure that what is designed looks accurate enough when it is received in a user’s email inbox. Even though we use tables, that still does not guarantee a 100% recreation in every email client, as some will disregard some rules but listen to others. So when we were asked to build a large template containing a selection of different layouts to allow a client to pick and choose the elements/layouts they want, you can imagine the look on our faces. Building a new template is a long process as you use trial and error to make sure it displays in a readable manner while looking about 90% like the design. It is much easier to use another already tested template as your base and build on that, testing as you go, which is what we did.
Litmus is where we went for a readymade template. Litmus themselves provide an email client testing service, allowing you to enter your template code and letting litmus show you how it will look on a number of browsers, so we knew these templates would be a great start to build on. It still required a fair bit of work though, we still had to adapt our base template to the skeleton layouts we were given by our design team. As a side note it is a lot easier to work with a design team that understands the difficulties and limitations of email templates, so we were lucky to not have to explain this to them.
After all the layouts were placed in to a large template and tested within a browser it was time to test it in the email clients we support. Even though we had a tested base template, the additions made meant we still had content not displaying as it should. It still became a case of trial and error on certain elements within the template. Our chosen email testing platform was Email on Acid - similar to Litmus) and after fiddling with a lot of inline styles we got the template to a standard we were happy with.
The next step was to place this into the Kentico CMS and allow our clients the ability to pick and choose from the elements provided. Not only does Kentico allow our clients to create a selection of layouts using some flexible widgets and articles currently on their site, but it also allows our clients to manage marketing campaigns from within.
The template also allows us to go back to design in the future so that they can use it as a base for any custom designs a client may want. This will speed up the whole procedure of creating new email and newsletter layouts, while making it easier and less stressful for the front end development team to build them. There will still be some testing, but it will be considerably shorter. Everybody wins :-).