|
Jeder Surfer kennt heute Frames (dt. Gefüge, Gerüst und Rahmen) ohne unbedingt ihren Namen zu wissen. Sie unterteilen das Browserfenster in unterschiedlich zu handhabende Fenster. Man kann z. B. einen Teil des Bildschirms für die Navigation oder auch für Werbeeinblendungen reservieren, den anderen Teil für die wechselnden Text- oder Grafikangebote. Häufig wird auf diese Weise eine "Navigationsleiste" angeboten, die meist links oder oben angeordnet ist.
Frames sind von Netscape eingeführt worden und konnten früher von vielen Browsern nicht dargestellt werden. Heute sind sie aber in professionellen Präsentationen Standard und man kann sie hemmungslos einsetzen, wenn man kann.
Frames sind nicht immer auf den ersten Blick zu erkennen. Sie können mit oder ohne Begrenzung gestaltet werden. Wenn einheitliche Hintergründe benutzt werden, was sich aus gestalterischen Gründen empfiehlt, bemerkt
man erst beim Scrollen, ob Frames vorliegen, wenn nämlich
Teile des Browserfenster stehen bleiben, während andere
verschoben werden.
Wenn Sie diese Seite begucken, sieht sie etwas anders aus,
als die anderen Kursseiten. Richtig, wir sind ja gerade
bei Frames. Das Festhalten meiner Überschrift ist platzraubend,
also dumm, es wäre sinnvoller, wenn dort Dinge zur
Programmstruktur stünden. Aber um Sinn geht es hier
nicht, es geht um Technik. (Der Satz ist tiefsinniger als
ich ihn hier meine!)
Zur Anlage von Frames dient das Tag <frameset>...</frameset>,
zur Konfigurierung das Tag <frame>.
Wenn Sie mit dieser Seite etwas experimentieren, also z.
B. die Größe des Browserfensters verändern,
werden Sie bemerken, daß Frames nicht ohne Probleme
sind. Sie überstehen nicht alle Bildgrößenänderungen
schadlos und sprengen in sofern die Philosophie der Seitenbeschreibungssprache
HTML, die unter allen Umständen gute Ergebnisse liefern
soll.
Es ist zuerst eine Steuerungsseite nötig, auf
der die Framestruktur festgelegt wird. Diese Seite wird
später auch aufgerufen, wenn man das ganze Kunstwerk
sehen will. Die Steuerungsseite ruft nämlich ihrerseits
die Fensterinhalte auf und füllt sich damit selbst.
Die Steuerungsseite bildet eine Ausnahme in HTML, denn sie
muß keinen body besitzen. Sie würde, wenn das
Laden der anzuzeigenden Dateien nicht klappt, leer erscheinen.
Man kann deshalb für den möglichen Fehlerfall
(daß nämlich ein bescheuerter Eigenbaubrowser
immer noch keine Frames erkennt),
<html>
<head>
<title>Frames
im Kurs</title>
</head>
<frameset rows = "20%,*,80" border="1"
framespacing="1">
<frame src="framob.htm"
name= "oben">
<frame src="framit.htm"
name= "mitte">
<frame src="framun.htm"
name= "unten" noresize>
<noframes>
<body>
Dieses
ist die Framset-Seite
</body>
</noframes>
</frameset>
</html>
Die entscheidende Zeile, die die Frames definiert, ist
<frameset rows = "20%,*,80" ..>. Was sagt
sie uns?
- Das Attribut "rows" setzt horizontal geteilte Fenster
in die Welt, vertikal geteilte würden mit "cols"
definiert. Beide Attribute können auch gemeinsam
auftreten. Die folgende Angabe bedeutet die Fenstergrößen
von oben nach unten, bei "cols" von links nach rechts.
Angaben sind wie immer in Pixeln oder % der Fenstergröße
möglich. Der Stern ist üblich und steht immer
für den Rest. Bei meiner speziellen Angabe ist dieser
Rest abhängig von der Größe des Browserfensters.
Lautete die Angabe aber "25%,50%,25%" lägen
die Proportionen ein für allemal fest.
- Das border-Attribut kann auf "0" gesetzt werden,
das bedeutet überraschenderweise eine unsichtbare
Grenze. Ich habe hier "1" gewählt, obwohl
das Ergebnis häßlich aussieht, damit Sie probieren
können, diese Grenze zu verschieben. Das Attribut
"noresize" in der dritten Frame-Klammer verhindert dies
zuverlässig für die untere Grenze.
- Die drei frame-Tags ordnen mit "src=..." die
zu ladenden Seiten zu und vergeben, ganz wichtig, Namen
für die drei Fenster. Die werden Sie (und ich natürlich)
noch brauchen.
- Diese Seite enthält keinen body, der
wird hier vom Frameset vertreten. Ein Eintrag im <noframes>-Bereich
wird vom Composer angezeigt und macht sich speziell in
der Bearbeitungsphase der Seite bezahlt. (Eigener Herd
ist Goldes wert! - paßt hier zwar nicht, will aber
das Richtige sagen: Erst wenn Sie selbst drauf gekommen
sind, werden Sie es mir glauben.) Übrigens werden
Frameset-Seiten von Suchmaschinen u.U. auf ihren
Inhalt hin untersucht. Deshalb ist es keine schlechte
Idee, im noframes-Bereich den Inhalt der Präsentation
kurz anzugeben.
Was in die Frames geladen wird, sind an sich ganz normale
HTML-Seiten. Aber nur an sich. Rufen Sie bitte im Browser
die Seiten "url/framob.htm", "url/framit.htm" und url/framun.htm"
auf (wie man das macht? Oben im Adressfenster steht die
vollständige URL der gerade beguckten Frame-Steuerungsseite.
Sie löschen bis zum Slash, also "frames.htm" und setzen
dafür die "framob.htm" etc. ein. Return schließt
die Sache ab.) nun besehen Sie den Quellcode. Es gibt hier
gleich mehrere Probleme zu lösen.
<base target="mitte">. Was will uns der Dichter
damit sagen? Wenn durch Mausklick auf einen beliebigen Link
eine neue Seite geladen wird, dann soll sie immer im Fenster
"mitte" angezeigt werden. Diesen Namen hatten wir in der
Steuerungsseite so festgelegt. Alternativ könnten auch
bei den einzelnen Links dieser Seite jeweils zu src="dateiname"
die Zielangabe target="mitte" bzw. target="unten" folgen.
Das ist hier ebenfalls geschehen, die Adressierung den
Kursnutzern zuliebe also doppelt gemoppelt. Wenn es unterschiedliche
Zielfenster für die Links gibt, dann geht nur die zweite
Art der Adressierung.
Wenn der spezielle Wunsch besteht, in beiden Fenstern, dem
Menüfenster (mein oberes "oben") und dem Datenfenster
(mein mittleres "mitte") die Inhalte gleichzeitig zu wechseln,
dann kann das Laden zweier Inhalte so erfolgen: <a
href="inhaltneu.htm" target="mitte" onclick="self.location='menüneu.htm'">.
Der <base target>-Eintrag müßte
in diesem Falle unterbleiben.
"framit.htm" enthält keine Veränderungen dieser
Art. Es ist eine ganz normale Textseite. Der Grund, sie
enthält keine Links auf den Index, auf eigene Textmarken
etc., weil diese Links in anderen Fenstern erscheinen werden.
Um die Gefahr, daß Frameseiten "sich aufwicklen"
bzw. daß für den ganzen Bildschirm bestimmte
Bilder in Frames geladen werden können, kann man sich
der Möglichkeiten von JavaScript bedienen und die gefährdeten
Seiten "impfen". Das habe ich hier mit der Index-Seite getan.
Der Code lautet:
<script language=JavaScript>
if (top.frames.length!=0)top.location=self.location;
</script>
und er muß im <head>-Teil der zu schützenden
Seite stehen.
Wenn eine Framestruktur sorgfältig gestaltet wurde,
übersteht sie u.U. nicht die Darstellung mit anderen
Bildschirm-Auflösungen. Manche Designer begrenzen deshalb
die Framestruktur von vornherein auf die mindestens 640*480
vorhandenen Pixel. Vergleichen Sie z.B. die Seiten des "Spiegel",
wo man sich auf eine Breite von 800 Pixeln beschränkt,
und den rechten Teil des Bildschirms bei höheren Auflösungen
ungenutzt läßt.
Eleganter ist es, wenn man sich beschränken
will, den Nutzbereich mittig zu stellen.
Wie macht man so etwas?
Man legt eine leere Seite, hier "fr1_leer.htm"
an, die später einen Rahmen abgeben soll. (Achtung
auf Hintergrundfarbe oder Muster!)
die Frameset-Zeilen werden, wie unten zu sehen, angelegt.
<frameset rows="*,480,*" frameborder=0, border=0>
<frame src="fr1_leer.htm" scrolling="no">
<frameset cols="*,640,*" frameborder=0,
border=0>
<frame src="fr1_leer.htm"
scrolling="no">
<frame src="fr1_inn.htm"
name="innen" scrolling="no">
<frame src="fr1_leer.htm"
scrolling="no">
</frameset>
<frame src="fr1_leer.htm" scrolling="no">
</frameset> |
zuerst drei Reihen definieren
obere Reihe wird Rand
zweite Reihe wird in drei Spalten geteilt
linker Rand
Inhalt der Seite
rechter Rand
fertig Spaltenteilung der mittleren Reihe
unterer Rand
fertig Reihenteilung |
|
|
|