Nav PizazzBy Gabby Bryant
September 15, 2017
Navigation is the first thing users interact with when they visit a site, either for the first time or the 30th. They might know what they're looking for or they might just be browsing. At the end of the day, we all expect a certain experience when we make our way through a site. When companies take it upon themselves to shake that up a little, I think positive user experience, if not simply user interaction, increases exponentially.
Most hotel websites are pretty standard—users expect a certain degree of *flair*, but they are generally built using a specific taxonomy and predictability. As a possible visitor of a hotel, I'm looking first and foremost for an eye-catching scene—comfortable and well designed rooms, good location, consistent and easily understood details and pricing, amenities, etc. So, when I started perusing some new hotel websites, one of which I ended up booking (I'll let you guess which one), I started to feel intrigued by some of the navigation features I found myself paying attention to. I may be the only one to get excited about a fancy scroll here and a sexy transition there. These brands put thought and user experience into the forefront of their website design, and it pays off.
We'll start with the most straightforward of the three: The Marlton Hotel, a boutique hotel a block from Washington Square Park in New York City, keeps it simple. They know they're attracting a certain niche customer and they approach their web design that way: for people not necessarily looking for a standard hotel experience. It's simple, really. Great photography, clear navigation, straight-to-the-point information. What I love about this site is that it's not trying to hide anything. The first thing the user sees is an image of the lobby/sitting area of the hotel, and it might take you a second to notice, but the site's navigation is at the bottom of the browser. Start scrolling and the navigation header moves to the top of the screen and locks in place. It's nothing crazy, but it's thoughtful and different.
The Cheval Blanc hotel on St. Barth is, humbly, well-appointed. The website to display that shouldn't be anything short of well-appointed either. What piqued my interest on this site is that although its structure is typical of hotel websites, the way the structure is displayed is inspiring. The site's navigation is in the middle of the page, not the top or bottom. Yes, in some of the interior pages, the navigation moves to the top, but only after a few seconds of hanging out in the middle, closing to the right, and gently moving up. Not only that, but navigating to different sections of the site through the homepage allows the user to visualize what to expect in those sections; there are sub-navigation items listed, but each is assigned a relevant image for clarity. A user doesn't need to click on the Suites & Villas link, they can get a preview right from the navigation. Check it out.
Finally, for the most provocative of them all, we're back in New York at the Gramercy Park Hotel. This one is completely unexpected. The homepage is a long scroll, allowing the user to see where they are on a timeline display at the bottom of the page. Hover over any of these "timeline" indicators and you can jump to that section with ease. Should the user scroll (the slower the better, because then you can really see the effort someone put into the transitions of each panel), they'll notice a subtle diamond pattern watermark move gracefully with the images that transition in and out from panel to panel. Interior pages carry that same pattern, but display more information. Is the homepage particularly informative? Not really, but it sure is eye-catching and enticing. If the goal is to get people to explore more, or ultimately book a room, I would argue that they've succeeded.
At the end of the day, all we're looking for on any website we design is for users to enjoy their experience and leave the site with the information they were looking for in the easiest way possible. These websites consider that, and more, as we all should.