Freibadstraße 30, München, Deutschland
(+49) 0176 80220822
info@khoa-nguyen.de

iFrame (Inlineframe) erklärt

Ein häufig genutztes Verfahren zur Erweiterung von Webseiteninhalten besteht darin, Teilelemente von anderen Webseiten zu integrieren. Diese Integration erfolgt durch die Verwendung von sogenannten Inlineframes. In diesem Glossarartikel erfährt Ihr mehr über die Funktionsweise, den Aufbau sowie den Nutzen von iFrames. Außerdem werden mögliche Herausforderungen erläutert, die mit der Verwendung einhergehen können.

Was sind iFrames?

Darunter wird ein Element bezeichnet, das es ermöglicht, externe Inhalte oder Dokumente innerhalb einer Webseite einzubetten. Durch die Einbettung können Inhalte von Drittanbietern wie beispielsweise YouTube-Videos oder Google Maps-Features nahtlos in den eigenen Content integriert werden. Dies führt dazu, dass der Nutzer auf der Webseite verbleibt und die Inhalte qualitativ hochwertiger und umfassender dargestellt werden. Inlineframes werden daher oft genutzt, um die Nutzererfahrung zu verbessern und den Inhalt der Webseite zu erweitern.

Aufbau von iFrames

iFrames sind ein nützliches Element zur Integration von Inhalten von Drittanbietern in eine Webseite. Die Syntax wird durch das <iframe>-Tag definiert und es können verschiedene Eigenschaften wie Größe, Quell-URL oder Rahmenstil festgelegt werden.

Simples Beispiel YouTube Video Einbindung:

Ist ein Video auf YouTube hochgeladen, kann mit dem Video auf verschiedene Wege geteilt werden. Beim Klick auf die Funktion „Einbetten“ kann das Script rauskopiert und an geeigneter Stelle auf der Webseite eingebunden.

iFrames werden von den meisten modernen Webbrowsern unterstützt, jedoch gibt es Unterschiede in der Art und Weise, wie sie gerendert werden. Es ist wichtig, dass Webentwickler bei der Verwendung von iFrames darauf achten, dass diese in verschiedenen Webbrowsern und auf verschiedenen Geräten korrekt dargestellt werden.

iFrames Attribute – diese solltet ihr kennen

iFrames haben verschiedene Attribute, die für die Darstellung relevant sind. Hier ist eine Auswahl davon im Detail:

  • src: Dieses Attribut gibt die URL des Dokuments oder der Webseite an, die im IFrame angezeigt werden soll. Ohne eine URL funktioniert das IFrame nicht.
  • width und height: Diese Attribute bestimmen die Breite und Höhe. Sie können in Pixeln, Prozent oder anderen Einheiten angegeben werden.
  • frameborder: Dieses Attribut gibt an, ob ein Rahmen angezeigt werden soll oder nicht. Es kann den Wert „0“ haben, um den Rahmen zu entfernen, oder „1“, um den Rahmen anzuzeigen.
  • scrolling: Dieses Attribut gibt an, ob das Scrollen innerhalb des IFrame erlaubt ist oder nicht. Es kann den Wert „yes“ oder „no“ haben.
  • sandbox: Dieses Attribut gibt an, welche Funktionen deaktiviert werden sollen, um die Sicherheit zu erhöhen. Zum Beispiel kann es das Laden von JavaScript oder das Anzeigen von Pop-ups blockieren.
  • allowfullscreen: Dieses Attribut gibt an, ob das IFrame im Vollbildmodus angezeigt werden darf oder nicht. Es kann den Wert „true“ oder „false“ haben.

Vorteile und Bedeutung in SEO

Um den eigenen Content aufzuwerten und zu ergänzen, bieten iFrames zahlreiche Vorteile. Egal ob es sich um ein Video, einen Kalkulator oder Google Rezensionen handelt, die Integration ist schnell und einfach möglich und erfordert keine zusätzlichen Aktionen seitens des Nutzers oder Webadministrators.

Ein weiterer Vorteil besteht darin, dass die Skripte in der Lage sind, Daten zwischen dem iFrame und der Hauptseite auszutauschen. Dadurch können Informationen, die der Nutzer auf der Hauptseite eingibt, direkt an das iFrame weitergegeben werden und ermöglichen somit eine dynamische Aktualisierung des Inhalts des eingebetteten Inhalts. Das alles erfolgt ohne zusätzliche Programmierkenntnisse oder IT-Knowhow.

Herausforderungen von IFrames in der Suchmaschinenoptimierung

Wenn eingebettete Inhalte auf einer Webseite verwendet werden, können sie einige Herausforderungen mit sich bringen. Eines dieser Probleme betrifft die Suchmaschinenoptimierung, da Suchmaschinen möglicherweise Schwierigkeiten haben, den Inhalt innerhalb des Inlineframes zu indexieren und zu erkennen. Generell erkennt Google sie als Teil einer Webseite an.

Die Inhalte an sich werden allerdings nicht automatisch als Teil der Webseiteninhalte angesehen und müssten zusätzlich durch Anreicherung von Informationen wie etwa durch Meta Tags oder strukturiere Daten für den Google Bot ergänzt werden, um suchmaschinenrelevante Inhalte auszuspielen.  

Ein weiteres Problem mit Inlineframes ist, dass sie ein potenzielles Sicherheitsrisiko darstellen können. Da sie es Drittanbietern ermöglichen, Inhalte auf einer Webseite zu platzieren, können diese Inhalte möglicherweise schädlich sein und Malware oder Viren enthalten. Externe Seiteninhalte können im Zeitverlauf gelöscht werden oder im schlimmsten Fall mit Malware versehen sein, was negative Auswirkungen auf das Ranking und das Vertrauen der Suchmaschinen zur Folge hat.

Tipps für die Optimierung

Bei der Verwendung gibt es bewährte Praktiken, die beachtet werden sollten, um die Sicherheit der Webseite zu gewährleisten.

  • Die Nutzung von eingebetteten externen Inhalten sollte nur verwendet werden, wenn es keine alternativen Optionen gibt, um externe Inhalte einzubauen. Eine globale Einbettung, (vgl. exakt gleichen iFrame im Footer) sollte vermieden werden.
  • Darüber hinaus sollten sie nur von vertrauenswürdigen Portalen herangezogen werden, um Sicherheitsrisiken zu minimieren
  • Die Inhalte sollten immer mit einem angemessenen Sicherheitsprotokoll wie HTTPS eingebettet werden, um die Übertragung von sensiblen Daten zu schützen.
  • Es ist wichtig, iFrames mit einer Sandbox-Attribute auszustatten, um zu verhindern, dass schädliche Skripte auf die Hauptseite zugreifen können.

Weitere Quellen:

https://de.wikipedia.org/wiki/Inlineframe

https://dewiki.de/Lexikon/Inlineframe