Notes from the Dev logo teal

Notes from the Dev Live Edition: Email Developer Q&A

They say that "two heads are better than one." Well, how about three? I was excited to be part of a developer Q&A session to close out Email Camp 2022 with a couple of fellow email geeks. We're bringing that panel discussion to you here as a special live edition of Notes from the Dev.

The second day of Email Camp 2022 was all about email development. It included a live coding tutorial with Jay Oram, and some deep dives into dark mode as well as interactive email ideas. I also joined Avi Goldman from Parcel to talk about ways to majorly improve the efficiency of email design systems.

Of course, this developer Q&A session was sort of like our grand finale. Anne Tomlin of Emails Y'all and Shani Nestingen, a lead developer and designer, joined me to answer some big-picture questions from the community. Then, we also took a bunch of bonus questions from the live, online audience. (Our charismatic host/DJ joined us as well.)

Getting to pick the brains of your peers always reveals awesome ideas and insights, especially when the brains belong to people like Anne and Shani. You can watch the entire session below.

And... if you want to be there for real next time, make sure you subscribe to Email Camp updates. We'll let you know about dates, speakers, and more - because Email Camp 2023 is only going to get better.

Notes from the email developer Q&A

Shani, Anne, and I kicked off the developer Q&A with a few topics that get a lot of discussion in the email geek community.

We'll give you the TL;DW (too long didn't watch) if you're more of a reader, but you'll hear everything we had to say if you check out the video. So, scroll back up and hit that play button.

What designs are frustrating and​ time-consuming for devs? How can designers make our lives easier?​

The big takeaway from this question... loop the developer in as soon as possible.

Most email developers don't mind a bit of a challenge. But, there are some things that are pretty close to impossible to pull off in the inbox. So, consider including marketers, designers, and developers in those campaign brainstorming sessions. Then, let your devs get a look at your email designs with plenty of time before you pass them along for coding.

"Use us as consultants very early on. If you have an idea, talk it through with us. Because we can avoid many of those pitfalls..."

~ Shani Nestingen

Get more on designer and developer collaboration in a round-up of advice from a bunch of folks in the email world. Plus, find out how an automated email pre-send checklist helps the whole team.

How should we optimize for lean emails?

Keeping your emails lean and clean is important for several reasons, an important one being that Gmail clips messages that are more than 102kb large. Anne and Shani provided these quick tips:

  • Think lean from the start: Try to limit the code you need to use at the beginning of the process so there's less to clean up later.
  • Streamline your tables: The more HTML tables you have the more it adds to your load.
  • Keep your CSS clean: Take advantage of reusable styles and classes.
  • Keep your images as small as possible: That 102kb limit in Gmail does not include images. However, huge graphic files will cause loading problems in the inbox.
  • Be aware of your ESP: Is the platform you're using adding unnecessary code and causing bloat?

"If you don't need to add that extra bit of CSS, don't add it. Because that could be the one thing that puts you over the edge, and now your footer isn't showing in Gmail."

~ Anne Tomlin

Find out more about Gmail clipping and get some tips on how to minify email code.

How do you handle nuances with live text​ and challenging designs​ with different languages in coding?​

Here's one thing everyone in this developer Q&A believes in: Live text is an absolute necessity. That means you should limit the copy that goes on the graphics in your email design.

For one thing, live text is essential for email accessibility. People using screen reading software to engage with your messages can only hear actual text, not the words you add to images and graphics (which should have alt text). Plus, many Outlook subscribers will have images turned off by default. If important information is inside an image, people could easily miss it.

When it comes to multiple languages, Anne talked about a campaign she worked on recently. Her approach is to use Handlebars if/else statements rather than coding separate emails for each language.

One of the challenges with multiple languages is how different words are significantly longer or shorter. That can really throw off your email design and layout, so you need to pay attention. Have you seen some of those German words? They're super long. Shani suggested "future-proofing" your email design for other languages by using white space to leave extra room in case your emails are translated and localized down the road.

"I'm always a believer in a lot of negative space around chunks of live text... Giving some space and breathing room allows a little bit more flexibility if you're thinking about multiple languages in the long run."

~ Shani Nestingen

Learn more about how screen readers work, and get some advice on how UTF-8 encoding works for special characters in emails, including characters for non-Latin-based languages.

How do you code accessible​ templating systems?​

The big picture answer here is that you need to understand how to code accessible emails to begin with. Then, if possible, you should consider accessibility as you build your email design system - not after the fact.

That includes evaluating your brand's color schemes for good contrast and including descriptive alt text for any images in your email templates. All three of us also support the idea of testing your templates and campaigns to find any accessibility issues that you may be missing. Accessibility checks are part of the Sinch Email on Acid platform and you'll also find them in Parcel if that's your preferred email editor.

For even more on this topic, you can check out our email accessibility guide and explore the Mailjet report, Accessibility in the Inbox to view survey results on how marketers are addressing email accessibility.

The bonus questions

We had so much fun doing this developer Q&A panel that we ended up extending Email Camp beyond our scheduled stop time. There was a lot to talk about, and our audience stuck around to ask us even more questions.

Here's just some of what we discussed:

  • The benefits of designers who can code and coders who can design
  • Advice and resources for getting started with email development
  • Some thoughts on the future of email development
  • And more!

Got your own questions about email development? You're in luck. We're part of a great community of developers, designers, and marketers who are ready to help out. Join the Email Geek Slack community to start connecting with your peers.

You can also reach out to me, Anne, and Shani on Twitter...

And don't forget to subscribe to Email on Acid's YouTube channel. That's where we'll be publishing new episodes of the official Notes from the Dev: Video Edition. Finally, if you did miss Email Camp this year and want to check out some of our other sessions, you can find them on the Mailjet YouTube channel.

Boost ROI with Accessible Emails!

People all over the world live with visual impairments. How many of them are on your list? Can they read and act on your email campaigns? Email Accessibility is about more than just improving your reach. It shows empathy for every subscriber. Use Sinch Email on Acid to check accessibility before you hit send.

Try Campaign Precheck Free