InternetGuiden

1997

HTML-SKOLAN
Frames
InternetGuidens HTML-skola tar nya friska tag. Din lärare är Annica Tiger, som ska dela med sig av sitt kunnande. Välkommen till första lektionen!

Text: Annica Tiger

Annica Tigers första artikel handlar om frames; att dela in websidan i olika ramar. För att hänga med bättre kan du ladda ner vårt kodexempel på: http://www.internetguiden.com/
Frames ingår inte i standarden för html 3.2, men de stöds av flertalet moderna webläsare vilket gör att det blivit mycket populärt att använda frames på sina hemsidor. I kommande html 4.0 är frames med, dock med lite modifieringar, se relaterade länkar.

Dessa förkunskaper behövs
*
Grundläggande kunskaper i att använda markeringsspråker HTML.

Har du inte det?
*
En bra bok för en nybörjare är Lättpocket om att göra en egen hemsida av Jesper Ek på Paginas förlag.
* Du kan även besöka Annica Tigers HTML nybörjarguide på ®hyperlink http://www.atiger.pp.se/

Mallen
Du har ett kodexempel på hur Internetguidens frames är kodade. Skärmfönstret har delats upp i tre ramar och i varje ram laddas ett annat html-dokument in. Koden skriver du ned i en texteditor eller i en html-editor och sparar ned som vanligt. Sedan gör du de dokument som ska laddas in i mallen, lägger in text, länkar och bilder med hjälp av html-taggar. I vårt exempel har vi tre ramar, alltså är det fyra dokument som ska göras.

EXEMPEL:
<HTML>
<HEAD>
<TITLE>Tidningen</TITLE>  
</HEAD>
<FRAMESET ROWS="90,*">  
1
<FRAMESET COLS="106,*">
2  
<FRAME SRC="logo.html" NAME="logo" SCROLLING=NO>
<FRAME SRC="meny.html" NAME="meny"
</FRAMESET>                            
2a
<FRAME SRC="stora.html" NAME="text>

<NOFRAMES>
<BODY BGcolor="#FF0000" TEXT="#000080">
3  
<P>Här anges ett noframes alternativ.
</BODY>
</NOFRAMES>
</FRAMESET>
</HTML>

FRAMESET
1. Ramdeklarationer görs med hjälp av <FRAMESET> som talar om för webläsaren hur ramarna ska delas upp, ROWS placerar ramarna i rader och COLS i kolumner. Du anger storleken inom citattecken i procent (av skärmen) eller pixlar (fasta mått) separerade med ett kommatecken. Anger du ett värde som * betyder det resten av skärmen som blir kvar när övriga ramar tilldelats sina ytor.
I exemplet har det angivits
<FRAMESET ROWS="90,*">
samt
<FRAMESET COLS="106,*">
Vilket betyder: översta raden 90 pixlar hög, vänstra kolumnen 106 pixlar bred. Efter första sluttaggen för FRAMESET kommer sista ramen att tilldelas hela nedre skärmen via de angivna värdena med
* i ROWS och COLS.
Här anger du även om ramverket ska ha kanter via attributen
BORDER=x (NS),
FRAMEBORDER=1/0 (MSIE)
och FRAMESPACING=x (MSIE)
Värdena x anges i pixels. Utelämnar du attributen för kanter (border) så blir default en 3d-liknande kant, se exemplet.
I Netscape kan du ge kanterna färg genom
BORDERcolor="#FF0000".

FRAME
2. I <FRAME> anger du SRC="sökväg_till_dokumentet_som_ska_laddas_in".
Här kan du även ange andra attribut som styr ramens utseende och beteende. NORESIZE anger att ramen inte kan dras isär av besökaren. SCROLLING=no eller
SCROLLING=yes anger om en rullningslist ska visas, default är SCROLLING=auto vilket är bäst för då framträder bara rullningslisten om den behövs. Du kan ange marginalstorlek i dina ramar, default är några pixlar men du kan sätta det till 0 via MARGINHEIGHT=0 (övre och nedre) och MARGINWIDTH=0 (höger och vänster).

NAME OCH TARGET
2a. Du namnger en ram med hjälp av NAME, vilket ger möjlighet att styra länkar in i den namngivna ramen.
Detta görs med hjälp av target.
<A HREF="fil.html"
TARGET="namn_du_angett_i _NAME ">Länktext</A>

TARGET="_top"
besökaren kommer att surfa ut från dina frames.
TARGET="_blank"
öppnar ett eget nytt fönster för länken, bör undvikas då det kan irritera besökaren att flera webläsar-fönster öppnas.
TARGET="_parent"
till föräldraframen, går tillbaka en framenivå.
TARGET="_self"
(är default), länken laddas in i ramen där länken sitter.

NOFRAMES
3. Du bör alltid ange ett noframes-alternativ. Äldre webläsar samt textbaserade (Lynx) stödjer inte frames och i exempelvis. Opera kan man stänga av så inte frames visas. Har du inget noframes-alternativ möts de av en blank, tom sida. Inom NOFRAMES kan du koda in ett helt komplett dokument som vanligt.

KANTLÖSA FRAMES
4. Ibland kan det vara snyggt att göra frames som inte har några kanter på ramarna. Den svenska flaggan består av sju kantlösa ramar. Om du i yttersta FRAMESET-taggen skriver in attributen
BORDER=0
FRAMEBORDER=0
FRAMESPACING=0
får hela ramverket så kallade osynliga ramar i både Netscape och Microsoft Explorer.

NÄSTLADE RAMAR
Ramar kan nästlas i varandra. Antingen direkt genom att placera ramdeklarationer inuti ramdeklarationer. Eller indirekt genom att du i en ram öppnar ett dokument som i sin tur innehåller ramar.

FÖR- OCH NACKDELAR
Frames kan vara praktiskt i många fall men är ibland svåra att navigera i samt kan bli plottriga i liten skärmupplösning. Undvik att ange alla mått i pixlar utan använd gärna procent. Att skriva ut från en frame är ibland svårt för en nybörjare som inte förstår att den ramen vars innehåll man vill skriva ut måste först aktiveras det vill säga "klickas" i. Sätter man ett bokmärke är det mallen som bokmärks oavsett vart man befinner sig i ramverket.

FRAMES I FRAMES
Länka aldrig in andras frames i dina frames, undvik överhuvudtaget att länka in andras sidor i ditt ramverk, använd
TARGET="_top"
för dina externa länkar. För att själv undvika att bli inlänkad i andras frames lägg in en "framebrytarlänk"
<A HREF="mallens_namn. html" TARGET="_top">Har du fastnat i en frame? Klicka här!</A>.

annica.tiger@mailbox.swipnet.se

Relaterade länkar:

HTML 4.0 Working Draft Release
http://www.w3.org/TR/WD-html40/
Netscapes HTML References Guide
http://developer.netscape.com/library/documentation/htmlguid/index.htm
Microsofts HTML References Guide
http://www.microsoft.com/workshop/author/newhtml/default.htm
Bra och dåliga frames
http://www4.tripnet.se/~slarti/f_frames_se.htm

Undvik de vanligaste misstagen
* Det är viktigt att du kodar korrekt för att dina frames ska visas som tänkt. Netscape samt MSIE 4.0 visar bara eventuellt NOFRAMES-alternativ eller blank sida om följande fel har gjorts:
* Antalet start- och sluttaggar i FRAMESET stämmer inte överens.
* BODY-taggen får endast förekomma inom eventuellt NOFRAMES alternativ.

PROFFSENS BÄSTA TIPS
Vilka är för- och nackdelarna med frames?
Robert Ryberg, Chef Digitala Medier, Magazine Web AB
- Frames ger mer problem än det ger möjligheter, tyvärr. Inte för att frames är så dåligt, men webläsarnas hantering är usel. Värst är att man varken ser adressen eller titeln på den frambläddrade "Framen" där själva innehållet finns. Och Bokmärken/Favoriter fungerar inte med frames man hamnar alltid i huvudframen om man använder ett bokmärke. Utskrifter är ett problem, det går nästan aldrig att få ut hela sidan.
Och fördelarna?
- Fördelarna är uppenbara: Webtjänsten blir snabbare genom att man bara laddar in en del av en sida när man klickar på en länk. En annan fördel är att man behåller en viss del av sidan synlig, med menyer exempelvis, fast man bläddrar i en lång sida.
Har du några favoritknep?
- Om man behöver frames för att exempelvis behålla en navigationsmeny framme även om man bläddrar, låt hela "frame setet" laddas om så att titel och bokmärke fortfarande är korrekta. Annars är det bästa att göra sidan så kort att man inte behöver bläddra. Det underlättar oerhört för användaren.
www.magazine.se

Roger Åberg, webartist & delägare, Bazooka Interactive
- Om du har en meny som ska följa med på hela sajten, är frames en fördel. Du behöver inte uppdatera varje sida varje gång du ändrar i menyn. Nackdelarna med frames är att det blir långsammare att ladda, man laddar ju minst tre dokument istället för ett. En tumregel är att så långt det går undvika att använda frames.
Knep?
- Använd aldrig procent om det inte är 50/50. Glöm heller inte bort att sätta NORESIZE om du vill att ramarna skall stanna på plats.
Favoritsajt med Frames?
http://www.reload.org/ en samling med dagböcker.
http://www.bazooka.se/ och http://www.roger.nu/

Till början av sidan