Sidetyper Web-udvikling med FrontPage 2003 RHS - Informationsteknologi.

Præsentationer af emnet: "Sidetyper Web-udvikling med FrontPage 2003 RHS - Informationsteknologi."— Præsentationens transcript:

1 Sidetyper Web-udvikling med FrontPage 2003 RHS - Informationsteknologi

2 Sidetyper • En blank side er – naturligvis – den simpleste type af webside • Minder om Word-dokumenter – Man kan umiddelbart skrive og formatere tekst – Man kan indsætte billeder… – …men man kan ikke placere billeder hvor som helst på siden RHS - Informationsteknologi

3 Sidetyper • Mere avancerede – og brugbare – sidetyper er rammesider og sider med layout-tabeller • Rammeside – side der er inddelt i et antal undersider, kaldet rammer • Side med layout-tabel – side hvor der er indsat en tabel til at styre sidelayout • I begge tilfælde inddeles den oprindelige side i flere mindre arealer RHS - Informationsteknologi

4 Rammeside Åbn opgaveruden (vælg evt. ”Ny”), og klik på ”flere sideskabeloner…” RHS - Informationsteknologi

5 Rammeside Vælg fanebladet ”Rammesider”, klik på (f.eks.) ”Banner og indhold”, og klik OK RHS - Informationsteknologi

6 Rammeside Denne rammeside har tre undersider RHS - Informationsteknologi

7 Rammeside • Vi har faktisk lavet fire nye, selvstændige sider på denne måde – Rammesiden (hele siden) – De tre undersider • Hver af disse fire sider skal have egen titel og filnavn • Vi kan også vælge en eksisterende side ved at klikke på Angiv startside… RHS - Informationsteknologi

8 Rammeside Her er valgt ”Ny side…” for alle tre undersider Højreklik på ”ny_side_1.htm”, og vælg ”Gem” RHS - Informationsteknologi

9 Rammeside Vi skal nu angive titel og filnavn for alle fire sider, en for en! Grafikken angiver, hvilken side vi nu angiver titel og filnavn for RHS - Informationsteknologi

10 Rammeside • Det er let at miste tålmodigheden, når man skal angive titel og filnavn for fire sider… • Vælg gode navne alligevel!! Hvis ikke, mister I overblikket over siderne • Hvis selve siden f.eks. hedder ”Butik.htm”, kan man kalde undersiderne for – ”Butik_top.htm” – ”Butik_venstre.htm” (…og så videre…) RHS - Informationsteknologi

11 Rammeside Man kan redigere ”butik_højre.htm”, selv om man kun har ”butik.htm” åben… RHS - Informationsteknologi

12 Rammeside …men man kan også åbne ”butik_højre.htm” som en selvstændig side RHS - Informationsteknologi

13 Rammeside • Fordele ved rammesider – Meget lettere at styre layout (justering,…) – Sider er selvstændige, og har selvstændige egenskaber (baggrundsfarve, scrollbar,…) – Man kan sætte et link ind i en ramme, og lade indholdet komme frem i en anden ramme, uden at resten af siden ændres RHS - Informationsteknologi

14 Rammeside • Ulemper ved rammesider – Svært at have gennemgående grafik på tværs af rammer, f.eks. en baggrund – Egenskaber skal sættes for hver eneste underside, kan ikke sætte ”fælles” egenskaber (f.eks. baggrunds-farve) – Kan ikke have ”huller” på en side; alt skal være del af en ramme RHS - Informationsteknologi

15 Rammeside • Brug en rammeside, hvis – En del af siden skal være ”konstant”, selv om man klikker på et link (f.eks. et banner i toppen og en liste af links i højre side) – Der er brug for forskellige egenskaber (farver, m.v.) på forskellige dele af side • Ofte bruges en rammeside til forsiden på websiten, med ”almindelige” undersider RHS - Informationsteknologi

16 Side med layout-tabel Lav en tom side med navnet ”lager.htm”, og vælg derefter ”Layouttabeller og –celler…” fra ”Tabel”-menuen RHS - Informationsteknologi

17 Side med layout-tabel Nu fremkommer opgaveruden ”Layouttabeller og –celler” Klik på dette tabel-layout RHS - Informationsteknologi

18 Side med layout-tabel Siden opdeles i et antal ”celler” BEMÆRK: Der er ingen nye sider! RHS - Informationsteknologi

19 Side med layout-tabel • Fordele ved sider med layout-tabel – Meget lettere at styre layout (justering,…) – Stadig kun én logisk side – Stor fleksibilitet med hensyn til layout, kan godt have ”huller” på en side – Nemt at styre egenskaber for hele siden RHS - Informationsteknologi

20 Side med layout-tabel • Ulemper ved sider med layout-tabel – Kan være svært at holde overblikket over formateringen af tabellen – Vanskeligt at skifte indhold – f.eks. når der klikkes på et link – i kun en del af vinduet RHS - Informationsteknologi

21 Side med layout-tabel • Brug en side med layout-tabel, hvis – Sidens indhold falder naturligt i et antal rektangulære områder – Der ikke linkes videre fra siden, eller – Hvis der linkes videre fra siden, skal hele siden skifte indhold (f.eks. tilbage til forsiden) • Ofte bruges sider med layout-tabeller som siderne med det egentlige indhold, ikke så meget som ”navigations-sider” RHS - Informationsteknologi

22 Ny side fra eksisterende side • Skal man lave flere sider med næsten samme indhold, kan man ”klone” en eksisterende side, og tilrette indholdet • Kan bruges hvis man f.eks. laver menuer udelukkende ved hjælp af grafik RHS - Informationsteknologi

23 Ny side fra eksisterende side Åbn opgaveruden (vælg evt. ”Ny”), og klik på ”fra eksiste- rende side…” RHS - Informationsteknologi

24 Ny side fra eksisterende side Vælg den side, den nye side skal baseres på RHS - Informationsteknologi

25 Ny side fra eksisterende side Ny side ”klonet” fra ”lager.htm”. Husk at give den et fornuftigt navn… RHS - Informationsteknologi