clearspring - the widget network.

Platform Services Developers About Us Sign In Create Account

Platform

You are here: Docs → Technical Documentation → Developing Widgets → Best Practices
 

Best Practices

What makes a great web widget? There's no single answer, but over time we and some other folks in the business have identified some useful best practices that might help you out.

Clearspring Recommendations

Here are a few of our own recommendations, not just on technical specifics, but on overall approach as well.

Choosing a Widget Type

Deciding what type of web widget to build is important; not all types of widgets will work on all destinations. If you are targeting Social Networks, you will want the content of your widget to be as "viral" as possible, encouraging users to grab it for themselves (using the edge services such as those from Clearspring). You'll also most likely want to build your widget in Flash, since some of the popular social networks do not allow javascript content.

Widgets targeted for Start Pages work best if they are designed as utilities (e.g., weather, calculators, web services adhsboards, etc) or are based on RSS content feeds. When targeting blogs, it often depends on the type of blogs; many different types of widgets may be a good fit. You can usually build widgets for Start Pages and Blogs in Flash or HTML, with or without Javascript.

Check out the Drop Target Matrix for a full list of the widget technologies supported by the major destinations.

Generally, there are a few broad audience segments you can think about when deciding how to target your widget:

  • Bloggers or other providers that want to augment their content.
  • Social networkers looking for ways to show personal expression.
  • Start page users that want utility.

Sizing your Widget

Different sizes work better in different environments. Though your widget will be usable across the web, you will likely have a target audience in mind. The table below presents some recommendations on widget sizes, based on where you are targetting your widget.

destination
 recommended widget size
(width x height in px)
Blogs
  160 x 300 (Sidebar)
Social Networks
 160 x 300 (Profile / Post)
Start Pages
  400 x 300

We have generally found that a size of 300x250 will work in the most destinations, although is obviously not optimized for some.

Note that if you do plan to ad-serve your widget as a means of promotion, you should observe IAB design and sizing guidelines.

Note that for large flash widgets, for example 800x600, which scale to smaller formats, such as 400x300, when wrapped in Clearspring Launchpad will cause the “get & share” tab to scale with the widget to a smaller size, which may make the tab and menu unreadable to the user.  We recommend that you size your widgets to their desired size.

Your Widget's Functionality

You can build a widget to support almost any feature you can imagine. RSS feed readers, Games, Video Players, Audio Players, Profile Badges, Photos, Slideshows, and any number of specific end-user applications. Some general recommendations on making your web widget well-behaved:

  • For maximum reliability, consider what the default widget behavior is, as well as the “empty" behavior when no data is available from a server.
  • Do not auto-play video and audio.
  • Make all URL references absolute -- relative references will only work on your own site.
  • Pay attention to and design around MySpace's link-out limitations early in your design process.
  • Use mouse-over effects to highlight to the user that the widget is interactive, and not just an image.
  • Open links in new windows. Loading URLs in the existing window will avoid pop-up blockers, but will cause the entire website to load in the widget window if it is wrapped inside a div or iframe.

Effective Seeding Strategies

Seeding your widget, giving users a place from which to grab it, is one of the most critical parts of your widget strategy. Some general recommendations:
  • Avoid posting the widget in typical ad-blind-spot areas (e.g. the right rail)
  • Place the actual widget, and not a screenshot, on your seeding location.
  • Communicate clearly that the widget is interactive, and encourage users to grab it, without assuming they will recognize it as such without actually clicking on it.
  • Publish your widget to as many Widget Galleries as possible, and actively maintain your profile in these Galleries. (Clearspring can do this publication automatically)

Managing your Widget Over Time

Once it's out in the wild, it's not over!
  • Use analytics tracking (such as Clearspring's) to keep track of key performance indicators:
    • Audience Extension: The percent of widget traffic coming from outside of your own domain vs. within your domain
    • Velocity: How often the number of widget locations doubles in size
    • Viral Hubs: The sites or pages that are the most influential in attracting viewers to grab your widget and share it amongst each other
  • Realize that you can change the content of your widget even after it's deployed, especially if you are using a configuration mechanism such as Clearspring's. As long as you do not change sizing, or fundamentally alter the purpose of the widget, dynamically updating content is a proven effective way to keep your users engaged and to encourage to keep your widget on their page.

Recipes for Business Success

In general, there a few key things to keep in mind with respect to your overall widget strategy.
  • Keep it simple
  • Use compelling content
  • Make it an app, not an add
  • Make it social
  • Seed it in context with your content
  • Keep it fresh by updating it frequently
  • Track it's spread

Additional Recommendations

Lots of folks have been thinking and discussing the topic of "what makes an effective widget", not just us. Here are a few resources from around the web that you might find useful in this regard:

Overview
Docs
Forum