HrblSoft_logo
Werbung MoneyBanner.de


 Themen

 News und Upload Info
 HTML Tipps und Tricks
 Javascript Tricks
 DHTML und Styles
 Html und JScript Links
 Allgemeine Grafiktipps
 PP Tricks und Tutorials
 Links zum Thema Grafik
 Downloads und Tools

 Frameset

28.12.2000

Frames sind ein kontrovers diskutiertes Thema. Die meisten professionellen Sites setzen keine Frames ein, da Suchmaschinen diesbezüglich einige Probleme aufwerfen. Diese lassen Sich allerdings meist mit ein paar kleinen Tricks übergehen.

Grundsätzlich sind Frames ein schönes Designelement, da Sie Ihren Seiten mit einem Frameset eine feste Stuktur geben können und damit dem Besucher die Bedienung erleichtern. Ein schöner Nebeneffekt ist auch noch, dass Sie sich damit ein bisschen Arbeit sparen können, da Sie nicht mehr auf jede Seite ein Menu packen müssen. Praktischerweise lässt sich dadurch auch noch die Ladezeit der Seiten verkürzen.

Wie muss nun ein solcher Frameset aussehen. Folgendes Beispiel definiert einen einfachen Frameset aus zwei Spalten. Die erste Spalte besitzt eine Breite von 200 Pixeln, die zweite Spalte erstreckt sich über die restliche Fensterbreite. In jede Spalte wird ein Html Dokument geladen. An die zweite Spalte wird zusätzlich noch ein Name vergeben.

Suchmaschinen geben oft einige Zeilen des Seiteninhalts wieder. Es macht deshalb Sinn, auch bei Ihrem Frameset im Body der Seite eine kurze Inhaltsbeschreibung einzufügen. Für Besucher Ihrer Seite die einen alten, nicht frametauglichen Browser verwenden, sollten Sie hier einen Hinweis und evtl. einen Link auf eine framelose Variante Ihrer Seite hinterlassen.



<HTML><HEAD></HEAD>

<FRAMESET COLS="200,*" border=0">
<FRAME SRC="menu.html" scrolling=no>
<FRAME SRC="daten.html" name="daten">
</FRAMESET>

<BODY>

<NOFRAMES>
Fügen Sie hier eine kurze Beschreibung Ihrer Seite ein. Für Puristen und Suchmaschinen sollten Sie hier auch Links für alle Ihre Einzelseiten einbinden.
</NOFRAMES>

</BODY>

</HTML>


 Menuseite

Nun Erstellen Sie eine geeigneten Menuseite. Über die Gestaltung müssen Sie sich natürlich selbst Gedanken machen. Nur sollten Sie beachten, dass die Links in Ihrem Menu einen wichtigen Parameter aufweisen. Klickt ein Besucher auf einen Link, wird der Browser die Zielseite nämlich in das selbe Browserfenster laden indem sich auch das Dokument mit dem Link befunden hat. In diesem Fall würde Ihre Datenseite in unseren 200 Pixel Menuframe geladen und das Menu wäre verschwunden. Da wir das allerdings nicht wollen, müssen Sie bei jedem Link das Ziel für die neue Seite angeben. In unserem kleinen Beispiel wäre das der Frame "daten".



<A HREF="seite1.html" target="daten">Seite 1</A>


 Suchmaschinen

Nun können Sie schon einen einfachen Frameset aufbauen. Natürlich ist es auch möglich, ähnlich wie bei Tabellen, Frames ineinander zu schachteln und so alle erdenklichen Strukturen zu erstellen.

Der Hauptnachteil von Frames zeigt sich, wenn ein Besucher eine Ihrer (Daten)Seiten über eine Suchmaschine findet. Nehmen wir an, er würde bei Seiner Recherche auf  die Seite1.html aus unserem kleinen Beispiel stoßen. Er hätte in diesem Fall nur den reinen Inhalt gefunden und könnte den Rest Ihrer Seiten nicht besuchen, da Ihm das Menu fehlt. Natürlich würden sich die meisten Surfer die Seitenadresse genauer ansehen und nach einer kleinen Änderung Ihre Seite richtig laden. Aber nicht alle Internetnutzer sind so versiert und wären in einer solchen Situation überfordert. Folglich würden Sie dadurch bewusst auf einen Teil Ihrer Besucher verzichten müssen. Eine Abhilfe wäre auf jeder (Daten)Seite einen "Home" - Button zu setzen, über den der Betrachter auf Ihre Startseite gelangen kann. Eleganter ist es natürlich, auf jeder Seite abzufragen, ob das Dokument in den richtigen Frameset geladen wurde.



<HEAD>
<script language="javascript"><!--

function framecheck(){

if(document.layers){
if(window.name != 'daten'){window.location.href='http://www.ihreseite.de';}else{}}

else if(document.all){
if(window.name != 'daten'){top.window.location.href='http://www.ihreseite.de';}else{}}
}

//--></script>
</HEAD>