UX Articles

Make the Travel Accommodations “Booking” Search Feature the Primary Content on the Homepage (25% Don’t)

Edward Scott

Research Lead

Published Aug 16, 2022

Key Takeaways

  • “Booking” search features are critical to users on travel accommodations sites
  • However on 25% of accommodations sites the search feature is unnecessarily difficult for users to find
  • A difficult-to-find “Booking” search feature sets a negative first impression for users as they begin their accommodations search

Users shopping for travel accommodations typically have a specific destination and travel dates in mind.

Therefore, search is the preferred — and the most sensible — accommodation-finding strategy.

However, as observed during large-scale Travel Accommodations testing, if the “Booking” search feature is difficult to identify on the homepage immediately, nearly all users, regardless of their familiarity with a site, will be unnecessarily delayed in taking the first step toward identifying a suitable hotel room or property to book.​‌‌‍‌‌‌‍‌‌‌‌‍‌‌‌‌‍‌‌‌‌‌‌‌‎

In this article we’ll discuss our Premium research findings on why it’s critical to make the “Booking” search feature the primary content on the homepage — which our travel UX benchmark shows that 25% of Travel Accommodation sites don’t do.

In particular, we’ll discuss 2 findings from our Travel Accommodations testing related to the “Booking” search feature results for online travel agency (OTA), large-brand hotels, whole property rentals, and boutique hotels:

  • How inconspicuous “Booking” search features hamper users’ ability to efficiently find a suitable accommodation
  • How to ensure the “Booking” search feature is adequately prominent on OTA, large-brand hotels, whole property rental, and boutique hotel sites

How Inconspicuous “Booking” Search Features Hamper Users’ Ability to Efficiently Find a Suitable Accommodation

Testing revealed a key difference in user expectations on OTA, large-brand hotel, and whole property rental sites, and users on boutique hotel sites; namely, the relative importance of the “Booking” search feature is much more important for users in the former category of sites compared to users in the latter.

“Booking” Search on OTA, Large-Brand Hotel, and Whole Property Rental Sites

During testing, nearly all participants — 99% — shopping at OTA, large-brand hotel, and whole property rental sites immediately looked for the “Booking” search feature on the homepage.

Moreover, all the OTA, large-brand hotel, and whole property rental sites tested displayed a “Booking” search feature directly on the homepage.

However, some of these sites failed to give the “Booking” search feature the attention it deserves, considering its importance in locating a room or property to book.

“Okay, so first of all, I would expect it to have a search thing — a search bar — right? Like, when you come in, that says, ‘where are you going and when?’” This participant, having scrolled past the “Booking” search feature hidden below the page fold on the homepage at Marriott, returned to the top of the page and complained about its absence. “So I got to scroll down before you get to that”, she remarked, noticing the “Booking” search feature only after scrolling a second time.

Primarily, inspirational imagery on the homepage was prioritized on a few of the test sites, effectively pushing the “Booking” search feature below the fold.

Consequently, participants routinely had to redirect their attention on these sites away from their goal of finding a room or property to finding the “Booking” search feature itself — an unnecessary annoyance that cost nearly all of them some degree of time and effort to scroll or seek out an alternate path via the main navigation.

For example, while one participant needed only a few seconds to scroll and locate the “Booking” search feature hidden below the fold at Marriott, another took nearly 30 seconds to find it.

To be sure, users’ sensitivity to even a minor delay in locating the “Booking” search feature on the homepage shouldn’t be underestimated.

Additionally, prioritizing imagery over the “Booking” search feature on the homepage increases the chance that, even if the “Booking” search feature is visible above the fold, it could be concealed by the site’s “Cookies” notification, which, during testing, was commonly a fixed banner at the bottom of the screen.

Indeed, a few participants had difficulty immediately spotting the “Booking” search feature on the homepage during testing, even when the “Cookies” notification only partially obscured it.

Users’ overall perception of a site can be damaged when identifying a core feature like the “Booking” search feature feels like a chore.

“Booking” Search on Boutique Hotel Sites

In contrast to participants on OTA, large-brand hotel, and whole property rental sites most participants on boutique hotel sites were partial to exploring the property information on the sites before checking availability.

For example, most participants were keen to view the gallery of property photos and learn details about the rooms and amenities. As one participant remarked when she landed on the homepage of one of the test sites, “With boutique hotels, I would want to look at their amenities because usually the boutique hotels are a little more limited on what they have”.

Therefore, the prominence of the “Booking” search feature isn’t an issue for as many participants as was observed for participants on OTA, large-brand hotel, and whole property rental sites.

Yet, although most participants were observed to be more exploratory and less focused on the “Booking” search feature on boutique hotel sites than when shopping at OTA, large-brand hotel, and whole property rental sites, the importance of the “Booking” search feature on the homepage for a subgroup of boutique hotel users should not be underestimated.

Indeed, some participants during testing on boutique hotel sites did immediately look for the “Booking” search feature.

Therefore, while it needs less prominence compared to the “Booking” search feature on OTA, large-brand hotel, and whole property rental sites, the ability to search for rooms and dates must still be readily accessible to boutique hotel users.

However, during testing this wasn’t always the case.

“I was going through the whole page because I couldn’t find the ‘Book Now’ button”, remarked a participant who had scrolled the homepage at NobleDEN and overlooked the “Book Now” button just below the large, animated room imagery. Clicking the “Book Now” button often takes users into the booking process on the boutique hotel sites.

For example, during testing a few boutique hotel test sites, rather than have a “Booking” search feature on the homepage, instead provided users with only a “Book Now” button.

In effect, this substitution risks the button being lost amongst the rest of the homepage content — as, unlike most “Booking” search features, there are no open form fields, which almost always draw users’ focus — and potentially overlooked by the subgroup of users who prefer to check availability and pricing first (as opposed to exploring property and room amenities, things to do in the area, etc.).

How to Ensure the “Booking” Search Feature Is Prominent

While users at OTA, large-brand hotel, and whole property rental sites have different needs when it comes to the findability of the “Booking” search feature compared to users at boutique hotel sites, both groups still require that the feature is easily findable on the homepage.

Ensuring Prominence of “Booking” Search on OTA, Large-Brand Hotel, and Whole Property Rental Sites

In terms of design and implementation, there are multiple design elements in particular that can be used to visually emphasize the “Booking” search feature on the homepage.

For example, prominent placement, high contrast against background colors and imagery, bigger input fields and font size, bold borders, and increased vibrancy of the “Search” button are all effective in helping users identify the “Booking” search feature immediately when they arrive at the site.

In particular, the three design elements that typically have the biggest impact are the following:

  1. Position
  2. Style
  3. Size

1) Position

The prominent placement of the “Booking” search feature in the upper half of the homepage at Booking.com ensures it won’t be overlooked by users when they arrive at the site.

First and foremost, the design pattern observed to perform the best during testing positions the “Booking” search feature in the upper part of the homepage.

This placement ensures the “Booking” search feature is immediately visible to users when they arrive at the site.

Additionally, prominent placement reduces the risk of “Cookies”, “Travel Advisories”, or other site notifications anchored to the top or bottom of the screen blocking users from immediately accessing the “Booking” search feature.

This participant repeatedly had to pause to scroll the page while selecting his “Rooms & Guests” criteria in the “Booking” search feature on Marriott’s homepage. When users have to scroll to interact with elements of the “Booking” search feature the time and effort to submit their query is unnecessarily increased.

Another participant experienced a similar issue with Marriott’s “Booking” search feature, needing to scroll in order to fully view and access the “Rooms & Guests” and “Special Rates” menus.

Additionally, it’s important to note that users should not have to pause inputting their search criteria to scroll the page in order to view and access all elements of the “Booking” search feature.

In practice, reduced visibility and access to the input fields makes entering information difficult, and can result in errors.

Positioning the “Booking” search feature high on the homepage will help to ensure all components are fully visible.

2) Style

At Airbnb the strong contrast of the “Booking” search feature and brightly colored “Search” button against the inspirational background imagery makes the “Booking” search feature highly dominant.

The homepage on travel accommodation sites often features large, inspirational imagery and other visual elements that fight for the user’s attention.

Increased contrast between the “Booking” search feature and the background, along with a vibrant “Search” button, is a highly effective way to ensure the “Booking” search feature stands out.

3) Size

At Plum Guide, the “Booking” search feature spans nearly the entire width of the homepage.

Making the “Booking” search feature large communicates its importance to users.

Additionally, visually wrapping the entire “Booking” search feature, including the “Search” button, increases its overall visual prominence.

Ensuring Prominence of “Booking” Search on Boutique Hotel Sites

Despite the decreased importance for users of the “Booking” search feature at Boutique hotel sites, Boutique hotel sites should still provide a “Booking” search feature that is easily identifiable and accessible directly on the homepage, rather than only a “Book Now” button, which users can too easily overlook.

Yet the prominence of the “Booking” search feature can be reduced compared to the prominence of the feature on OTA, large-brand hotel, and whole property sites (in order to showcase more bespoke imagery, special deals, etc.).

One alternate space-saving approach that was observed to perform favorably during testing employs a progressive disclosure design.

In effect, only a portion of the “Booking” search feature — the “Check In” and “Check Out” date input fields and the “Book Now” button — are displayed initially, and the remaining inputs are revealed when users interact with it.

At Expedia, the placement of the “Booking” search feature at the top of the homepage ensures it won’t be overlooked by users.

When it comes to the “Booking” search feature, travel accommodations sites need to cater to the needs of at least 2 groups of users:

  • Users on OTA, large-brand hotel, and whole property rental sites, who need the “Booking” search feature to be immediately visible
  • Users on boutique hotel sites, who still need the “Booking” search feature to be available, but who have fewer issues with regards to the feature’s prominence

Yet, despite the potential disruption and distraction to users, our e-commerce UX benchmark shows that 25% of OTA, large-brand hotel, whole property rental, and boutique hotel sites don’t make the “Booking” search feature the primary content on the homepage.

On the other hand, when the “Booking” search feature is highly prominent and easily accessible, users on travel accommodation sites are able to efficiently get started with their accommodations search — likely leading to a quicker and less friction-filled entry to the booking process.

Getting access: all 374 Travel Accommodations UX guidelines are available today via Baymard Premium access (if you already have an account open the Travel Accommodations Study)(You may also want to see our Travel Accommodations audit service for information on booking a UX audit of your Travel Accommodations sales site.)

Edward Scott

Research Lead

Published Aug 16, 2022

Ed is the team lead for UX research at Baymard and has been with Baymard since 2016. Ed oversees all UX research areas at Baymard. His specializations within e-commerce UX are Mobile, Checkout, Product Finding, Product Page, and Accounts and Self-Service. Ed has a PhD in technical communication and information design.

If you have any comments on this article you can leave them on LinkedIn

Share:

User Experience Research, Delivered Weekly

Join 60,000+ UX professionals and get a new UX article every week.

A screenshot of the UX article newsletter