Publisher Insights 5 Principles of User Experience

User experience can make or break your site’s success. As internet usage all over the world increases, so does competition for users. Because user attention is limited, you have just a few seconds to provide a great user experience and demonstrate you have what the user is seeking.

To ensure a great user experience, consider the following five principles.

1

What do MY USERS WANT?

Focus on user’s goals and your goals

Ask yourself: “How do I give my users what they want while getting what I want?” Determine how what your user wants and what you want can work together. Identify your site’s core offerings and strengths, focusing on one or two key elements. Though your site may be good at many things, you should focus on a few areas of excellence. At Google, we have many products and features, but when a user comes to Google.com, it’s clear what action we want them to take: search.

articles?

e-commerce?

Tips When starting out, ask yourself: • How do users find your site? • What are they looking for? • Do you give them what they want? • What do you want from your users? • How do you get the desired response from them?

Resources

1

Google Analytics – Google’s free tool to help you measure your traffic and understand how users are currently using your site. It can also help you test how changes to your site impact performance.

http://www.google.com/analytics/

photos?

Example

You’re a technology news site and answer our “Tips” questions as: 1. Most of your users come from search engines and land on the article page. 2. The user is looking for the content of the article they searched for.

3. You show them a full page article on the landing page. 4. The goal is to engage the user to stay longer and see more content. 5. You don’t yet know how to get the desired response.

Question 5 is the real challenge. You need to prove to the user that your site contains other valuable content and encourage them to read more. You can do this by including related or popular articles at the bottom of your pages.

2

Employ a clear structure to guide the user

No matter what page your user lands on, you have just a few seconds on that first screen, above the fold, to grab their attention and illustrate your message. Employ a simple hierarchy to give your page clear structure that guides the user and highlights what you want them to see. Keep in mind the information architecture of your site. Consistently organize and display information on your site so that users can distinguish familiar content from unfamiliar. If your website’s structure is not logical or intuitive, users will be lost and unsure where to go next. This adds to overall frustration, with users likely to leave your site.

Tips

Use these simple design tips to create structure for your page: • Contrast: Use color, saturation and opacity to highlight elements on the page. • Size: Use BIG and BOLD elements to draw users’ attention to the most important information on the page. • Alignment: Utilize a common axis to make elements appear related.

Resources

2

• Whitespace: Draw attention to specific elements by leaving empty space around them, which also makes your design more appealing to the eye. • Grid: Lay out elements on your page within a simple grid to create a sense of order and structure.

Webmaster Guidelines – Creating a clear hierarchy and sitemap will help Google crawlers find and rank content on your site. http://support.google.com/webmasters/bin/answer.py?hl=en&answer=35769

Create Structure Contrast Size Alignment Whitespace Grid

Example

Newspaper sites create structure through hierarchy. The breaking story or most important piece of news dominates the screen real estate, ensuring it’s the first thing you see. Major headlines from other sections are big and bold so a browsing user can quickly pick them out. The size and contrast of photos and headlines guide the user through the page.

3

Ensure that users know what actions to take

Users should always know what action to take next. When a user lands on your page it should be very clear what they should pay attention to and what to do next. There should be a clear next action for them to take whether it’s clicking “buy” to make a purchase or reading a related article.

Tips

$$ $$$

When creating meaningful calls to action, consider the following: • Emphasis: Give emphasis to the call to action with size, color, contrast and/or use of white space. • Simple: Don’t clutter your page with too many actions. Think about what you want your users to do and prioritize those actions in your design. • Incentive: Give an incentive to take action, like a discount, gift, raffle entry or access to more content.

Resources

3

• Proximity: Ensure your call to action has logical placement on the page. For example, if the page features an article, put the call to action below the article. • Consistency: Have your call to action visible throughout the site and keep its appearance consistent.

Google Analytics Events – Measuring the impact of design changes and monitoring the continued usage of your site will keep you updated on how your users are interacting with your site, and how their usage can shift, change or evolve over time. Google Analytics Events will help you measure these changes by measuring clicks on pre-defined elements of the page. http://www.google.com/analytics/

BUY g+

Example

Guide Actions Emphasis Simplicity Incentive Proximity Consistency

The above site clearly communicates what action they want the user to take by using clear structure to ensure the user first looks at the product image and then clicks to get more information or purchases the item with the ‘BUY’ button..

4

Tailor your site experience to your user’s situation

Your site needs to provide a great experience to users whenever and wherever they need it. How do your users use your site differently in different situations? Consider their time constraints and whether they are using a mobile device or a desktop.

Consider the user’s situation. FOODsite

Tips

Use these tips to help you think about your users’ use cases: • Situation: Identify the situation that caused the user to seek information on your site. • Limit features: The mobile version of your site should only include core features that will help users find the information they’re looking for. Save advanced features for the desktop experience.

Resources

• Speed: Users have very little time so make sure your site loads lightning fast. Google’s Page Speed tool can help you optimize your load time. • Forgiveness: Users make mistakes, especially on mobile. Let them easily undo and return to where they were, without having to use the back button.

4

Site Speed Tool – https://developers.google.com/speed/pagespeed/ A tool to help improve your site speed. How to GoMo – http://www.howtogomo.com

A quick tool to see how your website looks on a mobile phone. It also provides some resources to help build your mobile site. DUDA mobile – http://gomo.dudamobile.com

Duda Mobile is a Google GoMo partner and allows you to create your mobile site in minutes.

Rosie’s Grill

Example

Rosie’s Grill

Suppose you’re a restaurant review site. Your mobile users are likely on the move, perhaps walking down the street as they browse your site. They won’t have time to navigate through several pages of restaurants like they do on the desktop site, instead expecting you to use the phone’s GPS to locate them and show popular restaurants nearby based on their search. You can even optimize the review experience for mobile by showing the most popular short reviews since users don’t have time to read long reviews. Think about the situation that leads the user to your site and tailor the experience to match.

5

Turn casual visitors into loyal users

We’ve discussed ways to make sure you understand what your users are looking for and how to present content in a way that matches their situation. But how can you keep users coming back again and again? To ensure repeat visits, the lifeblood of businesses both on and offline, you need to do more than just answer their question; you need to show users that there are always new things happening on your site.

Tips

Below are a few ways you can turn one-time visitors into repeat visitors: • New Content: Constantly provide new, high-quality content and showcase that content on your top landing pages. • Popular Content: Highlight your most popular content and demonstrate how many users are engaging with it. Update this everyday so people always have something new to look at.

Resources Get a Google+ Page Allow users to subscribe to your updates via Google+

http://www.google.com/+/business/

5

• Social Interaction: Make it easy for users to connect with you via their favorite social networks, which all have widgets that you can use to allow users to follow you. Once you have engaged users, draw their attention to your most popular content to drive return visits. • Email: Make it easy to subscribe to your email list for updates and/or a newsletter.

Create Loyalty New Content Related Content Promote Sharing Gather Emails

Exciting New Deals

g+

recommend 378 people this deal

Example

Related Content

Newsletter Sign-up

If you have a deal site where users can search for deals, you can first prompt them to sign up to be notified via email when new offers that match their interests are added to the site. You can also showcase how many people recommend a deal so users see which deals are popular.