Embedding location and maps on your website — tools, data protection, performance

Table of contents 11 sections

• 01What a map on your website is actually meant to do
• 02Three ways to show a location — and what makes them different
• 03Google Maps and the GDPR trap
• 04OpenStreetMap and Leaflet — the data-protection-friendly alternative
• 05Static image plus route link — the underrated tool
• 06Mapbox, MapTiler and others — when the effort pays off
• 07Performance — why maps are often the slowest section on a site
• 08When multiple locations get complex — the branch-map question
• 09Embedding a map in a legally sound way — the practical checklist
• 10Maintenance and updates — what comes up every few years
• 11What to check next

What a map on your website is actually meant to do

Before embedding any map tool, an honest question helps: what is the map actually supposed to do. In ninety percent of all SME websites it serves one of three purposes.

First, showing a location so visitors know where you are based. Second, offering a route start so someone can navigate directly to you. Third, presenting multiple locations or a service area, for branches, service regions, or a local network.

These three tasks differ technically in significant ways. If you only need to show an address, you do not need a fully interactive map with a zoom function. If you want to mark an 80-kilometre service area, you need something more than an embedded image. The choice of tool depends not on taste, but on what the visitors are actually supposed to do.

Stefan, a plumbing and heating contractor in Carinthia with 14 employees near the Slovenian and Italian border, only asked himself this question after three years. His website had an embedded Google Maps view because it "belonged there". No one used it — the visitors who wanted to call found the phone number faster than the address, and for route planning they opened the maps app on their phone. For three years the map cost loading time without delivering a single measurable benefit.

Three ways to show a location — and what makes them different

There is no single "right" way to embed a map, but three fundamentally different approaches.

The first approach is the fully interactive embedded map. You take an iframe code from a provider such as Google Maps, OpenStreetMap, or Mapbox, and drop it into the page. Result: zoomable and draggable, with a marker, possibly with a route function. Effort: low to set up, high in follow-up costs (performance, GDPR).

The second approach is the static map illustration. You take a screenshot or download a static image via a maps API and embed it as a normal picture. Above it you place a button such as "Open route in Google Maps" or similar. Result: visually similar, technically much lighter, no GDPR stress. Effort: a little upfront work, then quiet.

The third approach is a self-hosted map via a library such as Leaflet or MapLibre. You host the map data yourself, or pull it through a library, without external scripts tracking your visitors. Result: fully interactive, GDPR-compliant, but technically more demanding to set up.

Which way fits depends on two questions: do you actually need interactivity, and how important is GDPR compliance without a consent-banner click.

Google Maps and the GDPR trap

The most common setup in Austria: Google Maps embedded, no consent banner in front, because "otherwise it looks ugly". That brings a concrete data-protection problem that is not merely theoretical.

As soon as the Maps embed loads, it transmits, among other things, the visitor's IP address to Google servers in the United States. That is a data transfer to a third country, which under the GDPR requires prior consent. A 2022 ruling by a German regional court awarded 100 euros in damages to a single plaintiff — that sounds modest, but every warning notice brings legal fees, and Austrian data-protection authorities have grown more active over the past years.

In practice that means: an embedded Google Maps view either needs a consent-banner click in front (the map loads only after consent), or you take one of the risks — warning notice or damages claim. Most Austrian hosting providers and data-protection officers recommend the consent route as the default.

Often forgotten in this discussion: an additional click on "Load map" costs you conversion. Studies on cookie banners show abandonment rates between 10 and 30 percent^[1]. A map that only becomes visible after two clicks is, for many visitors, effectively invisible.

OpenStreetMap and Leaflet — the data-protection-friendly alternative

OpenStreetMap is the Wikipedia of maps: an open, volunteer-maintained map project with worldwide coverage. The data is free to use, the quality in Austria is practically identical to Google Maps at city level, and in rural areas sometimes even more accurate.

OpenStreetMap is usually embedded via the JavaScript library Leaflet or MapLibre. Both are free, both are set up in five to ten lines of code, both transmit no personal data to third-party servers in their standard configuration.

The only technical point: the map tiles need to come from somewhere. Pulling them via the official OpenStreetMap tile server is fine for small sites — for larger sites, the OpenStreetMap Foundation requires a separate tile provider. Providers such as MapTiler or Stadia Maps come into play here, offering commercial tile service at fair prices.

Setup effort: usually two to four hours if you can do basic technical work, or a single fee between 200 and 600 euros if you hand it to someone else. Ongoing costs: zero with the official tiles, or 5 to 30 euros per month for a commercial tile service at mid-sized sites.

Static image plus route link — the underrated tool

For the most common job — showing a single location and offering a route start — the static variant is in many cases the best choice. It works like this:

You take a screenshot of your location in a maps application of your choice (or download a PNG via a Static Maps API). You save the image compressed as WebP. You embed it as a normal image on the page. Below it you place a button with a link such as "Open in Google Maps", "Open in Apple Maps", or "Plan route".

Advantages of this variant: no external scripts, no GDPR issue, loading weight of 30 to 80 kilobytes instead of 250 to 500, visually indistinguishable from an embedded map at first glance. Disadvantages: not zoomable, not interactive — but for 90 percent of "where are you" questions, that is fully sufficient.

Andrea, owner of a 38-room hotel in the Carinthian mountains, has switched her site exactly to this model. The embedded Maps view was removed, a static image was put in, with three buttons underneath ("Google Maps", "Apple Maps", "Directions as PDF"). Result: mobile LCP from 3.4 to 1.8 seconds, no more GDPR discussion with the data-protection officer, and the actual route requests increased by 12 percent because the buttons were more visible and faster to reach than the route button on the embedded map^[2].

Mapbox, MapTiler and others — when the effort pays off

There is a class of providers sitting between Google Maps and the self-built variant: Mapbox, MapTiler, Stadia Maps, HERE Maps, TomTom. All offer an API for map tiles, many with GDPR-compliant configuration and tiered pricing models.

Two cases make this worthwhile.

First, when you need multiple locations or more complex marker logic. A map with twenty branches whose opening hours change by day of the week can be built comfortably and reliably with Mapbox or MapTiler. With Google Maps embedding, you quickly hit limits here.

Second, when the map is a central element of your site and its appearance needs to match your brand. Mapbox offers extensive styling options so the map fits your colours and look. With Google Maps embedding you have practically no leeway.

Prices: Mapbox offers 50,000 map calls per month for free, then in tiers. For an average SME site with 1,500 visits per month, you stay within the free range. MapTiler is similar, with a somewhat different tier model. HERE Maps and TomTom are usually more expensive, in exchange for stronger B2B features.

Performance — why maps are often the slowest section on a site

An embedded Google Maps view typically loads between 250 and 500 kilobytes of JavaScript plus the map tiles themselves. On a mobile connection that means two to four seconds of additional loading time as soon as the map becomes visible.

On a contact page consisting only of an address, a map, and a form, the map alone can be responsible for half of the total loading time. Anyone taking the three-second test seriously — the point at which mobile performance starts costing real conversions — should treat the map as its own performance position, not as "just a small cost".

Two levers help.

First, lazy loading. The map appears only when the visitor scrolls into the area where it becomes visible. The standard for images is the loading="lazy" attribute; for embedded maps you do it via JavaScript or through a library.

Second, "image first, map on demand". You show a static map image plus a button "Enlarge map and explore interactively". Whoever clicks gets the full map; everyone else does not pay for a function they do not need. This hybrid approach has become the standard recommendation for map performance over the past two years.

When multiple locations get complex — the branch-map question

Once you want to show a map with three or more locations, you leave the realm of simple approaches. Here you will usually move to a self-hosted Leaflet or Mapbox implementation, because embedded Google maps quickly become unwieldy with multiple markers.

What to think about before setting this up: do you maintain the location data in one place or scattered across the site. If opening hours, addresses, phone numbers, or routes change, you do not want to be searching the map configuration. A small JSON file or an entry in your CMS that updates the map automatically will save you a surprising amount of work over the years.

Second: how important is filtering. If visitors should be able to filter by postcode or service area, you need not only a map but a small application underneath. Effort: between 1,500 and 5,000 euros for a solid implementation, depending on data volume and filter depth.

Third: mobile first. A branch map with thirty markers that looks excellent on the desktop is often unusable on a phone. Plan the mobile version first and check on a real device before launch whether you can still find what you are looking for.

Embedding a map in a legally sound way — the practical checklist

Before implementation, this short checklist pays off.

1. What task should the map actually fulfil. Showing a location, offering a route, filtering multiple locations — the tool choice depends on it.
2. What data-protection line are you taking. Place a consent banner in front and keep using Google Maps, or switch to a variant without third-country data transfer.
3. What does the mobile version look like. Loading performance under three seconds, touch-friendly operation, a visible route button.
4. Where will the location data be maintained. Configuring the map once is feasible; searching for addresses every six months is not.
5. What happens if the map provider goes down or raises its API prices. A fallback — for instance a static image — costs nothing and saves you in the rare case it occurs.

If you clarify these five points in advance, you do not build a map that needs rework a year later.

Maintenance and updates — what comes up every few years

Even an embedded map is not "set it and forget it". Two occasions make maintenance worthwhile.

First, address changes. Sounds trivial, is not: many sites have outdated location data because the map was ticked off as "running". After a relocation, a new branch opening, or a structural change, the map belongs on the update list.

Second, technical changes. In 2018 Google reworked the Maps pricing model — sites that had embedded maps for free up to that point suddenly saw "This map is for development purposes only" notices. The same pattern repeats periodically with commercial API providers. Without ongoing maintenance, you only notice through a complaint that the map has been broken for three weeks.

If your site is under ongoing maintenance, both are handled as routine on a quarterly basis. Once a year is usually fine. Never is what eventually produces a map that no longer works.

Frequently Asked Questions

What to check next

Look at your own contact page and answer two questions. How long does it take to load on a mobile device, and what does the map section actually look like there. Anyone with an embedded Maps view without a consent banner and three seconds of additional loading time has the biggest lever right in front of them — and since a map is also one of the more expensive elements on a page, it is worth knowing what a website actually costs in Austria before deciding where to invest.