Back to the very first page/zurück zur allerersten Seite

Frames


Startseite
Homepage-Bastler
Grundlagen HTML Grafiken einfügen Tabellen Linksammlung
Javaspielereien I Javaspielereien II schwebende
Navigationsleiste
Frames Formulare
Beispielseite I Beispielseite II Beispielseite III Beispielseite IV Frame Beispielseite
Hintergründe Buttons Cliparts    

Frames sind mehrere kleine Fenster in einem großen Browserfenster, wobei jedes Fenster einen eigenen Scrollbalken haben kann. Wie in der Abbildung zu sehen ist, kann die Größe der einzelnen Fenster sehr verschieden sein. In diesem Beispiel befindet sich oben ein Fenster über die ganze Breite des Monitors, aber nur etwa 1/5 der Monitorhöhe. Darunter befinden sich zwei weitere Fenster. Das linke Fenster (= der linke Frame)dient dabei der Navigation. Wenn man auf einen Link klicken würde, würde sich der Inhalt im rechten Frame verändern.

Typischer Frame..Es gibt Gründe für und gegen Frames. Dafür spricht eine schnellere Ladezeit, da die Navigationsleiste und im obigen Fall auch der obere Frame mit dem Logo immer gleich bleiben und nicht neu geladen werden müssen. Ein Beispiel für einen Frame finden Sie auch auf meinen Seiten unter Alles in Frames.

Der Nachteil dieser Art Internetseiten ist, dass Besucher immer auf der Startseite landen, egal welchen Bookmark /Favoriten sie sich anlegen. Bei einem Internetprojekt von nur wenigen Seiten schadet dies ja nicht. Aber bei sehr vielen Seite ist es für Besucher ärgerlich, wenn sie den gewünschten Inhalt nur dann zu sehen bekommen, wenn sie sich außer der Internetadresse auch noch den passenden Link aus der Navigationsleiste gemerkt haben.

Ein weiterer Nachteil, der damit zusammenhängt, ist der Name des Bookmarks/des Favoriten. Er lautet immer so, wie der Titel der ersten Startseite ist. Bei mir wäre dies Christine's Homepage. Und keiner würde darauf kommen, dass ich Bauchtanz, Stepptanz, Homepagebastler-Tipps und noch vieles mehr anbiete.

Noch ein Nachteil ist, dass auch fremde Links im eigenen Frame angebildet werden können, wenn man vergisst, dafür ein neues Zielfenster zu programmieren. Im schlimmsten Fall hat auch die neue Seite einen Frame mit Navigationsleiste links und schon sieht man auf dem eigenen Bildschirm zwei Navigationsleisten nebeneinander und es bleibt nur noch ganz wenig Platz für den eigentlichen Inhalt der fremden Seite.

Trotzdem können Frames in bestimmten Fällen sinnvoll sein, besonders dann, wenn es zwingend erforderlich ist, dass Besucher immer auf der ersten Seite landen, z. B. wenn man einen Shop hat (sie funktionieren oft nur, wenn man von vorne beginnt), oder wenn man Besucher erst eine bestimmte Mitteilung geben muss, bevor sie sich die Seiten angucken können, wie z. B. die Warnhinweise für Minderjährige bei Erotikseiten.

Man kann beliebig viele Frames auf einer Seite unterbringen. Dabei sollte man bei der Anzahl und der Aufteilung der einzelnen Frames jedoch auch in Betracht ziehen, dass nicht jeder Surfer einen Riesenbildschirm hat. Je kleiner der Bildschirm, desto länger werden die Scrollbalken.

Um eine Internetseite mit Frames zu gestalten (z. B. wie sie in obiger Abbildung zu sehen ist), benötigt man vier Dateien, für jeden Frame eine plus der Datei für die Aufteilung und die Maße der einzelnen Frames.

Beginne am Besten mit der Aufteilungsdatei, die ich hier mal frame1.htm nenne. Diese Datei enthält nicht mehr als folgenden Inhalt und zwar eingefügt vor dem Head Ende:


<frameset rows="120,*" border="0" frameborder="0" framespacing="0">
<frame src="topfenster.htm" name="oben" frame="noresize" scrolling="auto">
<frameset cols="30%,70%" border="0" frameborder="0" framespacing="0">
<frame src="navigation.htm" name="links" frame="noresize" scrolling="auto">
<frame src="hauptfenster.htm" name="rechts" frame="noresize" scrolling="auto">
</frameset>
</frameset>
<noframes>
Ihr Browser unterstützt keine Frames! Um die Seiten ohen Frames zu betrachten, klicken Sie hier (etsprechenden Link der Sitemap o. ä. einfügen)
</noframes>
... </head>
<body> ...

Dies hat folgende Bedeutung:
  • frameset gibt an, dass jetzt Frames kommen, die inzwischen jeder Browser darstellen kann
  • rows="120,*" gibt an, dass jetzt erst einmal zwei Frames übereinander aufgebaut werden, ein Frame oben und ein Frame unten. Der obere Frame ist 120 Pixel groß. Der untere Frame nimmt den restlichen Platz auf dem Bildschirm ein.
  • Der folgende Befehl, direkt unterhalb des ersten Framesets lautet
    frame src="topfenster.htm" name="oben" und gibt an, dass im oberen Frame ein Fenster mit dem Inhalt der Datei topfenster.htm angezeigt werden soll. Der obere Frame heisst "oben".
  • Nun folgt eigentlich der zweite Frame, der unterhalb des ersten sein sollte. Wir wollen im unteren Teil der Seite aber nicht nur einen Frame, sondern zwei haben. Deswegen müssen wir in die untere Hälfte nochmals ein Frameset eingeben.
    Diesmal lautet es frameset cols="30%,70%", was bedeutet, dass dieser untere Teil des Bildschirms mit zwei Frames nebeneinander erstellt werden soll. Der linke Frame soll 30% des Monitors einnehmen. Der rechte Frame misst 70%.
  • Nun folgen die Namen der beiden Frames und was darin dargestellt werden soll. Im linken Frame, der "links" heisst, soll die Datei navigation.htm dargestellt werden, im rechten Frame, der "rechts" heisst, soll der Inhalt der Datei hauptfenster.htm gezeigt werden.
  • Im Frameset-Tag stehen noch weitere Befehle. Und zwar, dass der Abstand zwischen den einzelnen Frames 0 betragen soll und dass die Frames keinen Rahmen haben sollen
  • Im Frame selbst steht dann noch, dass der Besucher die Größe der einzelnen Frames nicht mit der Maus verschieben kann und dass automatisch ein Scrollbalken angezeigt wird, wenn der Inhalt der Datei nicht vollständig auf dem Monitor zu sehen ist (ganz wichtig, wenn jemand einen kleinen Monitor hat!)
Nun müssen Sie drei weitere Dateien erstellen. Am Besten als erstes die Datei oben.html. In dieser Datei könnten Sie z. B. ein Logo reinstellen oder einfach den Titel Ihrer Internetseiten in schön großer Schrift. So könnte es aussehen:
... </head>
<body> ...
<h1>Mustername's Internetseiten</h1>
</body> ...

Als nächstes folgt der Inhalt der ersten Seite. Der Dateiname lautet hauptfenster.htm. Dort könnte z. B. ein Herzliches Willkommen stehen. So könnte es aussehen:
... </head>
<body> ...
<h1>Herzlich Willkommen<br> zu den Seiten über Wale</h1>
</body> ...

Zum Schluss folgt die Navigationsleiste. Diese Datei heisst navigation.htm. Dort sind alle Links zu allen Seiten aufgelistet. Bitte beachte, dass zu jedem Link angegeben werden muss, wo sich die neue Seite öffnen soll. In unserem Fall ist dies das rechte untere Fenster, dass den Namen "rechts" hat. Im HTML-Code ausgedrückt, lautet der Befehl target="rechts". Nur bei der Startseite gebe besser den Befehl target="_parent" ein, so dass die momentane Seite gelöscht und sich die Startseite samt Frame erst dann im gleichen Browserfenster öffnet. So könnte es aussehen:
... </head>
<body> ...
<a href="frame1.htm" target="_parent">Startseite</a><br>
<a href="wale1.htm" target="rechts">Zu den Walen</a><br>
<a href="haie1.htm" target="rechts">Zu den Haien</a><br>
</body> ...

Das Ganze klingt etwas kompliziert, hat aber den Vorteil, dass man die Navigationsleiste und das Frameset sowie den oberen Teil nur ein einziges Mal programmiert. Alle Seiten, die dann im Hauptteil der Seite (rechts unten) erscheinen sollen, enthalten reinen Text mit Bildern, ähnlich der Seite hauptfenster.htm. Bitte hier klicken um obige Programmierungen "in echt" anzusehen.

Um ein Gefühl für die Eigenschaften der Frames zu bekommen, sollten Sie einfach mal ein paar Frames gestalten und dabei ein wenig mit den Breiten und Höhen spielen. Dann erklärt sich das Ganze von selbst. Sehr hilfreich dabei ist auch das Nachschlagewerk von Stefan Münz.

Zurück zur ersten Seite Zurück zum Inhaltsverzeichnis Zum Übersichtsplan/to Sitemap