Anatomy of visual first experience best practices
-
Upload
marinet-ltd -
Category
Travel
-
view
287 -
download
0
Transcript of Anatomy of visual first experience best practices
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 1
leonardo.com
Table of Contents
02
04
07
11
14
18
2225
27
INTRODUCTION: The future of digital is visual storytelling
WHY VISUAL STORYTELLING MATTERS: The psychology of visual storytelling
PUTTING ON A SHOW: How the web has responded to the visual shift
KEEPING IT FRESH: How to source content that keeps your site up-to-date
PUTTING THE PACKAGE TOGETHER: Turning good visuals into great stories
GO FORTH AND PUBLISH: Adhering to best practices when publishing online
GET THE WORD OUT: How, when and where to tell the world your story
TODAY’S THE DAY TO GO VISUALThe web is moving in a visual direction
ABOUT LEONARDO
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 2
leonardo.com
Thanks for downloading!This eBook takes a look at how and why visually-driven websites are becoming the norm today and discusses the best practices your hotel can leverage to build and publish your visual story on your website, providing a compelling and engaging experience for your visitors.
Our contributing author, Greg Oates, has included many great suggestions and real examples gained through his work helping hotel
professionals reach guests through content marketing and visual storytelling strategies.
We hope this eBook will help you better understand how to successfully present your hotel in its best light online.
John McAuliffePresidentLeonardo
About Greg OatesGreg Oates is a veteran travel editor and hotel media content developer. Greg works closely with hotel marketers to help them reach guests through content marketing strategies, visual storytelling and media relations.
share this e-book
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 3
leonardo.com
welcome to the world wide web, circa 2013The future of digital is visual storytelling
The future is nowThe text-only websites of the early 2000’s have—slowly but surely—been replaced by graphically- and visually-driven web interfaces. Faster broadband speeds, cellular networks, and high-resolution screens have increased demand for attractive visuals to drive content, to the point that roughly one third of pixel real estate on the web is image content.a
Pictures. Videos. Photo filters. Infographics. Instagram. Pinterest. Vine. YouTube. Tumblr. Slideshows. Animated GIFs.
Introduction The future of digital is visual storytellingANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 4
leonardo.com
The trend is certainly obvious on the most popular social media networks. Websites like Facebook, Instagram and Pinterest are driven by visuals. Twitter, the domain of 140-character text bursts, recently added Vine, a video service showcasing 6-second visual bursts. And of course, you can’t mention video without mentioning YouTube and its one billion monthly visitors.
Visually-driven websites aren’t strictly for social sharing, though. The trend is stretching across the web and touching traditional web design as well, from retailers, manufacturers, service providers and more. The travel industry is no exception; more and more hotels, airlines, online travel agencies, tour
companies and others are enhancing their websites with exciting, engaging visuals that tell the story of what it’s like to use their service or visit them in person.
The best websites don’t just throw some pictures and video on the home page. They use those pictures and videos to tell stories—stories that allow the audience to experience whatever it is the website is selling.
“90 percent of all information that gets transmitted to our brains is visual.”b
Introduction The future of digital is visual storytellingANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 5
leonardo.com
chapter
01 why visual
storytelling matters
the psychology of visual storytelling
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 6
leonardo.com
Chapter 1 Why visual storytelling matters: The psychology of visual storytelling
It’s not just that our computer and phone screens are
better and our download speeds faster. Studies show that people prefer—even on
a subconscious level—to interact with visuals over
plain text. And marketers are learning to take advantage.
“Humans process visuals 60,000
times faster than text.”c
AirBnB.com
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 7
leonardo.com
According to William C. Bradford, author of Reaching the Visual Learner: Teaching Property Through Art, 65 percent of the population are visual learners.d And according to Carol Jeffers, professor at California State University, our brains are wired to respond to, interact with, imitate and mirror behavior that we see. She argues that our brains’ visual
systems allow us to “experience our own actions and those of others at an abstract level of representation.”e
In other words, the act of simply seeing something can allow us to experience it in our own minds. Is it any wonder, then, that marketers looking to tell engaging stories on their websites are moving away from blocks of text towards big, beautiful images and compelling video?
When it comes to your property, visual storytelling with engaging imagery is the perfect way to share your hotel’s atmosphere and your guests’ experiences. By sharing a story, you’re showcasing what staying at your hotel is like, and giving your website visitors the opportunity to
imagine themselves staying with you!
“Video now appears in 70% of the top 100 search results.”f
Chapter 1 Why visual storytelling matters: The psychology of visual storytellingANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 8
leonardo.com
chapter
02 putting on
a showhow the web hasresponded to the
visual shift
Loreal.com
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 9
leonardo.com
Virgin-Atlantic.com
FourSeasons.com
Nike.com
Chapter 2 Putting on a show: How the web has responded to the visual shift
From consumer goods to the travel industry, big and bold visuals rule the day.
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 10
leonardo.com
Taking a closer look at the samples on the previous pages, we can see that Nike, unsurprisingly, uses a lot of real estate on a large photo of a pair of running shoes. Taking a closer look, we can see the photo is actually interactive—we can adjust the color of the shoes and even the pattern of the fabric. They quickly become not just a pair of shoes, but your pair of shoes.
L’Oreal uses a carousel structure common to today’s web design, but it’s large and the fonts and photo choices call back to fashion magazine advertising, creating a visual connection to a more traditional experience. Apple’s homepage design, which we saw earlier, is almost minimalistic, with a toolbar at the top, a product in the middle with a link to a video and large visual buttons along the bottom of the page.
And Virgin Airlines is careful to include all the information and interactivity travelers expect and need—such as booking and check-in options—but surrounds it in an attractive, encompassing background image.
Strong visuals are critical in the travel and hospitality industry. As a hotel marketer, what you’re selling is the experience of staying at
your property. Your photos and videos can convey that in a much stronger way than a text description or list of amenities. Virtual tours, 360-degree panoramas, and photos that show guests at your hotel can demonstrate
to website visitors just what they can expect when they book a stay at your property.
“Using video on landing pages can increase conversion by 80%.”g
Loreal.com
Chapter 2 Putting on a show: How the web has responded to the visual shiftANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 11
leonardo.com
“The end goal is direct bookings. So there should be an immediate visceral impact when potential clients arrive at your website, and clear direction toward more photos and videos to extend that emotional connection. Travel is an emotional experience. The best hotel websites are too.
Just a few great examples are Singita Resorts, Standard Hotels, ALT Hotels and Four Seasons Hotels. All of them tell a visual story about their properties and destinations to provide a high-impact experience that draws viewers into the site, never lets them go, and increases direct sales.”
Singita.com
ALThotels.ca
StandardHotels.com
Chapter 2 Putting on a show: How the web has responded to the visual shiftANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 12
leonardo.com
chapter
03 keepingit fresh
how and where to get the content
that keeps your site up-to-date
TheFreehand.com
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 13
leonardo.com
From pro photo shoots to social media, find the images that showcase your hotel experience.At this point it should be clear: To take your hotel’s website to the next level, you need to reinforce it with strong visuals.
The next logical step is acquiring those visuals! You probably already have a collection of professional media: Photos of the property, including rooms, business center, pool and so on. You may also have virtual tours and videos. That’s a great start.
You can round out your existing media by sourcing photos and videos from the surrounding area. Your local tourism board is a great place to start, but don’t hesitate to reach out to restaurants and attractions
directly. This way, you show your visitors that your hotel experience isn’t just on the grounds of your property—it extends to the local area as well.
Next, consider “non-professional” media. This can include photos that you and your staff can take yourself of the property and area, as well as photos sourced from guests, including any they’ve tagged of your property on social media. (These can be linked to freely, but always get
permission if you intend to use them in other ways). While these sorts of photos may not have the “shine and polish” of a pro photographer, they offer an
authenticity that appeals to travelers. With new filters and better cameras available today, amateur photos are better than ever before. They show real people enjoying your hotel in a real way. A good mix of professional and amateur photos and videos can really bring your property’s story to life!
What to look for in a web publishing solution: Find a solution that easily allows you to store a variety of media in a centralized location.
Chapter 3 Keeping it fresh: How to source content that keeps your site up-to-dateANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 14
leonardo.com
0102
03
04
05
06
tips for
sourcing content
Look beyond your door: Connect with the local tourism board and nearby attractions, restaurants and other vendors and suppliers for photos that showcase the experience of staying in your area.
Be authentic: Staged photos have their place, and using them isn’t a bad thing. Just make sure it’s not all you use. Guests also want to see a story! One way of showing it is by including photos of real people enjoying your property. All you have to do is ask online or in-house. Many hotel websites have a dedicated email address where guests can submit their images.
Most hotels have a budding photographer on staff seeking exposure and feedback. Find out who they are and work out a barter. Or hold an employee contest for new photos, with prizes for the best entries.
Instagram, Facebook and Pinterest contests are very popular for a number of reasons. They help promote the hotel and engage potential guests, both local and out of town. They can provide exceptional imagery that hotels can use on their websites, and they encourage online sharing.
Create a photography lesson package with a local professional photographer throughout the year. Then let guests know that the best photos of the hotel and destination will be used on the website.
Most importantly, when you do have a collection of new photos, showcase them prominently on the website and promote them extensively on social media.
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 15
leonardo.com
chapter
04 putting the
package togetherturning good visuals into
great stories
Broadmoor.com
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 16
leonardo.com
HoxtonHotels.com PreferredHotelGroup.com
LittlePalmIsland.com
Chapter 4 Putting the package together: Turning good visuals into great storiesANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 17
leonardo.com
Mixed media that doesn’t tell a story is a pretty boring thing.Once you’ve arranged an effective method of sourcing content and keeping it fresh, how do you actually curate it in a way that makes sense? Visually representing your hotel’s story requires more than just adding a massive gallery of property photos to your site. The way you present your photos and multimedia should accurately represent what a guest will experience when they stay with you.
Transforming your content into great stories can be a challenge, but the best way to start is to keep it simple. Consider the season, local attractions, or special events. If it’s summertime, you can show off your pool, outdoor recreational activities, the local amusement park, beach or zoo—basically any local summertime hotspot.
If you do a lot of weddings, consider a natural flow of photos and videos: happy newlywed couples, your ballroom—empty, decorated, and then filled with guests, a romantic nearby garden at sunset, and so on.
Showcasing distinct stories can give your website visitors the opportunity to see themselves in your stories, giving them a true feeling of what their vacation at your hotel will be like.
“One of the easiest ways to get started is by creating a dedicated page with special upcoming events in your destination. Update it once a week with interesting content and photos sourced from the event creators.”
Chapter 4 Putting the package together: Turning good visuals into great storiesANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 18
leonardo.com
01
02
DesignHotels.com
HotelMissoni.com
What to look for in a web publishing solution: Managing all of your content can be tricky. Consider a solution that lets you organize your media into groups, or tag and categorize it, so that it can be easily sorted and published together.
Chapter 4 Putting the package together: Turning good visuals into great stories
tips for curating contentBe relevant: Keep your photos videos grouped and presented in logical manner. Always remember it’s the guests’ experience that you want to showcase.
Maximize your search engine optimization: Tagging your multiple, linked pieces of content with common search terms and keywords can help boost your organic search rankings, making your hotel easier to find.
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 19
leonardo.com
chapter
05 go forth
and publishadhering to best practices when
publishing on the web
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 20
leonardo.com
Images draw attention; visual storytelling can trigger an emotional reaction and results in conversion. Once your content is mapped out in a way that tells your hotel’s story, the next step is actually publishing it online.
Multimedia galleries are a common and logical step. Dividing them into sub-sections that each tells part of your story is an easy and straightforward way to publish your content in an engaging and interesting manner. Think beyond your homepage and find opportunities within other sections of your website to publish these stories. If you have a page about your restaurant, publish a gallery there that features your top menu items, guests enjoying their meals and a video of the head chef or bartender crafting their signature dish or cocktail.
Considering the platform is also part of the publishing step. Beyond your own standard website, you also need to consider your tablet- and smartphone-optimized sites, and the different needs of those platforms. At this stage you can also consider publishing your story on social media and online travel sites.
Chapter 5 Go forth and publish: Adhering to best practices when publishing online
HolidayInn.com
FourSeasons.com
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 21
leonardo.com
Chapter 5 Go forth and publish: Adhering to best practices when publishing online
“Restaurant, spa, golf, tour desk and other amenity landing pages are good sections to place specific, related photos and videos. Create a video with your chef, spa director or golf pro. Anyone interested in those amenities will stay much longer on those pages if that type of visual storytelling exists.
And be creative! Hyatt Andaz Liverpool created a video with its chef while he was walking through a garden, fresh market and cattle farm, showing where he sources his food.”
Hyatt Andaz Liverpool on YouTube
“Images can trigger emotions and memories, which makes them engaging.”h
Barnsley Gardens Resort on Facebook
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 22
leonardo.com
01
02
What to look for in a web publishing solution: This stage is where a web publishing solution can really shine. If your system has helped curate your content, it should also include the ability to publish it in categorized groups and galleries directly to a variety of platforms.
Triptease.com
StandardHotels.com
Chapter 5 Go forth and publish: Adhering to best practices when publishing online
tips for publishing yourStay current: Refreshing your content is key, especially if your property or the local attractions go through changes. You want your guests to see what your hotel is really like, not what it used to look like.
Start telling your story “above the fold”—the space of your web page that’s visible on initial view without any scrolling. That is your website’s most valuable real estate. Start telling your hotel’s story right away, and give your visitors a reason to keep scrolling!
content
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 23
leonardo.com
chapter
06 get the
word outhow, when and where to tell
the worldyour story
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 24
leonardo.com
Make use of multiple channels to tell your story in a compelling, engaging manner.
Good stories aren’t just told once—they’re re-told, over and over, often in different mediums. Your hotel’s story, and your digital marketing plan, should follow the same idea. After all, if you’re not telling your story, you’re not going to benefit from all the resources you put into sourcing, curating and publishing your content!
Sharing, or amplifying your story, can encompass several different means. You can tweet about your latest gallery or multimedia presentation, share links on Facebook, add photos to Instagram or create a board on Pinterest.
You can also share your stories on travel websites, review sites and OTAs, include links in your e-mail signatures and even add them to sales proposals.
Ultimately, your goal should be to tell your story to as many potential visitors as possible, using all of the channels available to you. Modern travellers do their research on a variety of platforms (desktop, mobile) and channels (website, social, travel sites). By ensuring a consistent, visually rich and engaging presence across these platforms and channels, you can be confident you’re always putting your hotel’s best face forward, regardless of how a prospect finds you!
“St. Regis Punta Mita sends out its own and crowd-sourced Instagram photos multiple times weekly. Marriott Hotels launched its new “Travel Brilliantly” rebranding campaign on YouTube. Hotel groups like Fairmont, Ritz-Carlton and Kimpton were early adopters of Twitter, with legions of loyal fans to show for it. And everyone is on Facebook, but many hotels and hotel groups don’t update their pages on a regular basis.”
St. Regis Punta Mita on Instagram
Chapter 6 Get the word out: How, when and where to tell the world your story
Marriott Hotels “Travel Brilliantly”
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 25
leonardo.com
“There are over 220 billion photos on Facebook.”i
What to look for in a web publishing solution: Look for a solution that lets you publish directly to all channels including social media, either through galleries or scheduled regular postings, to get the word out consistently.
01
02
tips for amplifying contentBe consistent: While the specific details of the stories you tell may differ —and you’ll want to play to the strengths of each channel and platform—it’s important to keep your tone and branding elements consistent so that no matter where a visitor finds your story, they know it’s you telling it.
Keep it fresh: We’ve discussed keeping your content current in previous sections, but it’s an important aspect of amplifying your website as well. You don’t want to just tweet out the same photo gallery over and over. People will be more apt to click and share your links if your content is refreshed and current!
ALT Hotels on Pinterest
Chapter 6 Get the word out: How, when and where to tell the world your storyANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 26
leonardo.com
chapter
07 today’s the
day to govisual
the web is moving in a visual direction
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 27
leonardo.com
The best brands worldwide are leading the way, and chances are, your competitors will follow suit—if they haven’t already.
You can’t afford to be left behind.
It’s time to get serious about visual storytelling on your hotel website and beyond.
Begin sourcing your content, considering the stories you want to tell with that content, and start thinking about how to publish and amplify those stories:
Expanding your visual storytelling efforts with rich, engaging media will make your hotel stand out from the competition and give web visitors a “you-are-there” feeling when they find your property online.
SOURCELeverage all of your media - photos, videos, virtual tours
Use professional and amateur sources
Find “real” photos - photos that show actual visitors enjoying your property
CURATESort your media into stories
Focus on what visitors to your property will experience
PUBLISHPublish your curated content as individual distinct stories
Refresh your content often
Maximize the space on your website
AMPLiFYFind multiple ways to tell your story online
Make the most of social media and travel sites
Keep your branding and tone consistent
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 28
leonardo.com
About LeonardoLeonardo is a technology and online media company for the global hospitality industry. We provide e-marketers at hotel brands, management companies and hotel properties with technology, sales conversion tools and a global travel media network that enables them to better visually merchandise their hotels to millions of in-market travel shoppers monthly.
Our core products, the VScape® Digital Asset Management System and VBrochure™ Online Merchandising System, leverage the VNetwork™ - the largest media syndication network in the industry. It includes all major search engines, Global Distribution Systems, online travel agencies, travel research and supplier websites, search portals, review, travel editorial, local directories and major social media and video sharing sites.
Taking advantage of VBrochure’s mobile and social media platforms, hotels can ensure that their rich visual presentations reach consumers on their mobile devices and through their social graphs. For more information about Leonardo, visit www.leonardo.com.
share this e-book
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 29
leonardo.com
SOURCES a Wall Street Journal: Publishers’ Next Ad Challenge: Photos (http://online.wsj.com/article/SB10000872396390443720204578004501832637108.html) b Customermagnetism.com: What is an infographic? (http://www.customermagnetism.com/infographics/what-is-an-infographic/) c 3M: Polishing your Presentation (http://web.archive.org/web/20001102203936/http://3m.com/meetingnetwork/files/meetingguide_pres.pdf) d Reaching the Visual Learner: Teaching Property Through Art (http://papers.ssrn.com/sol3/papers.cfm?abstract_id=587201) e International Journal of Education & the Arts: On empathy: The mirror neuron system and art education. (http://www.ijea.org/v10n15/) f Kissmetrics: Can Product Videos Increase Conversion Rates (http://blog.kissmetrics.com/product-videos-conversion/) g
eyeviewdigital: Making video accountable (http://www.eyeviewdigital.com/documents/EyeView-White-Paper-Making-Video-Accountable.pdf) h Usabilla: 10 Things to know about images in web design (http://blog.usabilla.com/10-things-to-know-about-images-in-web-design/) ci Visual.ly: A Snapshot of Digital Photography in the U.S. (http://visual.ly/snapshot-digital-photography-us) Leo_eBook_WebMarketing_13.0131
ANATOMY OF A VISUAL-FIRST WEBSITE EXPERIENCE / 30
leonardo.com