Frame einfach und verständlich erklärt – SEO Bedeutung

Was sind Frames?

In der Praxis nutzte man Frames, um zum Beispiel eine feste Navigation und einen wechselnden Hauptinhalt nebeneinander darzustellen – jeder Bereich lud ein separates Dokument. Das Frame-Element ist inzwischen als veraltet eingestuft und wird nicht mehr für neue Projekte empfohlen. Davon strikt zu unterscheiden ist der iFrame (Inline-Frame), der weiterhin gültig ist und einer Seite einzelne eingebettete Inhalte hinzufügt, statt das gesamte Layout zu definieren.

Frame vs. iFrame

Warum sind Frames obsolet?

Klassische Frames brachten zahlreiche Probleme mit sich, die zu ihrer Abschaffung führten:

• SEO: Suchmaschinen konnten Frameset-Inhalte schlecht indexieren, weil mehrere Dokumente in einem Fenster lagen.
• Kein Bookmarking: Einzelne Ansichten ließen sich nicht als Lesezeichen speichern, da die URL unverändert blieb.
• Zurück-Button: funktionierte in Framesets oft nicht wie erwartet.
• Barrierefreiheit: Screenreader hatten Schwierigkeiten mit der Navigation zwischen Frames.
• Mobile: Frames sind nicht responsive und funktionieren auf kleinen Bildschirmen schlecht.

iFrames: Inhalte einbetten

Der iFrame (Inline-Frame) ist weiterhin ein gültiges HTML-Element. Beim Aufruf der Seite lädt er einen fremden Inhalt innerhalb seines Rahmens. Eingebunden wird er mit dem iframe-Element samt Quelle (src), Maßen und einem aussagekräftigen title (wichtig für die Barrierefreiheit):

<iframe src="https://www.example.com"
        width="800" height="600"
        title="Beispiel-Website"
        loading="lazy">
</iframe>

Das Attribut loading="lazy" aktiviert das verzögerte Laden und verbessert so die Ladezeit der Seite. Typische Anwendungsfälle sind das Einbetten von Medien und Diensten Dritter, ohne sie selbst hosten zu müssen:

iFrames und SEO

Der in einem iFrame geladene Inhalt ist ein eigenes Dokument mit eigener URL. Google kann diesen Inhalt grundsätzlich crawlen, ordnet ihn aber in der Regel der Quelle zu, nicht der einbettenden Seite. Für Texte und Kerninhalte, die auf Ihrer Seite ranken sollen, eignen sich iFrames daher nicht – diese gehören direkt in das HTML der Seite.

• Sparsam einsetzen: iFrames vor allem für eingebettete Medien wie Videos und Karten nutzen, nicht für ranking-relevante Inhalte.
• Lazy Loading: loading="lazy" verbessert die Ladezeit, gerade bei mehreren Einbettungen.
• Aussagekräftige Titel: ein klares title-Attribut hilft der Barrierefreiheit und der Einordnung.
• Rendering prüfen: Über die gerenderte Version in der Google Search Console (URL-Prüfung) lässt sich kontrollieren, wie Google die Seite mit iFrame sieht.

Sicherheit bei iFrames

Wer fremde Inhalte einbettet oder das Einbetten der eigenen Seite kontrollieren will, sollte die Sicherheitsmechanismen kennen. Das sandbox-Attribut schränkt die Berechtigungen des eingebetteten Inhalts ein und blockiert standardmäßig etwa Skripte, Formulare und Pop-ups; einzelne Rechte gibt man gezielt frei:

<iframe src="https://externe-seite.example"
        sandbox="allow-scripts"
        title="Eingebetteter Inhalt"
        loading="lazy">
</iframe>

Um zu verhindern, dass die eigene Seite ungewollt in einen fremden iFrame eingebettet wird – die Grundlage für Clickjacking –, dienen der HTTP-Header Content-Security-Policy mit der Direktive frame-ancestors sowie der ältere X-Frame-Options. Grundsätzlich gilt: nur vertrauenswürdige Quellen einbetten.

Moderne Alternativen

Die Aufgaben, die früher Frames erfüllten, übernehmen heute bessere Technologien:

• CSS Grid & Flexbox: für komplexe, responsive Layouts; mit position: sticky bleibt die Navigation beim Scrollen sichtbar.
• AJAX & SPAs: asynchrone Anfragen und Single-Page-Applications (React, Vue, Angular) laden Inhalte dynamisch ohne vollständigen Reload nach.
• Web Components: wiederverwendbare, isolierte Bausteine direkt im Browser.
• Serverseitig: CMS, Template-Engines (Twig, Blade) und Server Side Includes (SSI) sorgen für gemeinsame, einheitliche Elemente.

Ausblick

Eine Zeit lang galten Fenced Frames als möglicher Nachfolger für bestimmte Einbettungen: Google schlug sie im Rahmen der Privacy Sandbox für datenschutzfreundliche Werbung vor. Allerdings hat Google die Privacy Sandbox 2025 eingestellt und baut zugehörige Schnittstellen wie die Protected Audience API ab. Fenced Frames haben damit keine breite Zukunft als allgemeines Einbettungs-Tag.

Für die Praxis heißt das: iFrames bleiben der Standard, um externe Inhalte einzubetten – ergänzt um sandbox, allow und eine passende Content-Security-Policy. Für Layout und Komponenten setzt moderne Webentwicklung auf CSS Grid, Flexbox und Web Components.

Fazit

Frames haben die frühe Webentwicklung geprägt, sind aber durch bessere Technologien ersetzt worden. Klassische frameset/frame-Konstruktionen sind obsolet und sollten nicht mehr eingesetzt werden – sie schaden SEO, Barrierefreiheit und mobiler Nutzung. Der iFrame dagegen hat seinen festen Platz: Er bettet externe Medien und Dienste ein, sollte aber sparsam, mit aussagekräftigem Titel, verzögertem Laden und sauberer Absicherung verwendet werden.

Wer Inhalte oder Layouts gestaltet, setzt heute auf CSS Grid und Flexbox, ergänzt um Web Components und – wo es um Einbettung geht – um sichere iFrames mit sandbox und Content-Security-Policy. Das ergibt responsive, barrierefreie und zukunftssichere Websites.

Häufige Fragen zu Frames und iFrames