hilfreiche-tools.de  ⇒ iframe

Ein Iframe ist ein Html Element. Es dient auf einer Webseite insbesondere dazu Inhalte anderer Dokumente bzw. Webseiten ein einem bestimmten Bereich darzustellen. Ein Iframe wird oftmals auch dazu verwendet Werbebanner auf einer Seite einzublenden.

Die Vorteile von einen Iframe sind, dass Sie Ladezeiten unabhängig sein. Die eigentliche Seite kann also parallel zum Iframe geladen werden. Sollte der Inhalt des Iframes nicht geladen werden, wird aber trotz allem die eigentlich Seite richtig anzeigt.

Der Nachteil ist, dass durch die Iframetechnik in der Browseradresszeile nur die Adress der umgebenen Seiten angezeit wird.

iframe

Was sind die Nachteile eines Iframes?

Wie bereits bei den Vorteilen eines Iframes angesprochen ist für den Besucher nicht erkennbar, auf welcher Seite er sich im Iframe bewegt. Dies kann zum Nachteil werden, wenn der Besucher die Seite als Lesezeichen abspeichern möchte. Ein weiterer Nachteil ist das Verschwimmen von Quellen und Herkünften. Dem Besucher der Webseite ist unter Umständen nicht klar, wann das eigentlich Webseiten-Angebot aufhört und welche Inhalte er tatsächlich dem eigentlichen Urheber zuordnen kann.

Was sind die Vorteile eines Iframes?

Ein Iframe soll möglichst unscheinbar aussehen und für den Besucher einer Webseite kaum erkennbar sein. Daher verzichtet der IFrame auf eine eigene Adress- oder Statuszeile. Dadurch erhält der Besucher der ursprünglichen Webseite keine Information darüber, zu welcher Seite der Inhalt des Iframes zeigt. Außerdem beeinflusst ein Iframe nicht die Ladezeiten der ursprünglichen Webseite. Die Webseite wird komplett beim Aufruf der URL geladen und dem Benutzer dargestellt. Sollte die Webseite, auf die im Iframe verwiesen wird, längere Ladezeit benötigen, so kann der Besucher bereit auf der ursprünglichen Webseite navigieren. Sollte der Inhalt des Iframes länger oder breiter als die Größe sein, die per HTML-Code definiert wurde, erscheinen Scroll-Balken. Diese lassen sich per HTML-Code auf Wunsch deaktivieren.

Welche unterschiedlichen Attribute gibt es bei einem Iframe?

Ein neuer Iframe wird durch das Einfügen des HTML-Tags "<iframe>" an gewünschter Stelle erzeugt. Innerhalb des HTML-Tags wird die Quelle mit "src=" definiert. Dies kann sowohl die URL einer externen Webseite, ein Dokument Ihrer Webseite oder eine lokale Datei sein. Es wird empfohlen, einen Namen für den Iframe mit "name=" anzulegen. Weiterhin ist die Breite mit "width=" und die Höhe mit "height=" des Iframes anzugeben. Hier sind sowohl Pixel-Angaben als einfache Zahl oder Prozentangaben in Relation zum Hauptfenster erlaubt. Mit dem Attribut "scrolling=" geben Sie an, ob Scroll-Balken erscheinen sollen, falls die Seite, auf die im Iframe-Element verwiesen wird, breiter oder höher ist als das Element. Die Attribute "marginheight=" und "marginwidth=" definieren die Größe des Rahmens um den Iframe, um Abstand zu anderen Elementen der Webseite halten zu können. Die Rahmenstärke des Iframes legen Sie mit "frameborder=" fest. Wenn Ihr Iframe-Element in einen Textabsatz eingebettet werden soll, sollten Sie mit dem Attribut "align=" angeben, ob der Iframe rechts oder links angeordnet sein soll. Es empfiehlt sich außerdem, innerhalb des Iframes einen Text zu hinterlegen. Dieser Text wird dann Besuchern angezeigt, die einen Browser verwenden, der keine Iframes darstellen kann.
Um Ihnen die Syntax klarer darzustellen, hier ein kleines Beispiel:

<iframe src="https://www.zieldesiframes.de/" name="Iframe_1" width="250" height="500" scrolling="no" marginheight="10" marginwidth="10" frameborder="0" align=right>Ihr Browser unterstützt leider keine Iframes</iframe>

Dieser HTML-Code erzeugt einen Iframe, der eine Breite von 250 Pixel und eine Höhe von 500 Pixel hat. Als Inhalt wird die Webseite "zieldesiframes.de" erscheinen (fiktiv). Scroll-Balken erhält der Iframe nicht, selbst wenn die adressierte Webseite höher oder breiter ist. Andere Inhalte halten zum Iframe einen Abstand rundum von 10 Pixel. Der Iframe erhält keinen Rahmen. Browser, die nicht in der Lage sind, diesen HTML-Code zu interpretieren, werden den hinterlegten Hinweis darstellen.

Zum Abschluss noch ein Hinweis, weshalb die Angabe eines Iframe-Namens durchaus sinnvoll sein kann: im HTML-Code werden Links zu internen oder externen Seiten mit dem HTML-Tag "<a>" erzeugt. Beispiel: der HTML-Code <a href="https://www.ziel.de/" target="_blank">Ziel 1</a> stellt dem Besucher einen Link mit der Bezeichnung "Ziel 1" dar. Klickt der Besucher auf diesen Link, öffnet das Ziel "www.ziel.de" in einer neuen Seite oder einem neuen Tab. Dies wird durch das Attribut "target="_blank"" definiert. Wenn Sie nun anstatt "_blank" an diese Stelle den Namen Ihres Iframe-Objektes "Iframe_1" einsetzen, dann öffnet sich das angegebene Ziel genau in dem Iframe, dessen Namen Sie angegeben haben. Probieren Sie es einfach mal aus!

Wozu werden Iframes genutzt?

Die Nutzung von Iframes kann sehr umfangreich sein. Viele Webseitenbetreiber nutzen die Technik dazu, um innerhalb ihrer Webseite andere Inhalte einzubetten, z.B. Hinweisfenster, Bildergalerien oder einen Musikplayer. Weiterhin besteht die Möglichkeit, als Inhalt eines Iframes eine externe Webseite zu adressieren, z.B. eine Nachrichten-Seite oder eine Suchmaschine. Im Zeitalter der sozialen Netzwerke kann ein Iframe auch dazu dienen, ein Profil eines sozialen Netzwerkes auf der Webseite darzustellen, ohne direkt auf die Seite des Netzwerkes verweisen zu müssen.


Was ist der iframe?

Iframe wird das klassische Gestaltungselement genannt, welches innerhalb einer Seitenbeschreibungssprache dem sogenannten HTML (Hypertext Markup Language), zum Aufbau einer Webseite und deren Inhalte genutzt wird. Webseiten werden heute immer auf drei Sprachen (Syntax genannt) aufgebaut. Das HTML legt durch seine Elemente eine logische Struktur einer Webseite fest und bestimmt somit was eine Fußzeile, eine Überschrift oder auch eine Abbildung ist und in welchen Zusammenhang die anderen Elemente auf dieser Seite bestehen. Zur Gestaltung der Seite wird überwiegend die Stylsheet Sprache CSS (Cascading Style Sheets) verwendet, was sich zum Beispiel in der Hintergrundfarbe darstellt, aber auch in der Schriftgröße und auch eine genaue Positionierung der einzelnen Elemente wie einem Button. Das Frame HTML Text ist dafür verantwortlich das auf der Webseite Platz geschaffen werden kann. Dies wird durch einen Mausklick ausgelöst oder auch eine andere Aktion, damit ein neuer Inhalt oder auch eine neue Webseite angezeigt wird. Die anderen Bestandteile werden aber nicht durch diese Aktion verändert. Ein iframe kann also ein Browserfenster in einem anderen Browserfenster öffnen. Es ist auch möglich, mit Allow HTML Temp eine Schaltfläche bereit zu stellen, die einmalig auf HTML-Ansicht umschaltet.

Wozu braucht man iframes?

Der iframe befindet ausschließlich in dem Body vom HTML Dokument und der Webdesigner kann somit die Größe und auch die Position selber bestimmen. Es zeigt sich aber, dass das iframe immer mehr an Bedeutung verliert, da die Gestaltung der Webseiten überwiegend mit CSS vorgenommen wird. Mit CSS kann ein Attribut an den unterschiedlichsten Positionen auf der Webseite dargestellt werden und die Inhalte von anderen Webseiten aufnehmen. Ist es aber so, dass dennoch ein HTML Dokument in die Webseite eingebaut wird, sind mit CSS die Bildlaufleisten, die Hintergrundfarbe und auch die Position beliebig zu erstellen. Der HTML iframe ist dafür zuständig innerhalb von Body ein inline Fenster in ein anderes Dokument einzufügen. Der Browser rendert so eine weitere Datei innerhalb einer Webseite. Der Frame zeigt unterschiedliche Inhalte wie beispielsweise Bilder, Multimedia, Formulare und Tabellen und div mehr. Der Inhalt eines Frame Fensters ist in der Lage unabhängig vom HTML Dokument formatiert zu werden. Außerdem kann das Original Dokument bereits angezeigt werden während sich das iframe noch auflädt.

iFrames bieten Sicherheit

Darum werden in den iframes auch gerne Werbungen dargestellt. Sie greifen nicht in das eingebettete Layout der Seite ein sondern sie bringen ihre eigenen Skripte mit die aber nicht auf die Seite zugreifen können in die sie integriert sind. Für die Seiten und die unterschiedlichen Inhalte anderer Seiten die eingebettet sind bietet das Frame ein optimales Maß an Sicherheit. Da die Inhalte eingekapselt sind wie in der Sandbox bleibt der fremde Inhalt immer von der eigenen Seite getrennt. Zwischen dem schließenden und öffnenden Tag kann sich eine Textarea befinden, ein URL oder auch Bilder. Die Inhalte aber werden nur von den Browsern dargestellt, welche den iFrame Tag nicht erkennen.

Wer braucht iFrames?

iframes werden von jeder Branche und jede Webseiten Erstellung benötigt, genauso wie das output welches die elektronisch erzeugten Informationen in für Menschen lesbare Formen umwandelt. Es wird von der Verwendung des Frames vom Standardisierungsgremium W3C nicht abgeraten, was aber daran liegt, das die Einstellungen der Browser die auf den vielen Computern die von den Nutzern verwendet werden sehr unterschiedlich sind. Wenn zu Beispiel das CSS ausgeschaltet wird dann kann das CSS Stylesheet in der Regel nicht mehr vollständig angezeigt werden. Dieses Problem besteht aber bei der Verwendung eines Frame als HTML Element nicht. Es muss sich ein Webdesigner aber grundsätzlich im Klaren darüber sein, wenn er Content in seinen Frames präsentiert, das die Suchmaschinen beim Durchsuchen der Webseite nicht unbedingt den Inhalt der Frames oder auch den Inhalt der anderen Seiten in der Data speichert. Bei der Suchmaschinenoptimierung (SEO) sollte die Anwendung der Frames und der Elemente mit großer Vorsicht vorgenommen werden.
Wir nutzen Google Produkte die Cookies setzen, mit der Nutzung der Seite stimmen Sie zu. mehr Infos