Sidetyper

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