hjemmesider webdesign frontpage gratis grafik scripts javascripts asp html css tutorial begynder hjemmeside  homepage programmering artikler tools
Gå til forsiden   Tips & Tricks, søgemaskiner, optimering, webhoteller, layout, design og meget mere Gratis grafik - knapper, gif, billeder, ikoner m.m. FrontPage - alle kan lave hjemmesider Læs interessante artikler om web og Internet? Prøv vores Online Tools ... vi genererer dine koder Scripts inddelt i kategorier
Tutorials om webprogrammering
Få svar på spørgsmål om web og programmering
hjemmesider
Tips & Tricks, søgemaskiner, optimering, webhoteller, layout, design, webdesign, asp, scripts, smarte funktioner Tips & Tricks, søgemaskiner, optimering, webhoteller, layout, design, webdesign, asp, scripts, smarte funktioner
 

hjemmesider webdesign frontpage grafik scripts asp html css tutorial begynder hjemmeside  homepage programmering

Rammesider og skærmopløsning

En god hjemmeside skal kunne ses i alle skærmopløsninger. Hvilken teknik, man vælger til at opnå målet, er lidt en smagssag.

Denne artikel viser, hvordan du vha. rammesider kan optimere din hjemmeside, så den ser pæn ud uanset hvilken skærmopløsninger den besøgende har.

ARTIKEL


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.

Det kunne se sådan ud:

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


 

Valid XHTML 1.0! Valid CSS!

Startside  - Foretrukne  - E-mail - Sitemap

Til toppen >>

 

powered by FreeFind

hjemmesider webdesign frontpage grafik scripts asp html css tutorial hjemmeside  homepage programmering
hjemmesider webdesign frontpage grafik scripts asp html css tutorial hjemmeside  homepage programmering

 Annoncer her ...!

interaktivt, funktioner, afstemningsboks, debatforum, gæstebog, søgefunktion, afstemningsbokse, debatforums, gæstebøger, søgefunktioner, forums, interaktiv
 
artikler artikel web webmaster hjemmesider internettet programmering nettet © 2005 now@net artikler artikel web webmaster hjemmesider internettet programmering nettet