<- <- Tillbaka!

Mallen

Du öppnar ett tomt dokument i din editor och klistrar in följande kod. Det kan bli oavsiktliga radbrytningar i exempelkoden på bl.a doctype, korrigera detta i så fall.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN">
<html>
<head>
<title></title>
</head>   
<frameset rows="50,*">
<frame src="huvud.html">
<frameset cols="25%,*">
<frame src="sida.html" name="sida">
<frame src="text.html" name="text">
</frameset>
<noframes>
<body>
Välkommen tillbaks med en browser som klarar frames. </body>
</noframes>
</frameset>
</html>

Spara ned dokumentet som index.html. Nu har du mallen, men du måste fylla den med något. I koden står angivet att överst ska huvud.html laddas in, i vänsterramen ska sida.html laddas in och i stora ramen ska text.html laddas in. Då får du göra respektive html-dokument var för sig och koda in de bilder, länkar och text som du vill ha.

De dokument som ska laddas in

Ett exempel på hur huvud.html skulle kunna se ut med en bild (logotyp) inkodad:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN">
<html>
<head>
<title>Huvud</title>
</head>
<body>
<p><img src="pagina.gif" width=40 height=57 alt="Logotyp">
</body>
</html>

Ramen till höger ska fyllas med ett dokument som heter sida.html och ska innehålla menyn, här med ett exempel på en länk. Om du kikar i mallen ser du att stora huvudramen är döpt till text via name="text"
<frame src="text.html" name="text">
Då kan du med hjälp av target i din länk styra in det dokument du anropar via länken till just det fönstret.
<a href="http://www.tele2.se/" target="text"> Tele2</a>
Dock bör du veta att externa (länkar utom din egna interna sidor) bör laddas in i fullskärm och inte in bland dina ramar, då använder du target="_top" istället för som i exemplet target="text".

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN">
<html>
<head>
<title>Sidan - meny</title>
</head>
<body>
<p><a href="http://www.tele2.se/" target="text"> Tele2</a>
</body>
</html>

Sista dokumentet du ska göra för att få dina frames att funka är text.html med lite välkomnande text.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN">
<html>
<head>
<title>Text</title>
</head>
<body>
<p>Välkommen till min hemsida!
</body>
</html>

Nu kan du ladda upp alla sidorna plus bilden på ditt hemsidesutrymme (se mer om detta under Tips), detta exempel förutsättar att alla dokument och bilder lägges i samma mapp (katalog) på din server, annars får du ändra på dina sökvägar, se mer om detta under avsnittet html.

<- <- Tillbaka!