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/
|