Add a map on your company's website

4 years ago
Example of an integrated Map

In this article, we are going to answer the following question :

Why do you need to add a map on your company's website?

There are a multitude of reasons why it is interesting to include a map on your company's website. We will see that a map can provide a lot of information to your customers, including your influence in a country or internationally.
So, I will present you the different criteria to take into account when integrating a map on a website but also share my research on the different solutions to quickly add a map of the world on your website.
If you read this blog, you probably already know how you will use the maps that you will include on your blog. In this case, I invite you to go directly to the section about the criteria to consider when choosing a tool by clicking here.
For those looking for inspiration, I will share different ways to use maps to improve communication with your customers.

Add a map, for what purpose?

First of all, a map show the international location of a business as well as on a national scale. Whether it is the presence of subsidiaries abroad or customer references, a map will quickly gain the confidence of your visitors, who can see at a glance that others have trusted you before them.

When it comes to the presentation of your branches, it is important to show the name of the country or city name, and possibly some photos of offices or premises, in order to support the presence on the map. Finally, beyond the marketing aspect, this map could allow your customers to find you, close to home. On the other hand, when it comes to your customer references, it will be very interesting to reveal their name, but in priority their logos since these are very meaningful and will speed up the trust of your visitors.

Here are some concrete examples of using a map for your customer references and branches :

  • You are an architectural firm and you wish to give quick access to your most beautiful achievements
  • You are a company security audit firm and you want to present your customer references around the world
  • You rent specific equipment and want to show different cases of use of this equipment in your region
  • You offer localized services and want to indicate to your customers the cities in which these services are available
  • You are a network of estate agencies and you want your clients to find you quickly
website integration picture

There also exist cases in which globes are used, because they are more focused on the humanitarian aspect of your business. You can for example integrate a map of trips and seminars of your business. On this planisphere, you can for example place markers corresponding to each trip made by members of your company, as well as the photos of these trips. Such a map allows your visitors to see that your team is warm and that humanity is part of your values, which can improve first meeting
Note that if you have collaborators, or employees working remotely, around the world or scattered across a country, showing their location can be good to show that you trust them, trust that will then be passed on to your customers. In addition, the world map will show that you are close to them.

  • You work in an SME, you travel for business but take the opportunity to visit, so you can take advantage of the situation by communicating your overseas adventures through a map
  • Your company employs part of its workforce in full-time remote, a map of employees can be useful in order not to lose sight of each other. This map will facilitate the reception of new arrivals
  • You work in the IT sector, your company sends its employees to training and to conference, it is possible to list them on a world map so as not to forget all the accumulated experience

Use cases picture


To sum up, having a map on your website allows you to show the influence of your company in the world compared to your competitors. Showing achievements, presenting references or localized services, here are different use cases. Also, using a map to share the warm and humanitarian aspects of your business to your visitors will improve the first contact with your future customers.

What are the different criteria to take into account?

Now that we've listed a variety of reasons why embedding a map on your website, let's see the criteria that this one will have to respect. Indeed, it is necessary that the tool used to create and display the map, offers certain features so that it can be integrated perfectly on your website and to improve the user experience instead of being detrimental to it.

The use cases seen in the previous section guides us on the needs of our map. The first prerequisite , obvious but important to remember, is the addition of points on it. Indeed, if you choose a technology that is not based around the display of markers, you will quickly pull your hair out to get a satisfactory result.
The same goes for coloring country : certain uses of the map, such as adding countries in which your company is established, will require being able to color a country to make it stand out, which is complex and even impossible if your tool does not allow it natively.
The second need concerns the ease of editing the map. It is a priori in constant motion (since you will have new references, new subsidiaries or new trips). It is very essential to be able to add new markers on this map in less that five minutes. If adding a point takes too long, it is highly likely that the map will not be kept up to date.

Tesla map

Tesla map showing in Red the stores and Grey the SuperChargers

Whatever is the use of the map on your website, it needs to be in harmony with your brand image. In other words, the minimum required is to be able to adapt the colors of the countries and markers to the color of your graphic charter. If possible, it would also be interesting to be able to adapt the background so that it integrates with your site more aesthetically.

Beyond the previous prerequisites, other functionalities of your future mapping tool can make the difference, moving your map from a map that is simply viewed at a glance, to a map navigable, interactive and adopted by the visitor : These are the navigation functionality.

Navigation picture

Good navigation on a map means being able to move from one position to another easily, with as few actions as possible. In order to understand this better, here is a pretty example standard of bad practice :

Sometimes it is necessary to click a button a dozen of times to get enough of the zoom level to see the position of a point of interest. This action is very expensive and the user does not do this once or twice before leaving the map. To avoid this it is possible to activate the zoom using the mouse wheel or the shortcut "CTRL + wheel" (to avoid disturbing the scroll of the user on the site). In addition, if some markers are too close, it is possible to group them to give readability. Finally, it would be useful to be able to go on two markers which are grouped by clicking on the grouping marker.

The last option, which seems to be a plus, but turns out to be a real asset, is sharing images on the map, it will attract the visitor and bring life to the map. These images can be logos of the companies you work with, photographs taken during your professional trips and seminars, photos of your subsidiaries and branches, or even photos of your greatest achievements as a company. At the risk of repeating myself, I emphasize the fact that it is significant that the images are easily accessible.

Here is an example of what an image integration can provide for a map. Go on this webpage to see how the image integration can work on BearStudio website !

TraveledMap on BearStudio's website

TraveledMap of BearStudio company


There are different criteria to consider when you want to upload a map. If possible, you better have to use a system of markers in order to be able to add information on the map. Also, you must keep a map easily editable. This means that the navigation on the map must be as intuitive as possible. Finally, the last option is to add an image sharing service on the map while keeping an easy-to-use aspect for the user.

Some various solutions...

Now that we have seen the purpose of creating a world map on your business site, and all the features it can contain, let's see what are the solutions available for you in this third and last part.

Developer picture

You have the possibility to develop your own map by yourself. You will be able to use mapping tools such as Mapbox or Google which will allow you to display a mapping on your website. First, install an SDK (Software Development Kit) of the chosen tool before starting to develop.

You can also create your map using editing software like Photoshop. You just have to take a royalty-free background map on the internet and add the cities or pin down your different buildings. You can also add hotspots on the image, allowing the user to interact with them and so to be redirected towards different sections of your website. Creating your map using editing software can produce beautiful results, however handling these very complex software requires some particular skills.

There is a service offered by Google called Google MyMaps, which allows you to create maps quickly by adding markers that can represent different things (restaurants, offices, leisure spaces...). Google MyMaps allows you to easily integrate the map on your website via a iframe element.

Nasa website picture

Example of NASA using Google MyMaps to locate NASA Centers

The last solution I can offer you is the one I designed, this is, according to me , the most simple one to use and the easiest to integrate on your site. It is TraveledMap.
As a developer, I created this solution in order to meet the various criteria that I did quote you before.
I designed TraveledMap in order to give users the ability to create maps that are fully customizable and easily integrated into different websites. It is possible to customize the background of the map, the color, the icon and the size of each markers, what zoom you want, which default centering you need and to ... The final result makes it very easy to include the map on your website, each marker will redirect the user to a section of the web page using simple interactions. In addition to that, you are able to add the trip photos made by your employees.
You can compare the options of TraveledMap and the other solutions presented above by reading this article on the creation of a map.


In short, choose the way to add a map on your website is very easy and simply depends on the time that you want to devote on it :

  • Developing your own map from A to Z may be useful for developers but may be very time consuming for people with less experience in this domain.
  • Creating your own map via software like Photoshop could produce beautiful result but requires some skills in those softwares that are sometimes very complex...
  • Generate your map with Google MyMaps service allows the integration of this one very easily thanks to an iFrame element but the customization is not complete at all...
  • The last solution is the most conceivable because it is very complete and solves every problems that we have seen above. TraveledMap is the tool you need to tell your company stories, it offers you customization and the best experience for you and your visitors !
I advise you to learn more about TraveledMap and its use by clicking right here !