September 23, 2019
Think Mobile First: Hotel Web Design for Today's Consumers
Mobile is no longer a novel marketing channel—it's become a way of life. For many of us, we'd be lost
and anxious without our phones.
When it comes to travel, 94 percent of leisure travelers use multiple devices (mobile phone, tablet,
desktop) as they plan and book a trip, and up to half of all desktop bookings are preceded by a click (or
should we say, "tap") on a mobile device, according to recent research by Criteo.
By now, we are living in a mobile-first world; if your property is still without a mobile-friendly website,
getting one should take priority over everything else in your upcoming marketing budget. Hotels that
don't provide a user-friendly experience on mobile are simply losing bookings.
A responsive website design is the most effective way to cater to the omni-channel shoppers of today.
Automatically detecting the user's device and adjusting website presentation and functionality
accordingly to provide the best user experience on that device, responsive design provides consumers
with a seamless experience of your brand across all devices.
Traditionally, the approach for responsive design has been to design for desktop first and then pare
down for mobile. But the approach is changing.
In our mobile-first world, it's time to start thinking "mobile first" for hotel website design.
Why Mobile-First Design?
The web is now something we carry in our pockets, ready for action whenever and wherever we need to
know, find or buy something. Chances are your property's website will first be discovered by prospective
guests on mobile. Even if they ultimately prefer to book on desktop, that first (mobile) experience with
your website will influence their decision to book with you or not.
The term for the top-down design approach mentioned above (where a website is designed for the full-
scale desktop experience first, then cut back, removing content and features to accommodate smaller
screens and simpler operating systems) is called "graceful degradation." Such an approach tempts
designers and website owners to incorporate the more complicated (but exciting) technical features of a
full-scale platform into the initial design, which may not translate well to the mobile platform. This
results in an impressive website when viewed on a desktop computer, but an awkward user experience
on mobile that feels like an afterthought and degrades the cohesive cross-device experience of your
Instead, taking a "progressive enhancement" approach—where the website design is first developed for
mobile screens and operating system—results in an impressive mobile experience that looks polished
and functions perfectly (despite limited space and features), and can be further enhanced as screen size
and system features expand.
Starting lean encourages you to get to the nitty gritty of what's important, focusing your design vision
rather than distracting it with fancy features, for a more effective website that improves conversions. A
mobile-first website that progressively enhances as screen size increases results in a snappier
experience—in both answering the user's needs and page-load speed—on all devices.
Mobile-First Design Tips for Hotels
Choosing a responsive design is the first step to providing your guests with a mobile-optimized online
experience of your property. From there, taking a progressive enhancement (or mobile-first) approach
to building your website can help inspire and focus the design and purpose of your site.
>> Think "Simple"
Simplicity is key to a positive user experience not only on mobile, but on desktop too. Google research
shows that users prefer websites that are visually uncluttered and easy to navigate and understand, so
keep this in mind throughout the design of your website.
It can be hard to stick to the point when you have so much to say, but these tips can help:
- Make sure your USP (unique selling proposition) comes across front and center. It should be
clear to users very quickly upon arriving to your website why they should book with you.
- Most important information should be featured or accessible from the screen space "above the
fold"— avoid making users scroll to look for information on your site. Scrolling should be a
natural progression as users consume content, not part of the navigation process. Because
above-the-fold space is at a premium on mobile devices, prioritising content according to what
is most important to users is critical.
- Avoid over-embellishing with busy visuals; clear, easy-to-read font and the right balance of
"white space" are key elements of a mobile-friendly site.
- A simple, intuitive online booking process is essential to a positive mobile user experience. Your
online booking engine (OBE) should load fast, display a secure URL, and allow customers to
complete a booking within two to three steps or pages (avoid asking customers for more
information than you need to reserve their booking). Make sure your OBE is optimized for
mobile with tap-friendly form fields and buttons, and that it displays an instant booking
confirmation message upon completion of the booking to assure customers that their booking
>> Think "In-the-Moment"
Let the task-oriented nature of mobile user behaviour guide the design of your website. Consumers turn
to their mobile devices on the go, conducting frequent, short searches to answer immediate needs.
These intent-driven "micro-moments" propel consumers through the dreaming, planning, booking and
experiencing stages of their travel journey. A successful mobile website will answer their needs in the
moment—whatever stage they're at.
What do your prospective guests need and want to know? Your unique value proposition, compelling
property and room images, property amenities and local information will help inspire customers in the
dreaming stage. Availability, room options, rates, location and contact information are critical in the
planning stage. Of course, it goes without saying that the aforementioned mobile-optimized booking
engine is a must for the booking stage. And location, amenities, social media accounts and local
recommendations comprise useful information in the experiencing phase.
Ensure critical information is just a single tap away via the main menu or call-to-action (CTA) buttons.
From "view rooms" to "specials and packages" to "book now," CTAs should be prominently yet
relevantly placed to guide users through the customer journey.
Relevant to all stages of the travel journey, your contact information should be available at all times,
preferably on every page with click-to-call functionality. Likewise, your booking engine should also be
easily accessible from every page of your website, ready to catch customers whenever they reach the
>> Think "Fast"
Slow-loading pages negatively impact the user experience significantly on both mobile and desktop; 53 percent of mobile site visitors abandon a page that takes longer than three seconds to load. The longer
your webpages take to load, the higher your bounce rate, and the lower your conversion rate. Speed
matters. A lot.
Simplicity helps maintain a fast-loading website, and crafting your hotel's website design with a
progressive enhancement approach can help ensure a speedy site on all devices. Images and video can
slow down websites if used too profusely and not optimized for the web, so be sure to use images
When it comes to website design, mobile is no longer an afterthought—it should be front of mind.
Taking a mobile-first approach to your property's website will result in a more focused, intuitive and
effective design that generates more bookings across all devices.
Contact us to discuss your property's website redesign.