Privacy Focused

Download the Site

Removing Google From Your Website: Fonts, Analytics, and Maps

Every time someone visits your site with Google Fonts, Google Analytics, or Google Maps embedded, you're sending their data to Google. IP addresses, browser fingerprints, and behavior patterns—all collected without meaningful consent. Here's how to stop that.

Why This Matters

Google offers free services for a reason: data collection. When you embed Google's code on your website:

Google Fonts - Google logs every visitor's IP address, browser type, and which pages load which fonts. They build profiles across millions of websites.

Google Analytics - Tracks user behavior, page views, session duration, and clicks. Google ties this to their advertising network to target users across the web.

Google Maps - Collects location data, search queries, and browsing patterns. Every embedded map is a tracking beacon.

You might not care about this data, but your visitors probably do. You're making privacy decisions on their behalf by choosing these tools.

Self-Hosting Google Fonts

Google Fonts are just font files. There's no technical reason to load them from Google's servers. Self-hosting is straightforward and faster.

Why Self-Host

  • No requests to Google servers (Google can't log your visitors)
  • Faster page loads (one less external connection)
  • Works without internet access to Google's CDN
  • No GDPR concerns about third-party data processing
  • Complete control over font delivery

How to Self-Host Fonts

Step 1: Download the font files

Download directly from Google Fonts and extract the font files you need (usually .woff2 for modern browsers).

Step 2: Add fonts to your project

Create a fonts directory in your website's assets:

/assets
  /fonts
    roboto-regular.woff2
    roboto-bold.woff2

Step 3: Update your CSS

Replace the Google Fonts <link> tag in your HTML with a local @font-face declaration in your CSS:

Old method (loads from Google):

<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">

New method (self-hosted):

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/roboto-regular.woff2') format('woff2');
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/roboto-bold.woff2') format('woff2');
}

body {
  font-family: 'Roboto', sans-serif;
}

That's it. Your fonts now load from your server. No Google tracking.

Performance Tip

Use font-display: swap to prevent invisible text during font loading. The browser shows fallback fonts immediately, then swaps to your custom font when loaded.

Only include font weights you actually use. Every weight is a separate file. If you only use regular and bold, don't include light, medium, or black weights.

Replacing Google Analytics

Analytics tools track visitors to help you understand traffic patterns. But most websites don't need this level of data—and definitely don't need to send it to Google.

Do You Even Need Analytics?

Ask yourself:

  • What decisions do you make based on analytics data?
  • Would your site function without knowing visitor counts?
  • Do you actually check your analytics regularly?

For personal blogs, portfolios, and small business sites, the answer is often no. You're collecting data out of habit, not necessity.

Alternative: Direct User Feedback

Instead of tracking page views, ask visitors what they want:

  • Add a feedback form or email address
  • Include "Was this helpful?" buttons on content
  • Monitor what people contact you about
  • Pay attention to which pages get linked or shared

Direct feedback tells you what matters to users. Analytics tells you what they clicked. The former is more valuable and doesn't require surveillance.

Privacy-Respecting Analytics Alternatives

If you genuinely need analytics, use tools that respect user privacy. Use your favorite search engine and search for "privacy focused web analytics" and you'll find a ton of results. These services collect basic metrics (page views, referrers, device types) without building user profiles or selling data to advertisers.

Self-Hosting Analytics

If you're technical, self-host analytics on your own server. Self-hosting means data never leaves your infrastructure. You control retention, access, and privacy policies completely.

Replacing Google Maps

Google Maps is convenient but sends location data, search queries, and IP addresses back to Google every time someone interacts with your embedded map.

OpenStreetMap as the Base

OpenStreetMap (OSM) is a community-built mapping database. It's open data that anyone can use without tracking users.

You don't embed OSM directly, you use a library that renders OSM tiles. The most popular is Leaflet.

Using Leaflet for Maps

Leaflet (https://leafletjs.com) is a lightweight JavaScript library for interactive maps using OpenStreetMap data.

Basic implementation:

  1. Include Leaflet CSS and JS in your HTML:
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
  1. Add a map container:
<div id="map" style="height: 400px;"></div>
  1. Initialize the map with JavaScript:
// Create map centered on specific coordinates
const map = L.map('map').setView([51.505, -0.09], 13);

// Add OpenStreetMap tiles
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: '© OpenStreetMap contributors'
}).addTo(map);

// Add a marker
L.marker([51.505, -0.09]).addTo(map)
  .bindPopup('Your location here')
  .openPopup();

That's a functional map with no Google tracking.

Tile Servers

OpenStreetMap tiles are free but shouldn't be used for high-traffic commercial sites (their servers can't handle the load). Options:

  • MapTiler - Paid tile hosting with free tier
  • Mapbox - Commercial tile provider with generous free tier
  • Self-host tiles - Run your own tile server (complex but fully private)

For small sites, OpenStreetMap's default tiles work fine. For larger sites, use a commercial tile provider or self-host.

Leaflet Alternatives

  • Mapbox GL JS - More features, heavier library
  • OpenLayers - Powerful but more complex
  • MapLibre GL - Open-source fork of Mapbox GL

Leaflet is the easiest starting point for most use cases.

The GDPR Angle

If you serve European users, GDPR requires consent for non-essential tracking. Google Analytics, Fonts, and Maps all trigger consent requirements because they send data to third parties.

By removing Google services:

  • You eliminate most third-party tracking
  • You reduce or eliminate cookie banner requirements
  • You simplify compliance

Privacy-respecting alternatives often don't require consent banners because they don't track users across sites or build profiles.

Check your local regulations, but removing Google tracking typically simplifies legal compliance significantly.

Performance Benefits

Removing Google services often makes your site faster:

Fonts - One less DNS lookup, one less HTTPS connection, fonts cached on your domain Analytics - No external script blocking page rendering Maps - Leaflet is lighter than Google Maps API

Fewer third-party requests means faster page loads and better user experience.

Implementation Checklist

To remove Google from your website:

  • [ ] Download font files and update CSS with @font-face
  • [ ] Remove Google Analytics script tag
  • [ ] Choose analytics alternative (or skip analytics entirely)
  • [ ] Replace Google Maps embeds with Leaflet + OpenStreetMap
  • [ ] Update privacy policy to reflect changes
  • [ ] Test all pages to ensure fonts and maps work
  • [ ] Monitor for broken functionality

Your website visitors didn't consent to be tracked by Google. Stop making that decision for them.