Korleis laga ein nettstad i 
MS FrontPage Express?

Kursleksjonen er forfattaren sin eigedom. Som kursdeltakar kan du fritt bruka leksjonen til eige, personleg bruk. Kursdeltakarar som ønskjer å bruka leksjonane t.d. til undervisning eller kursføremål, må ta direkte kontakt med forfattar for nærare avtale. Kopirett: Birgit Bratseth & Anders Grov Nilsen, 2001. 

resultat6.JPG (22107 bytes)


 
 

Litt om MS FrontPage Express
Start programmet. Du får no ei heilt ny side å jobbe ut ifrå.
- La oss sjå litt på menylinja og verktøylinja først.

meny_verktøylinje.JPG (13731 bytes)

Dei fleste vil nok kjenna att mange av knappane og menyvalga frå andre program t.d. MS Word. Nokre av knappane vil likevel vera heilt ukjente for nye brukarar. La oss sjå nærmare på eit par av dei.

knappar_ma_robot.JPG (4266 bytes)

webbotvindu.JPG (11138 bytes)

"Robot"-knappen er for innsetjing av WebBot-komponentar. Døme på kva dette eventuelt kan vera, ser du til høgre.

Det som er nyttigast for oss å kjenna til her i første omgang er "Tidsangivelse".

 

datovindu.JPG (16906 bytes)

Denne funksjonen set inn dato for oppdateringar på sidene dine. Her kan du velja om datoen skal visa sist sida blei redigert, eller sist ho blei automatisk oppdatert. Ein har også høve til å velja mellom ulike typar format ein vil at dato og tidspunkt skal visast i.

tabellknapp.JPG (4378 bytes)Denne knappen er for innsetjing av tabellar. Bruk av tabellar er svært nyttig når det gjeld organisering av innhaldet på sida di. Du kan her velja kor mange rader og kolonner du vil ha med på sida di, og korleis tabellen skal sjå ut. Etterpå kan du fylla dei ulike cellene i tabellen med tekst og bilete der du måtte ønskja. 

biletknapp.gif (931 bytes)Den neste knappen er for innsetjing av bilete. Du kan anten henta bilete frå eit Clip-Art Gallery som evt. følgjer med programmet, frå fil (dersom du t.d. har fotografi du har scanna inn som du ønskjer å ta med), eller du kan lasta ned bilete du vil ha med direkte fra Internett.

bildevindu.JPG (12458 bytes)

Til venstre ser du dei ulike alternativa du får tilgang til ved klikk på bilet-knappen.

lenkjeknapp.gif (1005 bytes)Den siste knappen me skal sjå nærare på, er hyperkopling-knappen. Denne funksjonen vert nytta til å oppretta hyperkoplingar eller lenkjer (klikkbare ord). Ved klikk på denne får du valget mellom ulike typar lenkjer. Nedanfor ser du døme på eit par av dei.

"http" er den vanlegaste av desse, men også "mailto" er mykje nytta. Koplingstypen http vert nytta når du skal laga ei lenkje til ei anna nettside. Etter at du har valgt denne typen, må du skriva inn URL’en eller nettadressa som lenkja skal visa til.

hyperkoplingsvindu.gif (4145 bytes)

mailto vert brukt for å laga lenkjer til epost-adresser. Det er vanleg å "signera" alle nettsider ein lagar med epost-adressa til nettansvarleg. Dette for å gi brukarane høve til å kommentera innhaldet.

MS FrontPage Express gir også høve til å setja inn ei rekkje andre komponentar på nettsidene. Under menyvalget "Sett inn" finn du følgjande alternativ:
settinnmeny.JPG (16016 bytes)

Som du ser til høgre, finn ein igjen nokre av dei same vala ifrå verktøylinjene, i tillegg til nokre ekstra. - Her er det berre å eksperimentera!

I tillegg til menyen "Sett inn", finn du også menyvalget "Format". Her får du fleire alternativ for å endra på sidene sin utsjånad. Her kan du m.a. velja skrifttype, bakgrunn osv.

Som andre Microsoft-program har også MS FrontPage Express ein hjelpefunksjon. Denne kan vanlegvis hentast fram ved bruk av menyen Hjelp eller tasten F1.


 

Laga nettsider 

MS Frontpage Express opererer etter prinsippet WYSIWYG (What You See Is What You Get). Det betyr at det endelege produktet har same utsjånad medan ein jobbar med sida i editor-programmet, og i nettlesaren når sida er publisert på nettet. 

Sida me skal laga no skal vera heilt enkel. Bruk av tabellar forenklar organisering av tekst og bilete, det er ofte fornuftig å ta utgangspunkt i ein tabell når ein skal utforma ei nettside. Me startar difor med å velja Tabell på menylinja, og klikkar deretter på Sett inn tabell…

tabellvindu.JPG (19635 bytes)

Du får då opp eit vindu slik du ser til høgre.

Først definerer me kor stor tabellen skal vera, dvs. kor mange rader (vassrette) og kolonner (loddrette) me vil ha. La oss starta med 10 rader og 5 kolonner.

I tillegg må me bestemma kor brei heile tabellen skal vera. Her kan me velja om tabellen skal utgjera ein viss prosent av det totale skjermbilete, eller me kan fastsetja breidda eksakt ved hjelp av pikslar. Eit tips er at me set tabellbreidda til 540 pikslar.

Vidare foreslår eg at me plasserer tabellen midt på sida, og at rammene på tabellen ikkje er synlege. - For å få dette til må me velja Justering til å vera midtstilt og Kantlinjestørrelse lik 0.

Har du gjort alt rett, ser skjermen din no slik ut:

 

resultat1.JPG (24088 bytes)

Dette rutenettet skal vidare fungera som mal for innhaldet på sida vår.

No kan det me starta med å laga overskrifta. Set skrivemerket i den ruta du ønskjer å ha overskrifta. 
overskrift.JPG (27915 bytes)

Når du startar å skriva, vil bokstavane automatisk plassera seg i venstre hjørne av cella. Ønskjer du å midtstilla teksten, klikkar du på midtstillingsknappen. I tillegg kan du velja skrifttype, skriftstorleik og farge på skrifta. Eg har valgt skrifttypen Trebuchet MS, svart skriftfarge, og forstørra skrifta til det eg synest er passeleg.

Du har kan hende lagt merke til at rutenettet har endra seg litt medan du har skrive inn overskrifta. Så lenge me ikkje har bestemt eksakt kor stor kvar rute skal vera, vil storleiken endra seg med innhaldet innanfor storleiken til heile tabellen. 

Me kan justera litt på dette ved å slå saman ruter. Til dømes så treng eg ikkje lenger alle rutene i rada der overskrifta står. Dersom eg merkjer (klikk og hald nede musknappen), ruta med overskrifta i samt rutene til høgre for denne slik at det vert eit svart felt i rutene, og deretter veljer Tabell-menyen og Slå sammen celler – vert desse slått saman til ei rute. Under same meny kan du også dela opp celler, Del celler…

bokstavknapp.JPG (3321 bytes)Teksten der eg fortel om meg sjølv, blir skriven med mindre bokstavar. For å justera skriftstorleik brukar me knappane som vist til venstre.

For at teksten skal sjå fin ut, har eg brukt linjeskift etter kvar linje. Ved bruk av mjukt linjeskift (som her) brukar du Enter-tasten ilag med Shift-tasten. Hardt linjeskift dvs. berre Enter-tasten, lagar større mellomrom mellom linjene.

resultat2.JPG (33256 bytes)

innrykknapp.JPG (3834 bytes)Dersom du vil ha eit innrykk i teksten, brukar du innrykks-knappane på verktøylinja. Knappen lengst til høgre rykkjer teksten mot høgre. 

 

Før me arbeider vidare, kan det vera lurt å lagra arbeidet. Under Fil-menyen finn du alternativet Lagre som…

No er me klar til å setja inne eit bilete på nettsida vår. Dersom du ikkje har eit eige bilete lagra på maskinen, kan me leita fram eitt på Internett. Motivet treng ikkje vera så viktig i første omgang, la oss difor bruka nettlesaren og gå til www.dagbladet.no og sjå om der er noko brukande. Det er viktig å hugsa at når me kopierer bilete frå Internett, kan desse kun nyttast til privat bruk. Meir om bilete og regelverk på nettstaden Clara .

Velg raskt ut eit passande bilete. Ved å høgreklikka på bilete, kan ein lagra biletet kor som helst. - Når det gjeld nettsider, må alle bilete og all grafikk som skal nyttast på sida lagrast for seg på same stad. Oftast er det lurt å leggja alt i same mappe.

 

wpe1.jpg (7319 bytes)Ved klikk med høgre musknapp på aktuelt bilete, får du høve til å "Lagre bilde som".

biletknapp.gif (931 bytes)Når biletet er lagra, går me tilbake til MS FrontPage Express. No plasserer eg skrivemerket der eg ønskjer å montera biletet, klikkar på biletknappen. Me skal no henta eit bilete frå fil (det me har lagra), difor veljer me Bla gjennom… 

setteinnbilde.JPG (34012 bytes)

Me leitar oss fram til plassen der me lagra bilete. Klikk for å markera ønskt bilete.

Etter innsetjing av bilete, ser nettstaden min slik ut:

resultat3.JPG (47336 bytes)

På Internett er det enkelt å kopla saman fleire dokument, slik at me får ein hyperstruktur. No skal me leggja inn hyperkoplingar eller lenkjer på sida.

Eg ønskjer å organisera lenkjene mine etter kategoriar, desse vil eg ha plassert i ulike ruter i rammeverket mitt. Difor brukar eg funksjonen i Tabell-menyen som heiter Del celler.. og set inn emneoverskrifter til dess rutenettet ser slik ut:

resultat4.JPG (55757 bytes)

Her har eg delt ei rute i fire nye ruter. Eg har valt å ha emneoverskriftene i kursiv, litt større enn lenkje-tekstane som kjem under.

På biletet over kan me sjå at teksten i dei nye rutene er justerte litt ulikt. 

For å betra på dette, kan du gå til kvar rute og så høgreklikka. Velg deretter Egenskaper for celle.. I vinduet du no får opp kan du justera celleinnhaldet både loddrett og vassrett. For å få alt på same linje veljer du Loddrett justering og Øverst.

For å få klikkbare lenkjer, må me no velja eit av dei orda som skal vera klikkbare. Eg veljer HSH under kategorien min Ymse. Eg merkjer ordet. 

lenkjeknapp.gif (1005 bytes)Deretter klikkar eg på Hyperkoplings-knappen på verktøylinja.

 

hshkoplingsvindu.JPG (12849 bytes)

I dette vinduet må eg skriva inn adressa som koplinga skal visa til, i mitt tilfelle er det nettstaden til HSH, http://www.hsh.no.

At lenkjene er aktiverte, vert vist ved at orda har fått understreking, og ein annan farge enn øvrig tekst.

resultat5.JPG (56746 bytes)

Som nemnt er det fornuftig å ta med oppdateringsdato samt epost-adressa vår på kvar side me lagar. 

For å leggja til epost-adressa, markerer du aktuell tekst og set inn mailto-lenkja 

(klikk på hyperkopling-knappen), og skriv inn epost-adressa di. 

Epost-adressa eg veljer å skriva inn ser slik ut: andersgrovnilsen@hotmail.com (alle epost-adresser har @ (krøllalfa) i midten, den får du fram ved å tykkja Alt Gr-knappen + 2-tals-tasten).

Heilt til slutt set me inn oppdateringsdatoen ved hjelp av "robot"-knappen, og valget "Tidsangivelse".

datovindu2.JPG (19959 bytes)

Som ein kan sjå over, har eg valgt datoformatet "16.november 2000" (for å få fram alternative skrivemåtar, klikkar du på trekanten til høgre). Eg har ikkje teke med noko tidsformat for oppdatering, berre datoen viser når sida sist blei redigert.

 

I nettlesaren Internet Explorer ser sida mi tilslutt slik ut: 

resultat6.JPG (22107 bytes)

For moro skuld, kan du jo eksperimentera med å setja inn ein rulletekst på sida di ( velg Sett inn…, Rullende tekst…), og skriv inn eit passande uttrykk.

Hugs imidlertid at animasjonar av denne typen stel konsentrasjon frå brukaren og kan føra han bort fra det me eigentleg vil at han skal lesa eller få med seg.

 Lukke til!!

Anders Grov Nilsen, HSH IKT-seksjonen,13.02.01.