Category: Technology

Is it safe to encourage your users to upgrade from their old browser? Only your own site’s browser stats can really say what’s best for your site’s visitors. But there’s a growing list of major web sites that feel it’s time for their users to upgrade. And they’re letting their users know that they’re being left behind.

Facebook warns IE6 users that they will not have the best experience.

There’s good reason for leaving those old browsers out of your site’s supported browsers list. Old browsers consume valuable developer time with greater debugging requirements which is an important consideration for budget conscious web sites.

But sites with relatively bottomless budgets like YouTube, Facebook and Twitter are dropping old browsers too— specifically IE6 — because those old browsers aren’t capable of supporting the next generation of features that HTML5 is making available. Older browsers are slower and less capable than new browsers making it more difficult-to-impossible to support advanced site features and maintain a snappy user experience.

Which Browsers Need to Upgrade

As might be expected, the major focus for upgrading old browsers is aimed at Internet Explorer; particularly Internet Explorer 6 (released in 2001) and Internet Explorer 7 (released in 2006). It’s important to recognize that Internet Explorer stands alone as the only browser available today without an aggressive automatic update feature.

Chrome and Firefox, which together make up for more than 40% of web traffic, auto-update the browser transparently every 6 to 8 weeks. Safari uses the Apple update services (even on Windows) to push regular updates and Opera now also has an auto upgrade feature as well. Meanwhile, IE has had issues getting their users to upgrade and Microsoft has stopped short of forcing users to upgrade their browser.

Microsoft themselves have recognized this problem and started a PR campaign last year to promote the end of IE6 and even celebrates countries where usage has dropped below 1%. That list of countries with low usage of IE6 is growing and as of December 2011, the United States is among them. For the vast majority of sites it’s now safe to drop IE6 support which basically means that it’s not necessary to test your site in that browser.

Giving Your Users a Hint

But what do you do for users that arrive at your site with an outdated browser? Historically, doing nothing was always a fine choice. But increasingly the major sites — including Facebook, Twitter and YouTube — have been addressing IE6 users with splash screens and warnings, letting them know they’re on an old browser, they might not have access to all of the sites features and encouraging them to upgrade to a more capable browser.

YouTube warns that their site won’t work at all, Twitter pushes IE6 users to the mobile site and shows a small notice explaining why and Facebook shows a small notice that some features may be disabled.

Twitter actively degrades the experience for IE6 users and let’s them know about it.

YouTube redirects IE6 users to a detailed warning page that explains they won’t have the best experience on older browsers and encourages them to upgrade.

You can easily add these notices to your own site to help your users have the best experience possible. The most common strategy is to use specially formatted comments that only IE will process to show a banner to your users. The banner that Microsoft designed for their IE6 Countdown campaign links users to the official IE upgrade page on the Microsoft website.

Making an Informed Choice

While Microsoft’s banner is asking users to upgrade to a newer version of Internet Explorer, a more even-handed approach for your own site is to link your users to one of the many informational sites that show users what other options are available. After all, even IE 9 is well behind Chrome and Firefox in implementing cool new HTML5 features. It’s possible that users aren’t even aware that other browsers are available.

Two standout informational sites are What Browser from Google and Browse Happy from WordPress. Both sites provide links to the 5 major browsers, including Internet Explorer. What Browser goes a little further than most sites and tries to explain the concept behind upgrading a browser to users that may not know the difference.

Notable Browser Upgrade Sites:

• What Browser
• Browse Happy
• A Better Browser
• Finer Browsing

Finer Browsing has an example banner bar that is easy enough to implement and could serve as an excellent starting point to designing an “outdated browser” banner for your site. SolutionSet has typically linked users to the Google What Browser site for clients that want to supply a notification to their users.

Focusing on Mobile Instead

At SolutionSet we’re encouraging all of our clients to drop support for Internet Explorer 6 and 7 when possible and re-focus those energies on supporting mobile users as a first-class citizen. IE6 has less than 1% market share in the US, IE7 has less than 4% in the US. At the same time, mobile users make up nearly 10% of traffic on the Internet and some of our clients are reporting as much as 25% to 30% of their total traffic is coming from mobile devices.

While dropping support for older browsers may be a confusing experience to the minority of users still using them, providing a little direction for those affected can help steer them in the right direction.

December 8, 1980. 9.15 AM. Mumbai, India. Heard on the radio that John Lennon was assassinated. For a 17 year-old, who grew up with songs like Imagine and Give Peace a Chance, it was a devastating moment. I had lost a giant who defined the context for me and for my entire generation. What made it difficult was the suddenness of it. He was just 40. Just when it felt like he was at the beginning of another inspiring run. I missed him, not just because of his music but because I didn’t know who else would articulate my dreams and passions.

Three decades later, I feel the same way about losing Steve Jobs, suddenly and at a young age. There is a lot of stuff out there lionizing him. Where we held a candle-lit vigil for John that one night, the Internet and digital world that Jobs helped create has resulted in a 24/7 outpouring of the love, admiration, and acknowledgement of his impact on all our lives. I will miss him. Without him, who will create great innovations? Who will integrate design and technology to change how we experience content?

Both Steve and John have created legacies that will continue to inspire and define the world we continue to inherit. The kind, giants do, a few times each generation. How do they do this?

A lot of Steve’s quotes are being used by people. The one from his commencement speech at Stanford University in 2005 provides great insight into what made him successful. He said “remembering that you are going to die is the best way I know to avoid the trap of thinking you have something to lose”. A poignant point-of-view, that clearly shows his lack of fear - of consequences or of failure.

This lack of fear is the one common factor that enables people like John and Steve to create gigantic legacies. Can we find a way to do the same?

As a bit of a nerdy, geeky type myself, I’ve advocated that CMOs make friends with their inner geek. Why, you ask?

Given the vast amount of data becoming available on customers and their behaviors, successful marketers, are beginning to collect this data on their customers’ experience with the brand and analyzing it to learn how they can create what I call a “brand ritual”—a branded behavioral bond with their customers… read more

Video content has proven its value on dedicated sites such as YouTube, Hulu and beyond over the past several years and has made significant inroads into the enterprise.  However, with the number of tools available to manage and distribute videos on websites, it is a challenge to understand the decision criteria surrounding the tools. 

SolutionSet has implemented websites for consumer and b2b clients on a number of platforms and offers the below considerations when evaluating video implementations:

• Player(s)
  • Players
    • Most utilize Flash, and degrade gracefully to HTML5.  This is a necessary consideration for display on iOS devices.
  • Player customization/features
    • See what is available within the application environment and code modifications based on availability, not just what is ideal for the user.
    • Be sure to design the interface with input from the technical team and in context of the platform.  Do not design in a vacuum.
• Content Management
  • Content Creation
    • What types of resources can be uploaded?  Video (avi, mov, mpg), Web cam, mobile, etc?
    • Are there out of the box tools which enables UGC – for users to submit video from any source?
  • Workflow
    • Some tools allow for tight integration with many existing Web Content Management Systems.  See if this is possible/desirable.
    • The tools are all  very similar, and allow for managed workflow.
    • Look for tools which will allow you to follow standard editorial, legal, approval workflow.
    • Look for tools which automate all of the steps required to get a video into the system.  Users should be shielded from codecs, encoding for different platforms, resolution rates, etc.  this should be set up within the backend.  Utilize a “getting-started” packet from selected platforms professional services team.

• Channels/Playlists
  • Look for how each platform allows for the creation of playlists of videos. 
  • Channels enables you to have one asset managed in the system appear in multiple locations on the site.
• Meta-data
  • What meta-data is available in the system
  • Check to see how each platform constructs its meta-data model as it will help in the categroization and display of the video
  • How much can be customized?
  • What are limitations?
• Branding
  • Is the watermark overlay possible and customizable?
• Translation/Sub-titles
  • What types of files are supported?
  • Is it possible to export/integrated translation process with third-party partners?
  • What are limitations?  Ie. If video is in English, and you want one video asset with multiple sub-titles, is this possible?  If not, what are the possibilities/ramifications?
• Advertising
  • What modules are available in the system: pre-roll, interstitial, post-roll?
  • Can third-party ad-servers be integrated easily?
• Distribution
  • Look for ability to manage video content on multiple distribution points from one interface/cms
• Mobile
  • Many platforms allow for the creation and upload of video from mobile devices.  Review possibilities.
  • What are capabilities for auto-sniffing of platform to be able to serve proper video assets for the final environment?
• Infrastructure
  • Video Feeds/CDN
    • Which CDNs are supported?
    • How are videos served?
    • Are they served from multiple places/Geo-locations?
    • How do feeds interface with CDN?
  • Live Streaming
    • Does the platform handle Live Streaming?
    • If so, what are the limitations?

As Video becomes more important to your enterprise, these considerations will help guide your decision making and evaluation of the various providers.

Keeping your customers engaged in your business is becoming easier with the advent of social media, but remember, these tools are supplemented by emails.  Email marketing continues to thrive as a tool with reliable data and accurate ROI.  Follow these ten best practices to get your email marketing campaign started.

1. Focus on text
   Text should be concise enough to get the point across.  Remember that most people do not load pictures, so be sure to use appropriate image tags.  Additionally, space out text with titles and in different sizes.  Avoid all caps type and phrases like “FREE! BUY NOW!” and “CLICK HERE!”, because they tend to trigger spam filters.
2. Develop appropriate subject lines
   The saying “Never judge a book by its cover” has no application here – everyone will judge your email based on the title.  Some suggestions are: Stay concise and clear, keep subject fewer than 50 characters, limit punctuation, use appropriate camel case, no personal pronouns, be specific, and most importantly, be honest.  You’re not “tricking” potential customers, you are communicating with them.  If they sense deceit, they’re less likely to open the email.
3. Timing
   Deploy messages when your audience will read them. The best ways to know which times are most effective is to test – as suggested in ExactTarget’s blog.  If you need a starting point, iContact recommends sending business emails Tuesday – Thursday between 9:30am and 5:30pm; consumer emails between 5pm – 8pm.  These are the times when the broadest amount of people actively checks email.  In the analysis, iContact suggests weekend timing is less specific, with people checking in the afternoon.  Overall, SolutionSet advocates testing when applicable to make the most out of your campaign efforts.
4. Adhere to email frequency claims
   As mentioned before, be honest.  Bi-weekly or monthly is best for newsletter content. Regardless of content type, ensure that customers are aware of email frequency.
5. Use recognizable sender names (i.e. notification@acmecorp.com)
   The first item users tend to look at in new emails is the sender name.  If the name is garbled and unfamiliar, they are likely to be turned off from opening the message.  Getresponse has an entire blog post on this topic
6. Request permission before sending emails; provide removal option
   Do not blindly solicit people.  Give people an option to opt out from emails – mandated by CAN-Spam act of 2003.  Read over the FTC and FCC guidelines for specific legal guidelines.
7. Personalize whenever possible
   Add name of recipient in message where appropriate and target your audience.  Keeping it personal will help drive interest and assuage spamming fears.
8. No attachments!
   Attachments will trigger spam filters if the email is not recognized.  Load images from web servers to avoid filters when adding extra content.  If a file is necessary, lead users to a download page on your site.  This will give people the opportunity to explore other areas of your web page.
9. Build and maintain email lists
   Acquire emails wherever possible: conferences, meetings, on your website, etc.  By signing up, your contacts will know to expect emails from you.  Maintain lists by organizing them into categories and deleting email bounce backs.
10. Limit colors, use simple designs
    Text should be black unless it is a page link or matches the design. Use easy to read colors that contrast well with the background.  Remember that most people do not load images, so when text loads it will be against a white background.  Also, red, green, or blue blocks of text tend to trigger spam filter.

In sum, keep your emails professional with the right level of personal.  Following the best practices outlined above is a good start to reaching your email marketing goals.  The next step is to measure your success.  Determining and interpreting key metrics, and optimizing based on those metrics takes practice.   Contact us to see how SolutionSet can help you develop successful email marketing campaigns and measure their success.

Seven Exciting Social Media Campaigns

Social media is a ubiquitous supplement in marketing these days.  Particularly in digital marketing, one will find social icons somewhere on a webpage.  There are many things you can do to improve your social media strategy, but you may be asking yourself, how are other companies and businesses implementing and integrating strategies?  What are the results?  Below I have outlined seven successful social media campaigns, each with a different type of web presence.

1) Duke Fuqua Business School and their Virtual Campout 2011
Duke Students have a yearly tradition for obtaining basketball tickets each season, where they campout for 72 hours on campus and participate in activities. The event is called the Duke Campout.  The Duke Business School wanted to bring this real-life social event to its alumni across the nation.  In six short weeks, SolutionSet helped the Duke Business School conceive, build and implement the application.  Participants were able to gain “check-in” points – used for prizes – by ‘Liking’ a page through Facebook or posting Duke News to social media sites.  The Campout Campaign marshaled nearly 800 Fuqua alumni and students to take 11,000 actions to volunteer for, learn about, or support the school.  Since the Alumni Association was restricted on directly marketing to students, the promotion was mostly through social media channels with the duration of only three weeks prior to launch.  The campaign was a success being conceived and built in a matter of weeks, using social media as the primary marketing communication channel, capturing a relatively ample amount of participation, and providing a strong foundation for future virtual campouts.

Find more information about the campaign here: http://today.duke.edu/2011/07/fuqua

Duke Fuqua’s Campout 2011 application allowed users to check in on their site, which integrated numerous social media tools.

2) Old Spice
The Old Spice video campaign from 2010 is undeniably one of the most recognized social media campaigns since the likes of Facebook and YouTube conquered the internet.   The campaign leveraged multiple social video platforms, Twitter, and Reddit.  With a witty video, engaging twitter posts, and a team of social media specialists the company obtained 35.7 million views video in the first week.  While not all companies are able to scale this type of production, the campaign does shed light on the effectiveness of good social media strategy and brand building by integrating multiple social platforms

The old spice campaign launched 180 videos in two days — Each of the videos above is a unique piece of content

3) Dunkin Doughnuts
Dunkin’ Doughnuts began a “Current Fan of the Week” social media campaign using Facebook back in 2009.  Users upload images of themselves with their favorite Dunkin’ Doughnuts product to the campaign’s Facebook page. In order to upload images, users must first like the Facebook page.  As an incentive, the company offers a free drink coupon and made the winning photo the profile image of the contest’s landing page for the week.  The initial goal of the campaign was to use the social space to spread the word about new products and promote Dunkin’ Doughnuts brand and culture.  Since the campaign started, it has racked up almost 4 million followers on the social network.

Screenshot of the current Facebook page shows a high number of followers and a participant’s photo in as the profile image

4) LivingSocial/Amazon
LivingSocial is known for those daily deal coupons we get in our emails.  When you commit to a purchase through the site, the company provides a unique URL for you to share. If enough people use your URL you receive the deal for free.  To help facilitate the spread of deals, the company places links to Facebook and Twitter at the confirmation of the purchase as easy reminders.  While the URL tracking process requires infrastructure, the key take away is: place social media links where appropriate.  You may not be able to generate the same 1,378,938 purchases as LivingSocial did from their Amazon campaign in 2010, but you can increase likelihood of users sharing on social media sites by placing icons in the appropriate areas.  Also, providing an incentive to share is an added benefit that will bolster campaign popularity.

Note the social media link placements, supporting a secondary call-to-action

5) Google Chrome
In order to promote Google Chrome Ver. 2 and its HTML5 capabilities, the Google Creative Lab worked with Chris Milk, a well-known music video director, to produce a music video titled the Wilderness Downtown for the Arcade Fire.  To view the video, Google tactfully requested that users download the Chrome browser; otherwise, the video would not load properly.  The video itself was a truly impressive example of engaging users and personalizing their experience.  Of course, the social element allowed users to post the video link to Facebook.  People were more likely to post responses because it engaged users in a very personal way.  The campaign itself successfully engaged users, promoted a song by the Arcade Fire, and displayed the stunning abilities of Google’s Chrome browser.  Since the video released in 2010, Google chrome usage has increased from 9% to about 20%.  The lesson to be learned to be learned: provide the social elements and make the engagement as personal as possible.  Additionally, ensure your content is of quality and desired; otherwise no one will pay attention to your efforts.

6) BurgerKing Whopper Sacrifice
In 2009, Burger King created a Facebook app and a microsite for their Whopper Sacrifice campaign.  The campaign’s intent was to get users engaged with the Burger King brand and promote the “Whopper” hamburger.  In order to receive a free Whopper, users added the Whopper app to Facebook and deleted ten friends.  By identifying a socially deviant behavior and providing the proper incentives to users, the campaign mobilized 82,000 people to engage with the brand.  Replicating this reaction using social media might be tricky, unless you are able to identify a common “technical pet peeve” or a behavior within a special social niche.  Overall, the campaign reveals a common idea: know your market, what they like, and what motivates their engagement.

The microsite tracked the number of people deleting friends with the use of the App.

7) Food Trucks – Twitter and Facebook
Food trucks are not always the first place one thinks of when going to dinner; unless you happen to catch a Facebook “Like” on your newsfeed from a friend.  When perusing Facebook one day, I noticed a friend had liked Edgewood Eats  – a caravan of food trucks on Monday evenings near my area.  I found it interesting that the organizers only use social media sites – Facebook and Yelp – as a promotion channel and communication tool.    The trucks flourish with business every Monday night, with lines of people waiting to get in on some delicious food.  This is a great example for local marketing.  When you have a specialized niche or community, social media creates a richer engaging experience for your customers

As users begin engaging in social environments online, so should your business.  Our favorite social media campaigns outlined above give some good examples of social media campaigns.  Here are some key take-aways to consider for each:

• Know your audience; have a voice they understand and know what motivates them. Be sure to identify your goals for each campaign – is it brand building? Publicizing a new product? Or just keeping in contact with your group?
• Additionally, we saw most of these campaigns diversified across platforms.  Integrate twitter posts with Facebook content generated by users; or promote reviews from yelp on facebook.
• Provide incentive for engagement.  You do not always need to give away free stuff.  Play to user’s vanity; people like to see their name, photos, and thoughts publicized.
• Finally, keep content relevant and fun.

For more information on social media strategy, check out or blog articles “10 Things You Can Do for Social Media Marketing Strategy ” or “Embracing the Rise of SoLoMo.”  Also, contact us  and ask how we can help support your social media campaign.

If you’ve never heard of “SoLoMo” before, get used to hearing it because it’s a trend that is just getting started, and clearly here to stay. You may be asking yourself, what’s SoLoMo? Simply put, it’s the term used to describe the convergence of Social-Local-Mobile media, it’s also used interchangeably with the term “geo-marketing”. We experience it on a daily basis, and typically don’t even think twice about it because it’s become second nature to so many mobile users.

Still not too sure what SoLoMo is? Here are a couple quick examples of SoLoMo:

If you’ve ever found yourself checking your Facebook account while waiting in line at the grocery store and see in your newsfeed that the guy who lived in your freshman dorm is at a pizza place across town, he could very well have benefitted from a check-in deal, that’s SoLoMo in action.

Ex.: Check-in deal for local pizzeria leveraging both Yelp, Facebook, and Twitter.

If you’ve downloaded ShopKick’s mobile app and are walking around the mall with friends and get prompted to walk into Best Buy and you walk around the store together to earn” kickbucks”,  that’s SoLoMo in action

Ex.: Shopkick app

There are many ways to apply SoLoMo to your marketing strategy. When the proper SoLoMo media strategy is put in place, customer conversion is often immediate because location-based (geo) functionality is frequently leveraged when users want to take immediate action. Mobile is having a tremendous impact on in-store customers, a recent study performed by Google and Ipsos OTX MediaCT found that 79% of users will look to their smartphone for help when shopping and 74 % of users will make a purchase as a result of using their smartphone. Mobile device usage is growing at an alarming rate, therefore it’s important that your digital/mobile marketing strategy keep up with changes in consumer behavior. KPCB’s Top 10 Mobile Trends report shows that there’s a shift in purchases from traditional desktop computers and PCs to mobile devices (smartphones and tablets) as well as the overall increase in usage of mobile for new social/collaborative activities.

Though these figures are encouraging, a big challenge that companies face is keeping their consumers active and engaged. As a general rule, social media users are passive and consume rather than create content, since social media marketing campaigns are most effective when users generate content, companies struggle to find creative ways to shift that trend. We do know that keeping users engaged and active requires several key components. It should take little to no effort to engage with your brand (leveraging social network login, “Like”, share buttons, Re-Tweets) and it provide appropriate incentives to users who want to participate, publish, or share their content or updates.

Forrester’s Social Technographics Ladder—the most active user types slipped 2% points or more from 2009 to 2010

Companies are finding that to an effective way to engage their users more is to apply game mechanics to their social media marketing campaigns with incorporated geo/mobile capabilities. This approach, also known as “gamification”, is often used as a tactic to establish recurring engagement with a brand, product or service by maintaining a level of participation that requires minimal effort, but keeps users coming back for rewards. These rewards can come by way of points, status, levels, privileges, or any number of other forms of social currency. Though this is not a new concept by any stretch of the imagination, it has proven to be extremely effective via mobile devices because users tend to fill small slots of idle time with brief, discrete activities.

Some notable platforms that have built their entire business around game mechanics are Foursquare, SCVNGR, and Gamify, the aptly named “gamification” platform.

SCVNGR Challenges for Starbucks Coffee: Any SCVNGR user can earn points for completing standard challenges as well as create their own.

If you have already covered the social media and mobile basics:  Facebook page, Twitter accounts, check-ins (when applicable), mobile app/site, location-based store finders, etc… your business is on the right track.
If your business hasn’t yet applied gamification to your social media strategy, now is the time to start considering it. Treat it like any other any other campaign, and develop a short and long term strategy with appropriate KPIs and goals. Identifying the right platforms to leverage, implementing the proper campaign tracking and analyzing the results will be crucial for capturing insights about your consumers.

To find out more about how SolutionSet can help develop the appropriate SoLoMo media strategy for your business please contact us.

eight web form design best practices

By the SolutionSet User Experience Team 

Filling in a form is a task we deal with every day as web users.  We designers revel in designing forms that create a seamless experience for the user. At SolutionSet, our user experience team has 15 years of experience designing and testing effective and usable interactive forms for clients. Our experience ranges from refining the sign up form to simplifying the complex with simple navigation. Through the years we have seen the good, the bad, and ugly and have strove to find the best way to ensure that web users can understand what information is being asked, what they need to provide, and the best format to provide it in.

This article follows up on our previous post on redesigning the postal address form with eight web form design best practices.

Sample top down form with ajax on state highlighting.

When creating a form, designers must be aware that every single placement of data is crucial for overall efficiency.  It’s crucial to understand the type of information that is being collected and be able to design for ease of entry. On the system side, it’s about getting the right information and preventing errors. On the user side, it’s about a simple way to enter and submit data without having to think too much about what is expected.

Following are eight guidelines that SolutionSet follows when designing intuitive forms for a web user interface. We base these guidelines off of our own work and experts like Luke Wroblewski (LINK http://www.lukew.com/resources/articles/WebForms_LukeW.pdf

We have also shared our SolutionSet forms best practices Visio stencil that you can use. The download link is available at the end of the post.

1. Field Label Alignment

Labeling is all about comprehension and ease of reading. Filed label copy should be in the user’s language or in commonly accepted nomenclature like “State.”  Eye-tracking studies show that top-aligned labels mean quicker reading and comprehension. Therefore, field labels should be top-aligned as a practice to provide a neat, scannable form. The exception is for new or learned terminology. In that case the labels can be right-aligned next to the fields to ensure reading vs. scanning behavior.

Examples of how to correctly align your field labels

2. Required and Optional Fields

Forms on the web handle this simple guideline in a variety of ways. It comes down to answering the question – are most of my fields required or option? If all fields are required, then include copy that all fields are required and do not individually label the fields with an asterisk, a habit commonly seen on Web forms.  If most fields are required and some optional, then we have found it often better to label optional fields with an (optional) label.  If there is an equal mix of required and optional, then label the required fields with an asterisk to prevent visual clutter.

The exception to this guideline is on lead generation forms. It is recommended to have only required fields on the lead generation form and then on the confirmation page have the optional forms. The rationale behind this design is that the user has already invested time and effort in the form by providing you with required information, and is more likely to put in the additional effort needed to complete the lead capture flow We always recommend A/B testing for all fields on one form vs. the recommended split and see which one generates the most leads for your intended target audience.

Marking only optional fields when a majority of the form fields are required

3. Field Length

Users and designers want a neat, clean page, but best practices show that field length should reflect the data required to allow users to understand the format of information required. Not to worry - the exception for this is commonly used fields like name or address. These field lengths can be made equal to accomplish an attractive visual design.

Example of using smart field length for form fields

4. Action Buttons

Once a user fills out the entry fields, the next step action (primary action) and secondary action/exit path should be clear. Primary action buttons should be left-aligned with the fields at the bottom of the form so a user can intuit action as the proper next step. Secondary actions should be visually treated differently to the primary action. We have found that treating the secondary action as a link works very well as long as it is displayed in-line with the button to ensure the user sees the relationship between the two options.

The exception to this placement is in a wizard or sequential form. In these scenarios, the “next” button can be placed on the right to indicate sequence. For example, have the primary call to action take shape of an actual button, whereas the secondary call to action, will be placed adjacent to the primary button, but in simple text, thus creating appropriate visual hierarchy.

Examples of Action Buttons

5. Help & Tips

Help and tip information aid a user in filling in the form and provide a quick easy way for users to fill in the form correctly. For example, if a user has to input their checking account number, when they click on the input box for checking account number, a help graphic can populate on the side bar that will inform the user where to find their checking account number.

Visually, the help content should be in-line with the form fields. It can be dynamic upon cursor in the field or on the form at page load depending on the amount of information/help required. The tips and help can be dynamically populated when the user selects a specified input box that contains a help or tip label.

Pre-population also helps a user understand what information is required for a field. Data can be pre-populated if a user accesses an existing record. For a new form, the fields should be blank. For controls, the choice should be defaulted to the first choice in the list.

Example of help tips

6. Tab Order

Indicate tab order of fields in wireframe annotations. The guideline for tabbing order is top à left to right àbottom in a Z formation. The one way to make sure tab order is right on – test it.

7. Error Messages

Ideally a form should present enough information and allow flexible entry to prevent errors. Errors should be presented inline, in red, and with the solution to allow a user to recognize the correct input format and recommended content. The correctly-entered fields should remain populated and the fields with an error should be cleared.

Forms focused on these guidelines and the overall user task will result in form completion, which on the web means sales, registration, and conversion activities. Making sure a web form follows these tried and true best practices means a satisfied user and client.

Example of inline Ajax validation

Example of submitted form validation

8. Formatting of Data

One of the most confusing elements of a form that we have seen is when users are asked to enter information in a particular format that might be different from how the user might usually visualize the data. E.g.: When a form asks a user to enter their phone number in a particular format (123) 456-7890. This forces the user to spend additional time pre-formatting their data in their mind and has been observed to create frustration in the user.

While the form should provide enough general information to the user like asking them to include area code or country code for international numbers, the user should be allowed to enter their number any way they want. It only takes a few lines of code to reformat the data entered by the user to whichever format you need it to be in for your purposes.

Another practice that we recommend staying away from is splitting a form field up (e.g.: splitting a telephone number field into 3 smaller fields for area code, middle 3 digits and the last 4 digits). This hugely increases the level of effort that the user needs to put into completing the field. Fancy auto advancing scripts only aid to create confusion and we have observed countless instances where users automatically press the Tab key to go to the next field and the scrip also auto advances the users and the user ends up entering the wrong data in the wrong field.

When in doubt, keeping it simple is a good way to go.

.

Click here to download the SolutionSet forms stencil for Visio.
Save this file in your “My Shapes” folder in “My Documents” to be able to access this stencil from you’re “Shapes” menu within Visio.

With multiple interactive, connected and self driven channels at their fingertips, today’s consumer isn’t abiding by the linear “Funnel” model that has been an marketing icon for years. Whether BtoC or BtoB, it’s time to reframe our marketing thinking to reflect “consumer in charge”. We’ve created a new model designed to take us into marketing’s digital future.

Read more in this fascinating article posted on MediaPost.

Searching for ways to start of revitalize your loyalty program? You may be surprised where you find new ideas. Social integration is making the likes of Google, Bing and newbie Blekko more relavent and engaging for their users. You might just find social networking can work to build your new loyalty program too.

Read this article about Social Loyalty published on this week in loyalty from Loyalty360.