Html-Tags

Framesets - Anzeigen mehrerer Webseiten in einem Rahmen

Auf Framesets sollten Sie, genau wie auf Tabellen, in der Zukunft besser verzichten, da sie alles andere als barrierefrei sind. Mit vielen Tricks und Kniffen lassen sich die Nachteile gegenüber einer herkömmlichen Website zwar beseitigen und eine bereits bestehende Website optimieren aber eine neue Website mit Frames anzulegen können wir nicht empfehlen.

Wie funktionieren Framesets, Frames und iframes?

Ein Frameset ist nur das Gerüst einer Website und zum Aufrufen von Frames (html-Seiten) in dieses Gerüst vorhanden. In einer Ausgangsdatei wird das Frameset angelegt. Schauen Sie sich diese Datei mit einem Textbrowser an, wird Ihnen eine leere Webseite präsentiert. Trotzdem ist diese Datei für die Funktion einer solchen Website sehr wichtig. Hier wird die Aufteilung der einzelnen Frames geregelt und festgelegt, an welcher Position mit welchen Maßen die einzelnen Frames im Browser angezeigt werden. Basiert die komplette Website auf einem Frameset, so ist dieses immer im Browser geladen. Nur die einzelnen Frames, die die unterschiedlichen Inhalte enthalten werden ausgetauscht. Es kann auch sein, dass einzelne Frames immer geladen sind. Ein Beispiel dafür ist der Navigationsframe, wenn er für alle darzustellenden Inhalte identisch ist oder auch der Frame im Kopfbereich, der meist den Banner trägt.

Iframes laden ebenfalls verschiedene Inhalte (Frames) einer zweite Webseite in den Browser. Die Webseite, die den iframe enthält kann aber eine ganz normale Webseite mit weiteren Inhalten im Body sein. Diese Technik wird nicht von allen Browsern angezeigt. Vorallem der Natscape 4.x ignoriert sie komplett. Diese Tatsache ist bereits ein Ausschlußkriterium, diese Technik anzuwenden ohne Alternativen für Browser vorzusehen, die den Inhalt des iframes nicht anzeigen.

Html-Quelltext Bedeutung und Darstellung in der Website
Ein Frameset hat keinen body. Größenangaben der einzelnen Framebereiche sind mit *=Wildcard möglich, so dass sich die Website an das Browserfenster optimal anpassen und der Hauptinhalt mittig im Browserfenster angeordnet werden kann. Dies ist einer der Vorteile von Framesets gegenüber normalen Websites. Wenn sich eine Website auch gut ohne Frameset darstellen läßt sollte darauf verzichtet werden, da es auch eine Reihe von Nachteilen dieser Webdesign-Technik gibt.
<frameset cols="60%,40%" >
<frame src="framelinks.html" name="links" >
<frame src="framerechts.html" name="rechts" >
<frameset >
Frameset mit einem rechten und einem linken Frame. Der linke Frame nimmt 60% des Browserfensters ein, der rechte Frame die restlichen 40%.
<frameset rows="20%,200,*" >
<frame src="frameoben.html" name="oben" >
<frame src="framemitte.html" name="mitte" >
<frame src="frameunten.html" name="unten" >
<frameset >
Frameset mit oberem, mittlerem und unterem Frame. Der Frame oben füllt 20% der Höhe des Browserfensters aus. Der mittlere Frame belegt 200 Pixel und der untere Frame den ganzen verbleibenden Rest.
Name im Frameset und target in den Links der frames müssen die gleiche Bezeichnung erhalten, damit die zu ladenden Seiten an die richtige Position im Frameset geladen werden.
Wenn mit Frames gearbeitet wird, ist das Frameset im einfachsten Fall die indexseite, denn das Frameset lädt die Einzelseiten.
Sie sollten kein body-tag im Frameset verwenden, sonst werden Seiten evtl. leer angezeigt.
marginwidth="0" marginheight="0" in den frame-container schreiben um den kompletten frame anzuzeigen
<noframes >
<body >
Beschreiben Sie hier den Inhalt Ihrer Website und verlinken Sie die wichtigsten Unterseiten
</body >
</noframes >
Hier kann eine Beschreibung der Webseite für Suchmaschinen und Browser bereitgestellt werden, die keine Frames darstellen können. Wenig hilfreich ist es dem Besucher mitzuteilen, dass sein Browser keine Frames darstellen kann ohne eine Alternative zu bieten. Im noframe-Bereich können sie den body-tag verwenden.

Das steht im Frameset
<frame src="navi.htm" name="navigation" >

Das steht in der Datei navi.htm
<a href="dateiname.htm" target="inhalt">Thema 1</a>
<a href="dateiname2.htm" target="inhalt">Thema 2</a>

Die navi.htm ist hier die Navigationsseite und wurde mit Namen navigation im Frameset definiert. In diese werden die Links zu den Unterseiten eingetragen
verschachtelte Frames
Beispiel: ziel.htm
<frameset cols="180,*" >
  <frame src="nav4.htm" name="navi" scrolling="no" >
   <frameset rows="90,*,20%" >
    <frame src="oben.htm" scrolling="no" name="oben" >
    <frame src="black.htm" scrolling="yes" name="mitte" >
    <frame src="unten.htm" scrolling="no" name="unten" >
    <noframes >
      <body >
      Website-Inhalt und Links
     </body >
    </noframes >
   </frameset >
</frameset >

Beispiel: ziel.htm

Frameset mit Frames in 2 Spalten
Der rechte Frame enthält ein Frameset mit 3 Reihen
Der linke Frame ist der Navigationsframe mit einer Breite von 180 Pixeln. Er erhält keinen Scrollbalken.
Von den drei horizontalen Frames in der rechten Spalte, die die restliche variable Breite des Browserfensters belegt, erhält nur der mittlere Frame, der wahrscheinlich den Inhalt aufnehmen wird und somit viel Text enthalten kann, einen Scrollbalken.
Die vertikale Aufteilung des rechten Frames beträgt für den oberen Frame 90 Pixel, für den unteren Frame 20% des Browserfensters und der mittlere Frame erhält wieder den restlichen zur Verfügung stehenden Platz des Browserfensters.

target - Anweisungen im Link zum Laden der aufgerufenen Website im Browser

Ohne eine Angabe für target in den Links der Frameseiten werden die aufgerufenen Webseiten in den selben Frame geladen von wo der Aufruf kam. Das kann leicht zu rechtlichen Problemen führen, wenn Sie fremde Webseiten in Ihr Frameset laden, auch wenn dies unbeabsichtigt geschieht.

Für die nächsten 5 Beispiele jeweils die ziel.htm laden und in dieser Datei testen. Sie entspricht dem Beispiel über dieser Tabellenzeile nur das erste frameset hat im Unterschied zum Beispiel einen rechten Frame mit 80% und einen Navigationsframe mit * also die verbleibenden 20%. Eine prozentuale Angabe für den Navigationsframe ist ungüstig. Aber beurteilen Sie dies anhand des Beispieles bitte selbst.
<a href="ziel.htm" target="_top" > ziel.htm </a > ziel.htm Webseite wird im Originalfenster geladen. Dies empfiehlt sich zum Aufruf des Framesets von den Frameseiten aus.
<a href="ziel.htm" target="_self" > ziel.htm </a > ziel.htm Webseite wird im selben Frame geladen, von wo der Aufruf kam
<a href="ziel.htm" target="_blank" > ziel.htm </a > ziel.htm Hier wird die ziel.htm in neuem Fenster geladen. Diese Angabe empfiehlt sich, wenn Sie auf externe Linkziele verweisen und möchten, dass der Besucher Ihre Website noch auf dem Bildschirm geöffnet behält um so ggf. leichter auf Ihre Website zurückzufindet. Es sind dann mindestens zwei Browserfenster geöffnet.
<a href="ziel.htm" target="_parent" > ziel.htm </a > ziel.htm Webseite wird im gleichen Fenster im ganzen Fenster geladen
<a href="ziel.htm" target="unten" > ziel.htm </a > ziel.htm Webseite wird in den, im Frameset in der Frameangabe, mit unten benannten Frame geladen
Inlineframes - Laden von Webseiten in normale framelose html-Seiten
< iframe width="320" height="240" name="inline" src="iframe.htm" hspace="40" vspace="20" scrolling="yes" >
</iframe >



Geben Sie an, dass Scrollbalken erscheinen sollen, wird die Leiste ohne Scrollbalken angezeigt, auch wenn der Inhalt in die festgelegte Fenstergröße paßt. Mit hspace kann in manchen Browsern die horizontale Postitionierung vorgenommen werden mit vspace die vertikale. Besser wird dies allerdings mit css geregelt, da hspace und vspace nicht zum html-Standard gehören.
< iframe width="320" height="240" name="inline" src="iframe-2.htm" hspace="40" vspace="20" >
</iframe >



Machen sie keine Angaben zu den Scrollbalken, werden sie in vielen Browsern nur angezeigt, wenn der Text nicht in die Größe des definierten Fensters paßt. Der Internetexplorer zeigt dann auch keine Border an, Firefox und Opera zeigen die Border an, wenn sie nicht separat ausgeschaltet werden.
< iframe width="320" height="240" name="inline" src="iframe-2.htm" hspace="40" vspace="20" scrolling="no" frameborder="0">
</iframe >



Legen Sie mit scrolling="no" fest, dass keine Scrollbalken angezeigt werden sollen, werden in den meisten Browsern auch keine angezeigt, auch wenn der Inhalt keinen Platz im zugewiesen Fenster hat.
Die flexibelste Variante ist also nichts für scrolling anzugeben, dann werden die Scrollbalken nur bei Bedarf angezeigt.

iframe=Inlineframe

Angabe von scrolling="yes"


Keine Angabe zu scrolling


Angabe von scrolling="no"


funktioniert auch außerhalb von Tabellen
target="_float" Ein target sollte wie in die Links der normalen Framesseiten auch in die Links der in die iframes geladenen Seiten eingefügt werden um diese in neuem Fenster öffnen zu lassen - inlineframes werden von Netscape4.7 nicht gelesen
<title > base target </title >
<base target="mitte" > für Navigationsleiste <frameset cols="30%, *" border="0" frameborder="0" framespacing="0" >
<frame src="dateiname" name="links" scrolling="no" noresize >
<frame src="dateiname" name="rechts" scrolling="no" noresize >
</frameset >
Ohne sichtbare Frameborder und Scrollbars. Der Besucher kann die Frames nicht verschieben.