Mixed content ontstaat wanneer een HTTPS-pagina HTTP-resources laadt — afbeeldingen, scripts, stylesheets of fonts via een onversleutelde verbinding. Chrome blokkeert mixed active content (scripts, iframes) volledig en toont waarschuwingen voor mixed passive content (afbeeldingen). Het is het meest voorkomende HTTPS-probleem.
Wat is mixed content?
Een HTTPS-pagina die een afbeelding laadt via http://example.nl/foto.jpg creëert mixed content. De pagina zelf is versleuteld, maar de afbeelding niet.
Chrome maakt onderscheid:
- Mixed active content (scripts, stylesheets, iframes) — wordt geblokkeerd
- Mixed passive content (afbeeldingen, audio, video) — wordt geladen met waarschuwing
<!-- Mixed content: HTTP-afbeelding op HTTPS-pagina -->
<img src="http://example.nl/foto.jpg" />
<!-- Correct: HTTPS-afbeelding -->
<img src="https://example.nl/foto.jpg" />
Waarom belangrijk
Mixed content heeft directe SEO-impact:
- Browser-waarschuwingen verhogen bounce rates
- Geblokkeerde scripts kunnen analytics en functionaliteit breken
- Google ziet inconsistente HTTPS als een kwaliteitssignaal
- Geblokkeerde CSS kan CLS veroorzaken (layout shifts door ontbrekende styles)
Een noodoplossing is de CSP-directive upgrade-insecure-requests, die browsers vertelt om HTTP-resources automatisch als HTTPS op te vragen. De structurele fix is alle HTTP-referenties vervangen.
Voorbeeld
Vind mixed content op je site:
# Chrome DevTools: Console toont mixed content waarschuwingen
# Of via command line:
curl -s https://jouwsite.nl | grep -i "http://" | grep -v "https://"
Fix: vervang http:// door https:// (of protocol-relatief //) in al je HTML, CSS en JavaScript.
Gerelateerd
- HTTPS, security headers en SEO
- Gerelateerde termen: HTTPS, HSTS, CSP