Mixed content

Long definition

Browsers distinguish two classes.

Active mixed content — scripts, stylesheets, iframes, XHR/fetch over HTTP. These can rewrite the page, exfiltrate cookies, or hijack execution. Chrome 80+ blocks all of it. Firefox and Safari have parallel policies.

Passive mixed content — images, audio, video over HTTP. Less dangerous on its own, but still removes the lock icon and signals an insecure connection. Browsers progressively upgrade or block these too.

The SEO impact is indirect but real:

• Page Experience signal treats HTTPS as a binary — pages serving mixed content fail the HTTPS check.
• User trust — broken padlock icons depress click-through and conversion.
• Service worker / PWA features require fully secure pages; mixed content disables them.

How you find it:

• DevTools Console logs Mixed Content warnings on every load.
• Content-Security-Policy: upgrade-insecure-requests as a header forces all http:// subresources to upgrade to https://. Add report-uri or report-to to log violations without breaking pages.
• Search Console doesn't surface mixed content directly; rely on DevTools, automated crawlers, or CSP reports.

The fix sequence:

1. Inventory all http:// references in your codebase, database, and CMS content. CMSes often store absolute URLs in post bodies — wp-content/plugins/better-search-replace-style migrations or DB queries.
2. Use explicit https:// URLs. Protocol-relative //example.com/img.jpg works but modern preference is explicit.
3. Add HSTS once you're confident; the preload list is the hardest commitment.
4. Add Content-Security-Policy: upgrade-insecure-requests as a safety net during transition.

Common misconceptions

• "Lock icon means no mixed content." Modern browsers may show the lock while silently blocking active mixed content — the page is "secure" because the unsafe resources never loaded. Check DevTools.
• "It only matters for forms and login pages." Any HTTPS page with mixed content fails the HTTPS signal in the sitewide context Google evaluates.
• "My site uses HTTPS, so I'm safe." A single <img src="http://..."> in a 10-year-old blog post still triggers the warning today.