Sponsor

2008/09/19

Design View #49 - Litmus Testing and New Birds at the Aviary

The SitePoint Design View #49 Copyright (c) 2008
17 September 2008 PLEASE FORWARD
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
The Official Design Newsletter of SitePoint
by Alex Walker (design@sitepoint.com)

Read the HTML version of this newsletter, with graphics, at:
http://www.sitepoint.com/newsletter/viewissue.php?id=5&issue=49

INTRODUCTION - - - - - - - - - - - - - - - - - - - - - - - - - -

"Web apps for designers" is the theme for this month's issue of
the Design View.

Last month's HTML email article generated a ton of great
feedback, with a number of readers recommending the Litmus [1]
email testing suite. I spent this week test driving their system
and I'll give you my first impressions.

Meanwhile the Aviary team [2] continue to churn out new and
innovative graphics apps. I'll profile their three public
betas--Phoenix, Peacock, and Toucan.

Enjoy, and don't forget we'll be at Web Directions South [3] in
Sydney next week. SitePoint are sponsoring the final night party
and I'm currently flush with drink cards.

Hope to see you there.

Alex Walker
Editor
SitePoint Design View

[1] <http://litmusapp.com/>
[2] <http://a.viary.com/home>
[3] <http://www.webdirections.org/>

SPONSOR'S MESSAGE - - - - - - - - - - - - - - - - - - - - - - - -

HostGator eats up the Competition with their newly priced plans!

Whether you are a web designer, or a small site owner; HostGator
offers a web hosting plan to fit your needs. With their Hatchling
Plan starting at $4.95 ranging to their Reseller Plans and Dedicated
Servers you will definitely have room to grow.

Host Unlimited sites on our Baby Plan!
- Disk Space: 600 GB
- Bandwidth: 6,000 GB

Along with superior support and a features like instant backups,
99.9% Uptime plus an all new 45 day money back guarantee you will
be glad you chose HostGator.

Sign Up Now and Receive the first month Free!
http://secure.hostgator.com/cgi-bin/affiliates/clickthru.cgi?id=sitepoint-092008
Coupon: SitePoint

IN THIS ISSUE - - - - - - - - - - - - - - - - - - - - - - - - - -

- Introduction
- Litmus Email Test Suite
- Aviary: Three Birds in the Wild
- Latest Tutorials
- Hot Discussions
- New Blogs


LITMUS EMAIL TEST SUITE - - - - - - - - -

Read the HTML version of this article, with graphics, at:
http://www.sitepoint.com/newsletter/viewissue.php?id=5&issue=49

If there was one thing I learned last month, it's that I'm
certainly not alone in wrestling with the HTML email beast.
Dozens of readers relayed their horror stories and I picked up a
few useful nuggets of gold along the way.

For instance, did you know GMail completely strips out ANY
negative margin declarations--along with any positive margins
declared at the same time?

In the last issue, I talked about our use of the excellent
Campaign Monitor [1] testing suite, but a number of readers
pointed out an alternative: Litmus [2]. As testing is so
fundamental to good HTML email, I thought I'd take it for a test
drive and give you my thoughts.

Perhaps the first thing to note is that the Litmus service
covers a slightly different set of tasks to Campaign Monitor.
While Litmus allows you to test both HTML email AND standard web
browser content, they don't currently offer any mail distribution
services.

On the positive side, this does simplify the interface a lot.
Still, it might be nice if there was a natural, built-in path to
a reputable, third-party sending service for users who haven't
solved that issue yet. Maybe partnerships will develop in the
future.

THE BASICS

Litmus provides a very simple, well-planned interface, and I was
able to dive straight in and start using it almost immediately.
Although their service currently only tests against 14 mail
clients, they've done a respectable job at selecting the most
important ones.

Specifically, they currently test against:

- Gmail (earlier version)
- Live Hotmail
- AOL Mail
- Yahoo! Mail
- Outlook 2000
- Outlook 2002/XP
- Outlook 2003
- Outlook 2007
- Lotus Notes 6.5
- Lotus Notes 7
- Lotus Notes 8
- Apple Mail 2.1
- Apple Mail 3
- Gmail

Running a test is a simple process. Rather than uploading your
email template (like other services), Litmus requires you to
actually send your email to a temporary email address that they
create for you.

Apart from this being a slightly more intuitive approach to
testing an email (i.e. to mail it), I think it has one killer
advantage over other testing suites.

Since every email you send is treated as a stand alone entity,
you can keep and compare earlier tests with more refined
versions. As with any web development, often fixing a bug in one
browser can create a new bug in another browser; therefore, being
able to look back through your tests and isolate exactly where
the problem originated is a huge benefit.

FULL CLIENT PREVIEW

Sometimes it's hard to appreciate a feature until you start
using it. While I've tended to obsess about what is happening
directly in the rendered mail window, there are other important
matters to consider.

Firstly, what are your readers seeing BEFORE they open your
email?

It's tempting to assume they'll only see your subject line; the
reality is, they'll often see snippets of HTML and CSS you're
not expecting them to see. Litmus shows you the preview and
partial previews your users will see when your email arrives.

Remember, if these previews aren't sensible and attractive, your
user may not even open your beautifully-crafted email, so it
requires some serious thought.

The other thing I liked about the Litmus service, was that each
test captures the entire mail client; that way you can get a
sense of how your mail will look in its natural setting.

How would this affect what you design?

Well, if you expected the majority of your users to be viewing
your email in the pastel blue world of Outlook 2007, you may
choose to steer away from certain colors that don't sit well
with that shade of blue.

Either way, it certainly gives you a more accurate idea of what
your user will be seeing.

THE NEED FOR SPEED

Litmus is fast--in my experience around 2--3 minutes for one
full set of tests. This makes it practical for you to make
incremental changes to your email design, then re-test without
having to go away and make yourself a coffee--or five!&#160;

In other words, while it&#160;still makes sense to conduct your
early testing on a set of 4 or 5 local mail clients (as
explained in the last issue [3]), Litmus is fast enough to allow
you to work through those curly rendering bugs towards the end of
a project.

PRICING

The Litmus pricing structure seems to me to be a good fit for
most designers and developers. They offer a three-tier system:

1. a single-user 24-hour license (US$24)
2. a single-user one-month license (US$49)
3. a multi-user one-month license (US$199)

Each of these packages offer unlimited tests within the allotted
period, so as long as the system remains fast and responsive as
demand increases, it's pretty good value in my opinion.

SPAM ANALYSIS

The Litmus team are also developing a service that grades your
email for its spaminess against filter services such as
Brightmail, Barracuda, and Positini. At the time of writing,
this service is still in the beta/data gathering phase, but it
will (presumably) soon flag spam triggers within your email, and
suggest less spammy alternatives.

SUMMARY

I may be wrong, but it seems to me that the Litmus team have
arrived at their service from a slightly different starting
point.

While services like Campaign Monitor have created testing suites
to sit on top of their mail delivery system, Litmus have expanded
their standard browser testing service to cover email
development.

For me, this makes Litmus better suited to designers and
developers, rather than, say, email marketers looking for a
quality check before sending.

Although their range of test clients is slightly reduced
compared to other email testing suites, the flexible pricing and
test turnaround times are going to make Litmus an attractive
option for many developers.

If you're working with HTML email, check it out.

[1] <http://www.campaignmonitor.com/>
[2] <http://www.litmusapp.com>
[3] <http://www.sitepoint.com/newsletter/viewissue.php?id=5&amp;issue=48&amp;format=html#7>

SPONSOR'S MESSAGE - - - - - - - - - - - - - - - - - - - - - - - -

EXPAND YOUR BUSINESS WITH W3 MARKUP

Rely on us to get more projects completed each week! We provide:

* Pixel-precise hand-coded Valid CSS & (X)HTML for any project
* Theme or "skin" implementation into popular software like:
WordPress, Drupal, Joomla, MovableType, Blogger, Pligg,
Textpattern, Typo3, osCommerce, Shopify, X-Cart, SMC, even
HTML Email templates, Server Side Includes
* Same-day turnarounds and pricing discounts
* Search engine friendly semantic coding
* 100% cross-browser, cross-platform browser compatibility
* Money back guarantee and 100% non-disclosure

Get started here: http://w3-markup.com/p/sitepoint-newsletter-tech-times


AVIARY: THREE BIRDS IN THE WILD - - - - - - - - - - - - - - - - -

Way back in last November's Design View [1], we looked at the
ambitious range of design applications planned by the team at
Aviary [2]. If you missed that issue, these apps are all powered
by Adobe's AIR platform, which means they run equally well inside
a browser or as standalone desktop software.

Well, the good news is Aviary now have three beta applications
available for your test-driving pleasure and I thought I'd give
you a quick rundown on each.

PHOENIX

Phoenix is a fully featured photo/pixel editing suite. It's
comparable on many levels to Photoshop, but is able to run live
in your browser.

The interface is slick and fast, and there's really no tangible
sense that you are using anything other than a normal desktop
app.

While Phoenix doesn't have the CMYK functionality to make it
viable for print work, its photo retouching and paint tools are
first class--in some areas even surpassing Photoshop.

For instance, Phoenix's history palette displays as a timeline
of thumbnails, allowing you to step back in time to view
versions of your image as you created it. Being able to browse
thumbnails of your work as it evolved is enormously useful.

Phoenix is a really impressive piece of work.

PEACOCK

Peacock is weird but that's what makes it cool. Described as a
"visual laboratory," it's hard to think of any graphics
application to compare it to.

However, back in the late 1990s, Kai Krause [3] of Kai's Power
Tools came up with some amazing graphics tools by throwing away
the rule book.

In a similar way, Peacock discards the traditional graphics
paradigm of overlapping layers in favor of a completely fresh
approach.

Each source image, each visual effect, and each blending method
is treated as a separate module, and you are free to plug these
modules together in any order or configuration you like.

Every module has at least one input, and one output, connector.
Linking an input to an output is as simple as clicking and
dragging between them. Joiner and splitter modules allow you to
link separate image streams.

When you connect your string of modules to your canvas, you see
a preview of the rendered result, ready for export.

Confused? Okay, think: hobby train sets meets circuit board
design. Mmm--perhaps that may not have helped.

Now--make no mistake--Peacock is strange and it took me a while
to get comfortable with the concept. But after a while, I found
this unusualness quite inspiring and I ended up spending much
longer than I had intended, experimenting with ideas in this
app.

Set some playtime aside for this one and have some fun.

TOUCAN

Toucan is a color palette generator and the latest hatchling
from the Aviary nest.

Besides the standard color wheels and sliders, Toucan offers:

- color extracting from imported images
- clipboard color import
- color deficiency simulations for users with vision problems

While perhaps not as obviously groundbreaking as its sister
apps, Toucan looks like a useful addition to the Aviary tool
box.

All three of these apps are currently available to the public
for free and you can sign up for the beta program here [4].

Ultimately, Aviary intend to run with a subscription model for
their software. Rather than buying your graphics software for
thousands of dollars every couple of years, you'll be renting it
for a small payment each month.

While that makes good financial and logistical sense (no
installation and upgrade issues), it will be interesting to see
how many graphics professionals are comfortable with that idea.

Interesting times.

[1] <http://www.sitepoint.com/newsletter/viewissue.php?id=5&amp;issue=39#8>
[2] <http://a.viary.com/home>
[3] <http://en.wikipedia.org/wiki/Kai_Krause>
[4] <http://a.viary.com/home>

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

That's all for this issue--thanks for reading! I'll see you in a
few weeks.

Alex Walker
design@sitepoint.com [1]
Editor, SitePoint Design View

[1] <mailto:design@sitepoint.com>

LATEST TUTORIALS - - - - - - - - - - - - - - - - - - - - - - - -

Hacking JavaScript for Fun and Profit: Part I
by Myles Eftos

Ever wonder what makes a real JavaScript guru? How about someone
who has used JavaScript, CSS, and HTML to successfully implement
a 2-D side-scrolling platform game? In this two-part series,
Myles will help you elevate your JavaScript skills to the
ultimate level!

http://www.sitepoint.com/article/1670


10 Rules for Driving Traffic Using Forums
by Josh Klein

We all know forums are a great place for networking, getting
advice, or getting answers to problems we couldni??t solve on our
own. But did you know that your participation in a forum can
drive high quality traffic to your site too? Josh explains why.

http://www.sitepoint.com/article/1669


Interview with Jeff Veen, User Experience Guru
by Josh Catone

Jeff Veen is a high-profile author, speaker, and user experience
consultant who has lead design teams at companies such as
Adaptive Path and Google. Jeff took some time out to answer a
few questions submitted by the SitePoint Forums community.

http://www.sitepoint.com/article/1667


Learn Adobe AIR, Part 2: Build a Customer Management App
by Akash Mehta

Part 2 of Akashi??s Adobe AIR tutorials describes how to build a
simple Customer Relationship Management (CRM) application. Take
the quiz at the end and receive a free pocket guide: Adobe AIR
For JavaScript Developers, courtesy of Adobe!

http://www.sitepoint.com/article/1666


Learn Adobe AIR, Part 1: Build A Note Storage App
by Akash Mehta

Following up from his competition-winning tutorial, Akash
explains how to use Adobe AIR to build a handy notes storage
app. This is the first of three articles on building web-enabled
desktop applications using the exciting Adobe AIR platform.

http://www.sitepoint.com/article/1665


HOT DISCUSSIONS - - - - - - - - - - - - - - - - - - - - - - - - -

Two most useful Photoshop shortcuts
<http://www.sitepoint.com/forums/showthread.php?threadid=569754>

See A Surface In Action At Web Directions South '08
<http://www.sitepoint.com/forums/showthread.php?threadid=571787>

What should be on a Web Designers first page
<http://www.sitepoint.com/forums/showthread.php?threadid=569951>

IE8 Beta has no canvas tag support yet?
<http://www.sitepoint.com/forums/showthread.php?threadid=568777>


NEW BLOGS - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Web Pro Business Blog: STRATEGIES FOR SUCCESS

Give Your Flippina?TM Lawyer The Bird! (2 comments)
http://www.sitepoint.com/blogs/2008/09/17/give-your-flippin%e2%80%99-lawyer-the-bird/


Selling Web Design Services Blog: DOWN TO BUSINESS

Learn To Say Sorry (1 comment)
http://www.sitepoint.com/blogs/2008/09/17/learn-to-say-sorry/


News & Trends Blog: INDUSTRY NEWS FOR WEB PROFESSIONALS

Zend Teams With Adobe to Marry PHP and Flex (1 comment)
http://www.sitepoint.com/blogs/2008/09/17/zend-teams-with-adobe-to-marry-php-and-flex/


JavaScript & CSS Blog: STYLISH SCRIPTING

A Free JavaScript Speed Boost for Everyone! (6 comments)
http://www.sitepoint.com/blogs/2008/09/16/a-free-javascript-speed-boost-for-everyone/

Rowspans & Colspans in CSS Tables (57 comments)
http://www.sitepoint.com/blogs/2008/09/09/rowspans-colspans-in-css-tables/


Web Tech Blog: TECHNICALLY SPEAKING

Windmill Web testing framework releases version 0.8.2
http://www.sitepoint.com/blogs/2008/09/11/windmill-web-testing-framework-releases-version-082/

SitePoint Technical Editor Might Just Be Your Dream Job (13
comments)
http://www.sitepoint.com/blogs/2008/09/05/sitepoint-technical-editor-might-just-be-your-dream-job/


ADVERTISING INFORMATION - - - - - - - - - - - - - - - - - - - - -

Find out what thousands of savvy Internet marketers already know:
email newsletter advertising works! (You're reading an email ad
now, aren't you?)

Find out how to get YOUR sponsorship ad in this newsletter and
reach thousands of opt-in subscribers! Check out
http://www.sitepoint.com/mediakit/ for details, or email us at
mailto:adinfo@sitepoint.com


HELP YOUR FRIENDS OUT - - - - - - - - - - - - - - - - - - - - - -

People you care about can take charge of their Website by
effectively using the information and resources available on the
Internet. Help them learn how - forward them a copy
of this week's Design View.


ADDRESSES - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Send suggestions and comments to:
mailto:design@sitepoint.com

To subscribe, send a blank email to:
mailto:subscribe@sitepoint.com

The Archives are located at:
http://www.sitepoint.com/newsletter/archives.php

The SitePoint Design View is (c) 1998-2008 SitePoint Pty.
Ltd. All Rights Reserved. No part of this Newsletter may be
reproduced in whole or in part without written permission. All
guest articles are copyright their respective owners and are
reproduced with permission.

SitePoint Pty. Ltd.
48 Cambridge Street
Collingwood, VIC 3066
AUSTRALIA

You are currently subscribed to The SitePoint Tech Times as:
ignoble.experiment@arconati.us

To change the email address that you currently subscribe with:
http://sitepoint.com/newsletter/manage.php

To switch to the HTML version of this newsletter:
<http://sitepoint.com/newsletter/htmlplease.php?email=ignoble.experiment@arconati.us>

To leave this list, send a blank email to:
mailto:leave-2498398-2266615.6a281def5c7ecb5efcb2dd35473f5a18@sitepoint.sparklist.com

<a href="mailto:leave-2498398-2266615.6a281def5c7ecb5efcb2dd35473f5a18@sitepoint.sparklist.com">AOL Users Click</a> to unsubscribe

Do Not Reply to this email to unsubscribe.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

No comments:

Post a Comment

Keep a civil tongue.

Label Cloud

Technology (1464) News (793) Military (646) Microsoft (542) Business (487) Software (394) Developer (382) Music (360) Books (357) Audio (316) Government (308) Security (300) Love (262) Apple (242) Storage (236) Dungeons and Dragons (228) Funny (209) Google (194) Cooking (187) Yahoo (186) Mobile (179) Adobe (177) Wishlist (159) AMD (155) Education (151) Drugs (145) Astrology (139) Local (137) Art (134) Investing (127) Shopping (124) Hardware (120) Movies (119) Sports (109) Neatorama (94) Blogger (93) Christian (67) Mozilla (61) Dictionary (59) Science (59) Entertainment (50) Jewelry (50) Pharmacy (50) Weather (48) Video Games (44) Television (36) VoIP (25) meta (23) Holidays (14)

Popular Posts (Last 7 Days)