Søk i Webskolen:

Globale linker

• Linker
• Oppgaver

Dreamweaver

• Intro
• Site-management
• FTP
• Arbeids-området
• Tekst
• Bilder
• Tabeller
• Celler
• Kommentarer
• Invisibles
• Pageproperties
• HTML styles
• Rollovers
• Library items
• Frames
• Layers
• Timeline
• Stylesheets 1
• Stylesheets 2
• Stylesheets 3

<images>

Bilder kan gjøre mye for en side. Bilder kan løfte en side fra grå og kjedelig til informative og flotte sider.
Men bilder kan også ødelegge en side. Overdrevent store bilder, som tar lang tid å laste ned, kan føre til at du mister brukere. Vær også nøye med hva slags bilder du bruker på en side. Pass på at de gir en mening i forhold til teksten på siden.

En tommelfingerregel sier at en webside skal inneholde max. 15% bilder og grafikk. Blir det mer roter du bare til siden og det tekstmessige innholdet står ikke lenger i fokus.

Klikk på bildet for å se en større versjon (96K)

Skal du bruke bilder på en side, og det bør du i de fleste tilfeller, syns jeg, skal bildene være små og raske å laste ned. Ikke tving alle brukerne til å se store, tunge bilder.

Hvis du vil at brukeren skal se store versjoner av bildene, så gjør de små bildene til linker som peker til en stor versjon av bildet. Klikker brukeren på det lille bildet, er han/hun også beredt til å vente på resultatet, og alle de andre som ikke vil se det store bilder, slipper det.
Opplys også om hvor stort (i Kb) det store bildet er, slik at brukeren kan gjøre seg opp en mening om han/hun virkelig vil bruke tiden sin på å laste ned det store bildet. Dette kan gjøres f.eks. ved en liten billedtekst under bildet, eller ved bruk av Alt-teksten i bildet.

Skal du sette inn et bilde i et dokument, plasserer du markøren din der du vil at bildet skal stå, og klikker på (Insert Image) i verktøypaletten.

Bildene kan ha en rekke attributter, og disse setter du i Properties Inspectoren.

NB!Før musepekeren over de forskjellige delen av bildet for å få en kort forklaring på feltene. Vil du vite hvilke felt jeg forklarer i teksten under, fører du musepekeren over overskriften (ikke klikkbare linker).

• Name: her skriver du inn navnet på bildet. Lønner seg å navngi alle bildene, bl.a. fordi det da er letter å finne fram til riktig bildet når du bruker JavaScript.
• Width: her står bredden på bildet. Ikke gjør om hverken bredde eller høyde på bildet her, det skal gjøres i en bilde-editor, som f.eks. Photoshop.
• Height: her står høyden på bildet.
• Source: her er den relative banen til bildet, fra dette dokumentet. Klikk på den gule mappen for å finne igjen bildet hvis du har mistet det.
• Link: bilder kan være klikkbare linker. Her legger du inn linken. Skal linken peke til et dokument på egen site, klikker du på den lille gule mappen og finner fram til dokumentet som skal åpnes. Husk at alle bilder du bruker på siten din må ligge i site-mappen.

• Align: hvordan bildet skal justeres i forhold til annet innhold, som f.eks. tekst som ligger på samme linje i dokumentet.
• Alt: alternativ tekst til bildet. Dette er den lille gule lappen som popper opp etter ca. 1 sekund, når du fører musepekeren over bildet. Dette feltet må fylles ut, bl.a. av hensyn til synshemmede som surfer med talende browsere.
• Help: klikk her for å åpne hjelpefilen (som forøvrig er meget bra. Her finner du svar på det meste).
• Quick Tag Editor: klikk her for å redigere taggen markøren står i.
• Map name: skal kun visse deler av et bilde være klikkbart, bruker vi noe som heter ImageMap. Alle ImageMap må ha navn, og det skriver du inn her. Eller så kan du bruke det DW fyller inn for deg.

• Rectangluar Hotspot Tool: brukes til å tegne firkantede klikkbare områder i et bilde.
• Oval Hotspot Tool: brukes til å tegne sirkulære klikkbare områder i et bilde.
• Polygon Hotspot Tool: brukes til å tegne «frihånds»-klikkbare områder i et bilde.
• Vertical Space: setter er inn «marg» over og under bildet.
• Horizontal Space: setter inn «marg» på begge sider av bildet.
• Target: brukes til å bestemme hvilket vindu som skal oppdateres i et frameset når du klikker på en link.
• Low Source: her kan du legge inn en lavoppløselig versjon av bildet som skal settes inn. Den lavoppløselige laster fortere enn det som skal inn, og vises i den tiden det tar å laste det opprinnelige bildet.

• Border: når bildet brukes som link, får det en blå kantlinje rundt seg. Dette kan fjernes ved å sette denne verdien til 0.
• Edit: rediger bildet i en forhåndsdefinert bilde-editor.
• Reset Size: tilbakestiller bildet til opprinnelig størrelse.
• Left: venstrejustert
• Center: Midtstillt
• Right: høyrejustert
• Kollaps: minimerer Properties Inspectoren til å vise kun de viktigste innstillingene.

Gå til neste side hvor vi skal se på tabeller.