Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Jeremy Frimond
Jeremy Frimond
14,470 Points

Cross Browser Compatibility & Mobile Friendly for Email Design

Is there a deep dive or learning module which explains coding for you website or emails to look near identical across all the top browsers and mail service providers? I found the module (Coding HTML Email Design) to be very good except for explaining the code which levels out the design across these various platforms and programs. A point in the right direction would be much appreciated fellow Tree-lings!

4 Answers

Paul Graham
Paul Graham
1,396 Points

This is the one and only time I'm ever going to say this to a beginner: use a framework.

Specifically, i'd recommend checking out Zurb's new Ink Framework. If you need to test your code, check out Litmus.

I've coded hundreds of these stupid things over the years and HTML email is a nightmare. It's basically a series of worst practices to be able to address clients that's you'd assume would be capable of even the most basic HTML. I don't want to get into this topic as a whole but basically you're talking about dropping back to HTML 2.0 days where all layout is done in tables and all styles are inlined. It sucks and it's probably the most antipattern of antipatterns that you'll ever deal with as a developer. Just use the framework, it takes out most of the heavy lifting.

Paul Graham
Paul Graham
1,396 Points
Paul Graham
Paul Graham
1,396 Points

It won't hurt to learn a few things about coding HTML email anyway though to know about those bugs and how it works. Here's a few things to check out

http://24ways.org/2009/rock-solid-html-emails/

http://kb.mailchimp.com/article/how-to-code-html-emails/

http://blog.fogcreek.com/responsive-html-emails-a-different-strategy/

Jeremy Frimond
Jeremy Frimond
14,470 Points
Jeremy Frimond
Jeremy Frimond
14,470 Points

Thanks Paul!

Paul Graham
Paul Graham
1,396 Points
Paul Graham
Paul Graham
1,396 Points

In case you're not depressed reading those articles yet, here's part of a real life piece of code NASCAR paid me for last year for a promotional All Star Race email. (not all these hacks are 100% required, but who would care enough to refactor this garbage?)

https://gist.github.com/homosaur/7573082

Yes, this was 2012. I did this by HAND and got PAID ACTUAL US HUMAN CURRENCY. I also missed a nasty edge bug with Lotus because I didn't know about Litmus and was testing by hand. Testing is absolutely critical.

Nowadays, I'd just use Ink.