The advantages of using maps in websites are often overlooked. They’re a great way to engage your visitors. Plus they can offer some unique content opportunities.
Many websites take advantage of the Google Maps embed feature, displaying a single pin and perhaps a window of information. But there’s more where that came from. Google has developed a large application programming interface (API), allowing developers to think outside of the embed-box and create lots of interactive and engaging features. Here a few ways in which maps and mapping technology can be used to bring websites to life and offer a more personalised experience to the user:
Geolocation and Personalisation
The evolution of GPS-enabled smartphones and HTML5 have made it possible to quickly display personalised and relevant content to a user, based on their current location. If they allows their browser to share their current location, it’s possible to show places of interest, your nearest branch or office, or even plot directions for them – all in a visually engaging way.
The Canadian indie rock band Arcade Fire has worked with Google to create a personalised, interactive music video, using Google Maps. The video takes advantage of satellite and street views to incorporate the location that the user has entered into the video.
Full screen Maps
It’s even possible to base a whole website around a map. Combining the Google Maps API with a JavaScript library such as jQuery, you can include navigation, images, videos and, of course, locations around the world.
A good example is the website 125 Years of National Geographic – A New Age of Exploration. The web designers used API to create a black and white map background, onto which they plotted the locations of explorers around the world with colourful markers. They then used JQuery to present navigation and additional image slideshows for each explorer.
Infographics
Infographics have become a very popular visual method for displaying data and statistics. Using custom map markers, icons and CSS, it’s possible to style a map to take on the appearance of an infographic. This makes a nice alternative to the original-style infographics.
Contact Pages
Even in one of its simplest forms, Google Maps can be used to enhance a contact page, displaying office and branch locations. Sprinkle in some jQuery and it’s possible to bring the contact page to life with photos and video slideshows. You can even go one step further, using the Google API to offer users driving directions based on where they will be travelling from.
It’s all about coming up with an idea and making that idea a reality. In particular, the Google Maps API provides endless possibilities for presenting data in a visually attractive way, whether in websites, mobile websites or smartphone apps.