Avdeling for allmenne fag

Kurs i websideutvikling for mediastudenter

Websiden for tirsdag 23.10.01

Hyperlenker til andre dokumenter

[Kap. 3.1.]

Hyperlenker legges inn via hyperlenke-knappen (jordklode med lenkesymbol).

Vi skal nå opprette et nytt dokument som skal inneholde

  • en hyperlenke med absolutt webadresse til HiTs hjemmeside, og
  • en hyperlenke med relativ (web)adresse til dok1.htm, som vi tidligere har laget.

Merk at du kan angi hvor måldokumentet skal åpnes, f.eks.  i det eksisterende vinduet eller i et nytt vindu. Dette gjøres via menyvalget "Målramme" i hyperlenke-vinduet.

Hyperlenker til bokmerker

[Kap. 3.3 i Webteknikk]

Et bokmerke er et merke eller referansepunkt ved et sted inne i et dokument. Hyperlenker til bokmerker er da lenker til slike bokmerker.

Bokmerker lages via menyvalget Sett inn/Bokmerke, mens lenke til bokmerke lages via menyvalget Sett inn/Hyperlenke eller via hyperlenkeknappen.

E-post-hyperlenke

Såkalte e-post-hyperlenker er spesielle hyperlenker. Når hyperteksten klikkes, åpnes brukerens e-postprogram automatisk og en ny meldingsvindu åpnes også automatisk. Et eksempel på slik hypertekst fins nederst på denne websiden (Finn.Haugen@hit.no).

I FrontPage lager du slike hyperlenker via samme menyvalg som for vanlige hyperlenker, men pass på å klikke på konvolutt-knappen i vinduet "Opprett hyperkopling".

Tekstformattering

[Kap. 4 Webteknikk]

Overskrifter

Velges fra Stil-menyfeltet i Formattering-verktøylinja

Fonter, farger, størrelse etc.

Menyvalg: Format, Skrift.

Lister

[Kap. 5 Webteknikk]

Lister lages vha. listeknappene i Formattering-verktøylinja. Listeegenskaper justeres via høyreklikk inne i lista.

Listetyper:

  • Unummererte lister eller punktlister
  • Nummerlister med tall- eller bokstavnummerering
  • Nøstede lister (lister inni lister)
  • Definisjonslister. Eksempel.

Grafikk

[Kap. 6 Webteknikk]

Hva er et grafikkobjekt?

Jo, en grafikkfil! Vanlige filformater:

  • gif - egnet for strektegninger og tekniske tegninger. Gir mulighet for animasjoner (animert gif).
  • jpg - egnet for fotografier.
  • bmp - ok, men tar stor plass.
  • png - kommer mer og mer, som erstatning for gif, som er patentert.

Hvordan få tak i grafikkobjekter?

  • Digitalt kamera
  • Skanning av papirbilder
  • Fra Ftp-tjenere
  • Du kan lage en tegning i f.eks. Paint eller Visio eller AutoCad
  • Grafikk kan lastes ned fra f.eks. MediaBuilder eller fra (andre) ClipArt-samlinger eller fra andre steder på web. [Eksempel]
  • Du kan ta et "bilde" av et vindu el.l. på PC-skjermen med f.eks. PaintShop Pro [Eksempel]

Hvordan legge inn grafikkobjekter i dokumentet?

Grafikkobjekter (grafikkfiler) inkluderes med IMG-elementet (image) med attributt SRC hvis verdi er grafikkfilens filnavn.

Vi prøver å legge inn HiTs logo i et Html-dokument.

Plassering av grafikkobjektet i forhold til teksten

  • Grafikkobjektet kan plasseres i et P-element, som f.eks. kan sentreres.
  • Plasseringen i forhold til omgivende tekst styres med ALIGN-attributten. Eksempler

Lenker fra grafikkobjekter

Lenke fra et grafikkobjekt til et måldokument lages som for hypertekst, dvs. at IMG-elementet plasseres inne i et A-element.

Klikkbare kart

(eng.: clickable maps) er grafikkobjekter med ulike lenker fra ulike (kart-)områder.

Lages med USEMAP-attributten i IMG-elementet og et eget MAP-element, som bl.a. definerer kartområdene og lenkene.

Eksempel

Bakgrunnsgrafikk

  • Bakgrunnsfarge legges inn med BGCOLOR-attributten i BODY-elementet.
  • Bakgrunnsbilde legges inn med BACKGROUND-attributten i BODY-elementet.  Nettleseren fyller ut hele vinduet med bildet. Eksempel Her er selve bildet.

Tabeller

[Kap. 7 i Webteknikk]

Enkelt, med menyvalget Tabell.

Tekst og/eller grafikk plasseres i tabellceller for å oppnå ønsket plassering på websiden.

En annen løsning enn tabell er å bruke Html-rammer (eng.: frames), se nedenfor.

Hvordan laste ned andre dokumenter for videre bearbeiding i Html-editoren

Html-dokumentet lagres med menyvalget Fil/Lagre Som i nettleserens meny. Dokumentet åpnes så i FrontPage for editering.

Oppdatert 22.10.01 av Finn Haugen. E-postadresse: finn@techteach.no