Learn more about user experience, web development and digital marketingView training courses

Many websites from varying sectors have some kind of geographical-based navigation, whether it’s a travel website, an estate agents’ site or even the store locator function on a retail website. The question is how to offer this functionality. Some sites offer map-based browsing, but often it’s not used heavily as it’s not easy-to-use. I’ve come across a few sites like this recently and it reminded of some previous tips I wrote for our newsletter on how to design effective map-based browsing.

Start from a high level and allow customers to drill-down

It’s important with map-based browsing to start from a high-level map view (e.g. the whole world or the whole of the UK). Users should then be given large, labelled areas to click on, such as countries, then regions, then cities, etc. During this process you must make each area a single hotspot with a mouse over effect to make it appear clickable.

Add further detail for customers who want specific places

It’s very common for travel customers to already know the specific city or region that they want to visit, or even the specific resort. To best cater for these customers you must provide an alternative way to find a destination, such as a dropdown list of the most popular destinations. In addition, you should consider adding landmarks at the most detailed map level e.g. town names or major roads to allow users to pinpoint their destination.

Remember to offer a way back

Chances are that customers will want to look at a number of destinations within a particular region. It’s no good making users start a new search every time they want to look at another destination. Instead you should give them a way to zoom out to the previous page.

Leave a comment

Required indicates required fields


Case studies

Our success stories

  • UCAS

    UCAS's Track portal is award-winning, achieving a 95%+ satisfaction rating across its 750,000 users

  • Hotels.com

    Hotels.com gained a much stronger competitive advantage due to a great mobile & tablet strategy

  • Pearson Education

    Pearson Education has embedded user-centred design into all their digital design processes

More case studies

Training academy

View training courses

About us

We're a user experience agency (UX agency) that creates people-centered, efficient and delightful digital experiences.

Get in touch on 020 7423 6320

Back to top