So the Lion is the HTML Designer… actually lets drop the weak analogy before it wears thin. Start again. WYSIWYG is in the air at the moment, in the email marketing air.
There are more and more tools aimed at helping us email marketers do our jobs and it’s had me thinking — what are we actually trying to achieve here?
Email HTML is a tricky business. In recent years web HTML has grown up — with HTML5 and the eventual demise of the worst offending browsers it’s become easier to think more about design and less about rendering problems. The situation for email, on the other hand, has seen less improvement. For us the rise of mobile has not been met with better standards compliance or the decline of the trickiest rendering engines to work with.
Our medium, then, is one that requires some specialist skills to work with. This is where WYSIWYG comes in. If the marketer (or copy writer, journalist, translator, startup CEO) can edit the HTML without HTML skills then it all gets a bit easier. You don’t need to be an HTML expert to change the headline anymore. On the face of it the problem is solved. But if we dig a bit deeper some fundamental questions remain:
- WYSIWYG editors make it easier to edit the HTML document, but where does the document come from to start with?
- Why are WYSIWYG editors not universally loved by designers?
- What are the roles in the email flow in a post-WYSIWYG world? who needs which skills?
For designers WYSIWYG is all about templates. The marketer can build emails from templates and the designers and coders roles becomes a mixture of producing templates and images — or other assets — to be pulled into the templates. Once a template is built it’s natural to want to build several emails with it, and pretty soon we realise we want slightly different elements in each. We can built lots of near-identical templates — this doesn’t feel quite right so instead we enter a world of drop zones and blocks. The template has quickly evolved from a kind of lorem-ipsum version of a single email to a set of email-lego from which content can be built — thus the phrase ‘master template’ has entered our lexicon.
While WYSIWYG editors save marketers time there are inevitably some trade-offs compared with hand-coded HTML. To begin with the nature of HTML does not lend itself to visual editing and the situation — as ever — is trickier with email HTML. Furthermore editor implementations are often adapted from HTML editors aimed at producing content for the web so concepts like outlook-specific html extensions are very poorly supported. Responsive html becomes difficult or impossible because of details around DTDs and the <head> tag. Within these boundaries they do a good job but the limitations can be very frustrating for coders used to hand-building the highly nuanced HTML needed to get the best performance across all clients and devices.
Thinking about roles — in a world with master templates the designers and coders produce templates which contains all of the design elements and the WYSIWYG editor lets the marketer produce content. From this perspective the role of the WYSIWYG editor is not strictly about making email HTML easier anymore, it’s about helping marketers put content into master templates.
Taxi is opinionated. From its inception, Taxi For Email was built with clear ideas about what the role of the templates and role of the content editor should be. We never aimed to let marketers edit all of the HTML. We decided to make a pact with designers:
- Taxi won’t break your code or impose rules on how your HTML is structured
- In return you have to tell Taxi what can be edited and how
The tags used to control what can be edited are called Taxi Syntax. We knew that designers knew as they built a template how each thing can be edited. This may sound trivial, for a headline we just change the text inside a <h1>tag. But for a background image that works across clients the same image url needs to be used in 3 places. This is easy to express in Taxi Syntax. A marketer is never exposed to the detail — a single image upload is all it takes — the background picture changes and it works in all the clients. Things are as they should be.
A designer also knows how designs should change when content is added or removed. When there is no text in a CTA button it may make sense to remove the button completely, including a tr or td surrounding it — again, this is easy to express. Perhaps the margin of the surrounding div needs to be different when the button is gone — of course we can do this too.
Taxi Syntax was built collaboratively by a designer and an engineer — it leverages some software engineering principles in ways that feel intuitive to HTML designers. It is simple but flexible, the principle of convention-over-configuration is used — this amounts to intelligent defaulting which allow the most common requirements to be met with very simple code. More detail needs to be added to the Taxi Syntax code to do more unusual things but nothing is out of bounds.
In summary Taxi allows designers to go beyond building a big lorem-ipsum email containing all of the design elements. Taxi syntax gives an easy way to express those thoughts that the designer always had about how and where the content can be changed. It becomes easy for designers to produce powerful, intelligent templates. Marketers get a more focused, relevant, editor experience.
Email marketing is a complex business — at Taxi For Email our approach to templates is only part of the reason we allow fast and easy production of emails. We work hard with marketers to make Taxi meet all of their challenges from managing large teams and handling segmentation to plain text versions — but that’s another whole story. And the Lion? Well the master template is a Lion because it’s powerful, or perhaps it is a wardrobe full of content elements…
Revolutionise your email workflow
Not using Taxi? Get started today—take a free trial or book a demo.