From: RafiBomb Date: Fri, 1 Apr 2016 05:49:02 +0000 (-0700) Subject: adds more content to tips and tricks page X-Git-Tag: v2.1.0~1^2~1 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=03ae8737c6e89bda93c058007d7d714e5296cfde;p=thirdparty%2Ffoundation%2Ffoundation-emails.git adds more content to tips and tricks page --- diff --git a/docs/pages/tips-tricks.md b/docs/pages/tips-tricks.md index e75b5857..36a36a0e 100644 --- a/docs/pages/tips-tricks.md +++ b/docs/pages/tips-tricks.md @@ -12,19 +12,19 @@ Most responsive emails are built on templates. Theyâre simple, easy to drop co A framework is a collection of reusable code and design patterns which gives users a solid, tested base upon which to build. Not a bunch of visual styles you can just bolt on as an afterthought and call it a day. - Frameworks give you the solid base of a template, but the extensibility of custom code. You can make your template fit your content, not the other way around. -- Additionally, a framework gives you a common codebase to structure your projects around. You can spend less time coding your email. No more re-inventing the wheel. +- Additionally, a framework gives you a common codebase to structure your projects around. So if new team members work on the project, they don't have to re-invent the wheel. You can spend less time coding your email and more time optimizing your campaigns. ## Need to know The sad truth about creating or coding HTML emails is that tables are the only thing that is universally supported when it comes to email design. If you came from the world of building websites, this may seem like a stepping into Doc Brown's Delorean, charging up the Flux-capitor, and going back to the 1996. Suddenly your CSS is written with inline style tags, useful CSS properties don't work and you're burried in a sea of table tags. -It's not all doom and gloom though, and we're all in this together. Foundation for Emails helps by getting you away from tables (Sass version), helping you with an organized project structure, and a well tested codebase to make this much easier. We've put together a guide and links to resources from our friends to help you along as well as a new [Responsive Emails master class](http://zurb.com/university/responsive-emails-foundation) to become a HTML email pro. +It's not all doom and gloom though, and we're all in this together. Foundation for Emails helps by getting you away from tables (Sass version), helping you with an organized project structure, and a well tested codebase to make this much easier. We've put together this guide and [links to resources](http://foundation.zurb.com/emails/resources.html) from our friends to help you along as well as a new [Responsive Emails master class](http://zurb.com/university/responsive-emails-foundation) to become a HTML email pro. --- ## HTML -**Email Container Width** +#### Email Container Width The email equivalent of the browser window is the "viewport", or the area in an email client dedicated to showing the actual email. This varies quite a bit. @@ -36,15 +36,17 @@ The height of your email doesn't matter as much because people scroll. It still ## CSS -**CSS Support** -Support of CSS properties varies greatly between email clients. You're best off sticking with the basics and not getting to fancy. +#### CSS Support +Support of CSS properties varies greatly between email clients. You're best off sticking with the basics and not getting too fancy. -This guide will really save you some pain when writing CSS: +This CSS compatibily chart will really save you some pain when writing CSS: [CSS Support Chart](https://www.campaignmonitor.com/css/b/) For some things you can do and work-arounds, see the Progressive Enhancement section below. -**Inlining CSS** +--- + +#### Inlining CSS Gmail strips the `` (and, consequently, `