Selling an Experience Online

i. Selling an Experience

ii. Common Design Myths & Mistakes

iii. Website Design & Content Audit

iv. Design Tips

 

Selling an Experience

Hospitality and travel is all about the experience. Guests want to create memories that will (yes I’m going to use a cliché here) last a lifetime. Even locals who are looking to try a new dish or to see a new show want a memorable experience.

The experience is what gets people talking. It’s what keeps guests coming back time and time again.

So how do you sell your experience online?

Peninsula Experience

Peninsula Experience by The Peninsula Hotels

The Peninsula Hotels does a beautiful job of presenting their story and their brand experience. The visuals are beautiful and correspond directly with the copy being presented. They also guide you through the story slowly, giving you time to explore each section. Their brand is elegant, luxurious and centered around customer service.

Beautiful Visuals

A picture is worth a thousand words (yep. another cliché). But it’s so true. Visitors want to imagine themselves eating your incredible meals or sleeping in your 1,000 thread count sheets. If they can’t see it, it’s much harder to sell them on the experience.

Asking a photographer about the importance of using photography to “sell” a product or service could be largely self-serving. I don’t believe that I am going out on a limb to say that the photograph has greatly aided marketing and there is no end in sight.  I am always amazed by the fact that nothing has replaced the still image for its ability to make a quick and lasting impression. The use of the still image continues to remain an important element in today’s electronic platforms and image makers who understand the medium and learn the skills to produce new imagery will continue to be successful. Likewise, marketers who understand how to effectively use the still image will also be successful.

-Clark Mishler, Mishler Photos

Investing in professional photography can make all the difference. If you don’t have a large budget, at least have your most unique attributes put into visual form. Make sure the photography you have shot can be utilized in many ways to get the most out of it. If your photography doesn’t ask, tell them how you plan on using the photos so they can take the right shots for you.

In many use-cases, text will need to be placed over your photos. You’ll want to make sure the photos allow for text to be placed in ideal places and so that it can be easily read. Have more horizontal photos taken because they are used more often online than vertical shots. Provide your photographer with a list of the different ways you’d like to use their photos so they can plan for all the use-cases.

The time and money you invest working with a photographer can be stretched far if you plan ahead.

Good Photography Smoky Mountains

SmokyMountains.org features happy tubers floating down Little River

Human Emotion

Humans are emotional (whether some guys want to admit it or not) and connect on a deeper level with things that make them feel something. Is your content connecting with your visitors on an emotional level? Are you making them laugh? Is their stomach growling after looking at your food? Do they feel relaxed just looking at what your resort has to offer?

Beautiful visuals aren’t the only way to connect with visitors on an emotional level. Descriptive copywriting can help paint a mental picture of your experiences in your visitor’s mind. It’s all about personality. Read more about emotional web design.

Presenting Content with Personality

The problem with the web today is a lack of personality. It’s what helps us remember things. Think about the commercials or ads you remember or tell your friends about. What was it about them that compelled you to keep it in the back of your mind?

It had personality.

Now think about your website. If your website had a personality of it’s own, what would it be like? How would it speak to you? What five traits would describe it best?

It’s easy for a website to feel stale and lifeless. After all, it isn’t a living, breathing person.

But it doesn’t have to feel that way.

Creating a persona for your website can help direct all of your branding efforts and give your website a life of it’s own.

Focus on What Sets You Apart

Free Wi-fi

It still amazes me that there are 3 and 4 star hotels without free wi-fi access. If you have an amenity or special dish that your competitors don’t, take advantage of it. Like @EverywhereTrip, your customers will take note of your best features, even in a year of bad hotel experiences.

Virgin Hotels Chicago Design

Virgin Hotels Showcases Top Amenities on High-Level Pages

Present your unique features front and center on your top entrance pages using photos, descriptive (and personable) copy and maybe even a video or some audio to help sell your visitor on the unique experience you have to offer.

Review your website at least every 6 months and make sure you are hitting home what makes you unique. It will change as your business evolves and you learn how to best connect with your customers.

Common Website Mistakes

Too Many Navigation Link Choices

The tendency for many destination marketers is to include too many options in their navigation menu. There is a general fear that if you categorize links into smaller groups visitor’s won’t find them. This is not the case.

Don’t throw everything at your user at once. Guide them.

This phenomenon is called “cereal aisle syndrome”. You walk down the cereal aisle only to be bombarded with hundreds of different options. It can be so overwhelming that you choose nothing and opt for eggs instead.

Limit your main navigation choices to six options or less. This doesn’t include your contact information or email sign-up links.

Your designer or user experience expert should spend time developing your site’s architecture to make sure your visitor can find what they are looking for.

Getting Fancy with Navigation Text

Don’t get fancy with your navigation copy. You’ll only confuse your visitors. Tell it like it is.

I came across a hotel website recently that was using “Experience” to group pages such as: About, Directions, Contact, Gift Cards, Press, Tours & more. This would be more accurately labeled “About” or “Visit / Visitor Information” and could be better grouped overall.

Your navigation is the single most important part of your user experience. If your visitors can’t find what they are looking for in a click or two they might leave before you have a chance to show them your beautiful villas or delicious menu.

Keep your links simple and straightforward. Get fancy and creative in other places that won’t hurt your user’s ability to find what they are looking for.

Avoiding Long Pages

I see this misconception come up quite frequently due to past trends and best practices. But it is no longer valid to assume website users do not like to scroll or read long pages.

Why?

With all of the different mobile devices on the market today users have no choice but to scroll to see all of the content on small screens. It’s also easier to scroll than it is to click through multiple pages or try scrolling within one of those horrendous i-frames to try and keep the user from scrolling in their browser window.

Font size has a direct impact on page length. The standard used to be 12px which is crazy to think was even readable. Now the recommendation is to use at least 16px type for body copy. The copy you are reading right now is 18px. Responsive design has changed the way designers think about typography. The guidelines for smaller screens are much different than desktop screens. The balance between white space, font size and readability is directly correlated with screen size. Headings might not be as large in comparison to body copy when reading on a smartphone. The more white space you have the larger your headings can be and still appear balanced to your readers.

A larger font size makes your content more enjoyable to read but also leads to longer pages that require more scrolling.

Don’t fear the scroll. Your users will scroll if your content is worth reading.

Page Fold

Now this one is ancient (if we’re speaking in tech time here). This myth compliments the fear of making users scroll long pages.

The page fold is the point at which the content on your screen hits the visible portion of your browser window. The old way of thinking was to try and keep all content above “the fold”.

Good luck.

Think about all of the devices out there. Each device has a different screen size, resolution and can even change orientation from portrait to landscape.

It isn’t possible to cram all of your content above the fold, especially when there isn’t a single fold to design for. It is still important  to put your most important content towards the top of the page. Prioritization of content is key in keeping your visitors engaged.

There is no way to know where the fold falls. Sure you can look at your analytics and see what your user’s top devices are and attempt to focus on those, but how do you handle content on a smartphone turned horizontal?

My point is you can’t.

So throw out any thoughts about the mysterious page fold and focus on presenting content your users can read easily and receive value from.

Too Many Image Slides

Image Sliders Bad

This is one of the most common problems I see with a lot of websites, even ones I have designed (yes I admit I am not perfect either). Websites with image sliders aren’t seeing engagement on second, third and subsequent slides. It nearly all cases I’ve tested and read about slides beyond the first are often overlooked completely. Users prefer to scroll down a page compared to clicking through sliders. But the biggest reason they are often bypassed is due to the type of content in them.

Some studies suggest giving users a preview of the next slides can encourage them to click-through. But since most websites that use sliders, use them for advertisements, we’ve been conditioned to ignore them.

What type of content are you placing in your slider if you have one? Can you remove it and still communicate your key messages?

Improper Use of Pop-ups

Pop-ups are used quite often for email sign-up and other promotions which usually interfere with a visitor's experience on your website.

Pop-up windows can be very effective if used wisely.

Pop-up Best Practices

  • Keep the content short and sweet. Two sentences or less.
  • Offer multiple ways to close out of the pop-up window including:
    • Clicking anywhere outside of the pop-up window
    • A close icon or text link in the upper right corner of the pop-up
    • Next to your main button or call to action include a “no thank you” link to close out of the window
  • Consider mobile users, make sure your close targets are big enough for touch
  • Only show the window to visitors who haven’t visited the site. This can be done using cookies within a web browser. Show the pop-up once to avoid irritating your visitors. Set an expiration date on the cookie to approx. 60 days.
  • Add a delay of 3 to 4 seconds until the pop-up appears so the visitor has a chance to read a little bit on the page first. This is especially important for first time visitors who might not know anything about you.

Social Media Placement & Use

I’m a big believer in the value of social media. But the last thing you want to be doing is sending your visitors away from your website too early in your sales funnel (unless you have a really compelling reason to do so).

Social media should help in driving traffic to your website, not the other way around.

Encourage readers to share your content using social media sharing tools. You’ll be surprised how many people share content without even reading it. Place social share buttons at the top of your blog posts and other key pages containing sharable content. Remember posts that have photos are the most likely to be shared.

“Facebook posts containing photos account for 87% of all interactions.”
eMarketer

When you are sending your visitors away to Facebook, Pinterest and other social sites, make sure those links open up in a new window so they don’t lose their spot on your website.

Getting visitors to follow you on social networks is great! We want them to be reminded of your business regularly, especially if they are not ready to buy yet.

The footer and sidebars on your website are excellent places for social media icons. The header is also a popular spot, but it is prime real estate.

Don’t make the mistake of including social channels you aren’t active on.

Having only one reference to Facebook is better than six social icons referencing networks that haven’t been updated in months. You’ll be more likely to gain the user as a follower if you look like you’re worth following.

Too Much Focus on SEO

Concerning yourself with search engine optimization is important but it shouldn’t come before your user’s experience. You might have heard about trying to focus your content on specific keywords your visitors might be searching for.

If you have good content you shouldn’t have to worry too much about trying to stuff a bunch of keywords into it just to follow the latest SEO trends. If you’re marketing a destination or attraction your location is really important to squeeze in throughout your content. You’ll also want to talk about what you offer and why your reader should visit.

When you get too focused on SEO your content will end up sounding like it’s written for search engines and not humans to enjoy. If you repeat keywords over and over again, Google and other search engines may even penalize you for keyword stuffing.

Search engines are becoming smarter and smarter. They also change their algorithms on a very regular basis (which if you’ve played the SEO game before you might have experienced). Usually more often than you are probably working on your SEO and changing keywords and links. Google rewards sites that have a great user experience, not just the number of keywords they include or the types of link strategies they are using.

Use language and terminology your customers will understand by avoiding industry jargon and by writing how you speak. Don’t go chasing an SEO fad. Focus on your visitors. Give them compelling content they’ll enjoy reading and that will encourage them to visit. Hire a professional copywriter.

Content is the whole reason you have a website. Make sure you say something worth reading.

Auditing Your Website

Looking to make improvements to your website?

Auditing your website is a good first step.

Make a list (or start a spreadsheet) listing out every page on your website in column one. In the next column write down the last time you updated that page. In the third column write down the goal of the page.

The fourth column is most important. Write down how the page is accomplishing the goal you wrote in column 3.

If the page isn’t accomplishing its goal, in the final column include how you will change the page to make it happen. Maybe you need to remove it altogether and find another method of accomplishing your goal. Go through this audit with your team to make sure you don’t overlook anything. Fresh eyes are beneficial as well because they give a different perspective than those involved in the day-to-day business.

If the page isn’t accomplishing its goal, in the final column include how you will change the page to make it happen. This might be something you could go through with your designer or user experience consultant if you aren’t sure what to do.

Download Content Audit Starter Doc: Excel or CSV

Design Tips

Guiding Your Visitors

Guide your visitor through your website rather than giving them too much information at once.

Where should they go first?

Think about first-time visitors. If you’re a restaurant owner, focus on your menu. If it changes often you’ll want to make sure it takes top priority on your homepage and is first in your main navigation (from left to right).

Remember visitors might not come to your homepage first. If they come to your about page or locations page first will it still be easy for them to explore your menu?

For destination websites, what do your visitors often look for first? What is their ultimate reason for visiting your destination? If it’s a city website, what attractions and events would draw your visitor in? Showcasing reasons to visit your city should come first. Then you should encourage your visitor to find places to stay using callouts throughout the Things To Do or Events section to guide them further.

Sample Website Page Flow

Sample page flow diagram for destination

Blog posts, travel guides and other valuable content might be the first page your visitor’s come to from search results or social media sites. What types of callouts can you include to guide these potential customers to your primary pages?

Sample Page Flow From Blog

Sample page flow diagram for tour or attraction

Visit North Carolina offers trip ideas packed full of sample day itineraries, leading straight to business listings.

Guide Visitors with Content

Hierarchy & Prioritization of Content

Content Flow

Most languages (aside from Arabic and Hebrew) are read left to right. Place your key content on the left for an optimal reading experience. Sidebars that contain secondary content are best placed on the right so it doesn’t break up the reading experience. The only time this rule should be broken is when the sidebar contains navigation or filtering that is directly associated with the main content.

Page Hierarchy Web Design

Example of a well-placed sidebar from Visit North Carolina

Page Hierarchy

Hierarchy is used to give certain elements more prominence than others. It can be achieved by altering the size, color and style of any element.

Achieving proper hierarchy can help guide your users eye on the page to more important elements first. A quick way to test if your page has good hierarchy is to do a squint test. What elements stand out the most? Should they?

If you’ve done a content/page audit you should have a good idea of what your page goals are and what needs to stand out the most.

Using Color Wisely

Ultimate Color Tip
The best color tip I can give you is to choose a single color for your buttons and links that isn’t used frequently in other areas on your pages. At a glance your visitor’s should be able to tell what is a link and what isn’t. Links are what brings your visitors towards your end goal. There is a reason all links used to be blue and underlined in the early days of the web. It was globally understood as a link.

Color Meanings
Color is very emotional. Being surrounded by certain colors can make you feel relaxed, energized and even anxious or angry. This is the reason you don’t see a lot of bedrooms painted red. Take a look at the color chart below to gain a better understanding of how certain colors can make people feel.

Color Meanings Chart

Readability & Typography

The fonts you use to present your content can have a huge impact on whether or not it will be read.

Here are some examples of good and poor font choices:

Poor Sub-Menu Navigation Typography

Font Navigation Readability

The text in this flyout menu on the right is quite difficult to read due to the organic font being used. It works well for the larger main navigation links you see at the top, but when decreased in size you have to work a lot harder to read it. The font used for the text on the left-side of the flyout menu is much easier to read at a small size and would be a great choice for the links on the right.

Good Example of Navigation Typography

Example of Good Navigation Font

I Love NY uses large enough type for sub-headings and a slab-serif font that is easy to read for sub-navigation links.

You may not think typography is as important as it is. It can be the one thing that stands between your visitors reading your content or looking elsewhere.

Photography

The #1 Rule of Photography
Does your photo communicate something to your visitor? If not you shouldn’t use it. Large photos can add to the overall file size of a web page and cause poor performance if not properly optimized.

In Chapter 3 you’ll learn more about website performance and how to increase engagement on mobile devices.

Onward to Chapter 3