Open Source Resources for Web Application Developers WebAppers - Hunting the Best Open Source Resources for Web Developers

A Guide to CSS Support in Email

Designing an HTML email that renders consistently across the major email clients can be very time consuming. Support for even simple CSS varies considerably between clients, and even different versions of the same client.

CampaignMonitor has put together this CSS support in email clients guide to save you the time and trouble of figuring it out for yourself. With 21 different sets of results, all the major email systems are covered, both desktop applications and webmail. It comes with the PDF and Excel version for download.

A Guide to CSS Support in Email

Source: A Guide to CSS Support in Email

As web designers, we’ve grown pretty good at understanding how to create a modern, semantic, accessible website using XHTML and CSS. We understand what makes a good website, and how to make it happen.

When it comes time to design emails though, do all the same rules apply? Are there things we should be doing specifically for email that don’t make sense on a website? Campaign Monitor has published an article of 2008 Email Design Guidelines that shows us the technical, design and information elements that make up a successful HTML email.

  • Don’t waste your readers’ time — An email inbox is a busy place, you won’t get much attention.
  • Permission matters — Not only do you need to have permission to email people, but it helps to remind them of how they gave you permission, as specifically as you can.
  • Relevance trumps permission — Just having permission is not enough, the content you are sending must also be relevant.
  • Make unsubscribing easy — There’s no point emailing people who are not interested.
  • Image blocking is common — You can’t rely on people actually seeing your images.
  • Bring back tables — Structural tables are still often necessary for creating columns.
  • Add inline styles — Gmail removes anything else.
  • Don’t forget your plain text version — You can make blocks of text more readable.
  • Meet your legal obligations — For example, CAN-SPAM for US senders.
  • Test, test, test — It’s the only way to be confident about your design working.

Source: 2008 Email Design Guidelines

AtMail is an open source webmail client written in PHP. They aim to provide a elegant Ajax webmail client for existing IMAP mailservers, with less bloat and a focus on an intuitive, simple user interface.

Open Source Webmail

The open source version of AtMail provides users with a lightweight, yet powerful webmail client. The software can be installed on a variety of platforms with ease and without the hassles that most webmail platforms impart. Traditional desktop mail clients are in decline; the future of email is via a web interface. AtMail is poised to deliver the next generation in Open Source Webmail.

Open Source Webmail

Requirements: -
Demo: http://atmail.org/demo.php
License: Apache 2.0 Open Source License

David Greiner from Vitamin explains what you need to do to ensure that your emails not only look great in today’s email clients but also actually make it to where they’re going. Getting your email to look good is only one piece of the puzzle, so he has dedicated the second half of this article to recommendations on how you can improve the chances of your emails actually getting delivered. This article is really well written and useful, you should not miss it if you would like your clients / readers can read your emails properly.

View the full article on Ensuring your HTML emails look great and get delivered.

Source: http://www.thinkvitamin.com/features/design/ensuring-your-html-emails…

Getting your email to look great in all the major email clients can be a challenge at times, so Campaign Monitor has done the hard work for you with 30 free email templates. They have tested them in all the major email clients, so add your own content and you’re all set. Grab all 30 templates in a single 113k zip file from 30 free HTML email templates.

email.png email2.png

However, not everybody has an email client that can show HTML, and some people just prefer plain text. CampaignMonitor got permission from the creators of three really well designed plain text newsletters to share modified forms of their format with you, which should save you some time and make sure that your plain text readers aren’t missing out. You can view them on Plain text templates and formatting tips.

email3.png

Requirements: No Requirements
Demo: http://www.campaignmonitor.com/resources/templates.aspx
Demo: http://www.campaignmonitor.com/resources/plain-text-templates.aspx
License: License Free

RoundCube is a modern webmail solution which is easy to install and that runs on a standard PHP/MySQL configuration. The skins use the latest web standards such as XHTML and CSS 2. There are many exciting features RoundCube provides, for example, Multilingual capabilities, Full support of HTML, Find-as-you-type address book integration, Spell Checking and Complete customization with skins. RoundCube Webmail is released under the GPL License. Everyone is welcome to download and use it, deploy it and to re-distribute it.

roundcube.gif

Requirements: Server with PHP and mySQL
Demo: http://roundcube.net/?p=demo
License: GPL License

Web Resources Menu

Web Component Resources

Web Design Resources

Extra Resources

Search Site

Advertise on WebAppers?