|
Af Timm W. Larsen
@-begynder
Juni 2005
Skærmopløsning
Ja ... Det ville jo være meget
nemmere, hvis alle surfere havde samme skærmopløsning. Men det
har da altså ikke ... og hvad gør man så.
Spørgsmålet har jeg fået
stillet utallige gange. Derfor har jeg forfattet to artikler om skærmopløsning kontra webdesign.
Den mest almindelige skærmopløsning er faktisk 600 x 800 pixel.
Simpelthen fordi det som reglen er standardindstillingen i en ny
pc ... og mange mennesker ved ikke, at de kan ændre opløsningen
:-)
Mange webmasters vælger derfor at optimere deres side efter
den skærmopløsning.
Men en god hjemmeside skal gerne kunne ses i alle
skærmopløsninger - måske lige med undtagelse af 400x600, som
stort set er udgået efterhånden.
To muligheder
Det to mest anvendte teknikker
til at løse problemet omkring skærmopløsning er tabeller og rammesider:
1. TABELLER
Tabeller er velegnede til at styre webdesign i forhold til
skrærmopløsning. Tabeller kan enten sættes op, så indholdet
centreres midt på siden ... eller så indholdet skaleres alt
efter skærmopløsning.
2. RAMMESIDER / FRAMESET
Rammesider (eller på engelsk et
frameset) er en anden teknik. Som tabellerne er der flere måder
at skrue en rammeside sammen på for at opnå et godt webdesign
tilpasset brugerens skærmopløsning.
I denne artikel vil jeg
gennemgå teknikken som anvender rammesider ...
Hvis du vil læse om teknikken med anvendelse
af tabeller kan du læse artiklen
tabeller og skærmopløsning >>
Rammesider
Rammesider kaldes ofte ved det
kortere navn "rammer" eller det engelske navn "frameset". I
denne artikel vil vi anvende betegnelsen "rammeside" om den
overordnede rammeside og betegnelsen "rammer" om de enkelte
rammer i rammesiden.
Det er
egentligt ret simpelt at lave rammesider ... forklaringen bliver
nok lang alligevel ... men simpelt er det, når man først lige har
fået fat i systemet.
Hvis du anvender en WYSIWYG editor, er der som reglen en god
hjælpefunktion/wizard, som gør det endnu lettere. Hvis du
programmerer html "i hånden", er det også overkommeligt.
En rammeside
Du skal først lave selve rammesiden.
En rammeside er bare en almindelig html-side, som angiver nogle links
til underliggende sider, der vises i rammerne i rammesiden.
Størrelse, navn og placering af de viste sider angives på selve
rammesiden.
Strukturen i en simpel rammeside ser fx sådan ud:
<html>
<head>
<title>Rammeside til design</title>
</head>
<frameset rows="200,*">
<frame name="banner" src="banner.html">
<frame name="indhold" src="indhold.html">
</frameset>
</html>
I
rammesiden angiver du først antallet af kolonner eller rækker -
i dette tilfælde "rows" som liste af værdier adskilt med
komma. Den øverste række er sat til 200 (pixel er
default) og den nederste til "*" ... hvilket betyder, at den
fylder resten af skærmen ud.
Herefter angiver man med elementet <frame> indholdet af den
enkelte ramme. Man anfører minimum et navn og en src - altså stien
til den side, der skal vises i rammen.
Kombinerede
rammesider
En
ramme side kan være meget avanceret ... og det er faktisk med de
avancerede rammesider, at man først opdager styrken ved
rammesider. Man kan nemlig
kombinere to (eller flere ) rammesiderfor både at få en lodret og
vandrette opdeling. Typisk vil man tage udgangspunkt i en vandret
deling (som i ovennævnte eksempel) og i den nederste ramme
indsætte endnu et rammeside, som man så deler lodret.
<html>
<head>
<title>Rammeside til design</title>
</head>
<frameset rows="200,*">
<frame name="banner" scrolling="no" noresize>
<frameset cols="150,*">
<frame name="links" target="indhold">
<frame name="indhold">
</frameset>
<noframes>
<body>
<p>Her kan man fx lave en beskrivelse af siden.</p>
</body>
</noframes>
</frameset>
</html>
Som du kan se, er nummer to <frame> element simpelthen bare
erstattet med endnu et <frameset>. Denne gang er første kolonne
sat til 150 pixel og anden kolonne fylder resten af siden. Du kan
også sætte kolonnerne til en procentdel af skærmstørrelsen, men så
skal du anvende procentstørrelse på alle rammer i samme rammeside.
Som eksempel har jeg med blå skrift vist et par attributter til
den første <frame>. Her er scrollbaren slået fra og størrelsen er
låst, så brugeren ikke kan ændre den.
Noframes
Du vil også bemærke, at vores <body> først kom med her i anden
omgang. Man behøver nemlig egentlig ikke en body i et frameset.
For der er jo ikke noget af selve <frameset>, som vises for
brugeren. Man har alligevel mulighed for at angive et <noframes>.
I <noframes>
kan man indsætte en beskrivelse af siden eller noget af den
vigtigste tekst. Mange søgemaskiner har nemlig svært ved at finde
de underliggende sider i en rammeside. Så i <noframes> har man
mulighed for at give en rammeside lidt "kød på" ... eller nogle anvisninger til,
hvordan søgerobotterne kommer "videre ned i hjemmesiden". I gamle dage viste
browsere, som ikke kunne vise frameset, indholdet af noframes.
Links og target
Den grønne attribut er interessant. Target
angiver nemlig, hvor den side, som dine links peger på, skal
vises. I target angiver man altså navnet (defineret med
attributten "name") på den ramme, hvor links skal vises.
Alternativt kan du indsætte en Target i selve dit link element
<a>, på den side hvor linket sidder.
Der findes en række andre detaljer, som man kan tilpasse i
rammesider ... men du skal jo også selv have lov at rode lidt med
det ;-)
Bemærk
Vær i øvrigt opmærksom på, at rammesider har nogle ulemper ...
særlig mht. søgemaskiner og søgemaskineoptimering. Men det er en
hel tutorial for sig selv.
stem her!
|