Sådan tilføjer du billeder til dit websted i Dreamweaver

At tilføje et billede til din webside kan virke næsten magisk i starten, fordi processen er så enkel med Dreamweaver. Udfordringen med webgrafik er ikke at tilføje dem til dine sider, men at skabe flotte billeder, der indlæses hurtigt i din seers browser.

Du skal bruge et andet program, såsom Photoshop, Photoshop Elements eller Fireworks, for at oprette, konvertere, redigere og optimere billeder. Optimering af billeder gør filstørrelser mindre, så dine billeder downloades hurtigere. Dreamweaver indeholder nogle grundlæggende billedredigeringsværktøjer, men for det meste bruger du Dreamweaver til at indsætte og placere billeder på din side.

Dreamweaver gør det nemt at placere billeder på dine websider og giver flere måder at gøre det på:

• Klik på ikonet Billeder i panelet Fælles Indsæt, og vælg derefter et billede ved hjælp af dialogboksen Indsæt billede.

• I panelet Filer skal du klikke og trække et billednavn til den side, hvor du vil have billedet vist.

• Brug menuen Indsæt.

Hvis du ikke har et weboptimeret JPEG-, GIF- eller PNG-billede ved hånden, kan du downloade gratis billeder , der allerede er optimeret.

Følg disse instruktioner for at placere et billede på en webside ved hjælp af menuen Indsæt:

Åbn en eksisterende side, eller opret og gem en ny side.

Placer din markør, hvor du vil indsætte billedet på siden.

Du kan indsætte billeder øverst til venstre i en ny tom fil, og du kan indsætte billeder i

tags og elementer på en webside, men du kan ikke bare placere et billede midt på en side uden at bruge yderligere HTML-tags eller CSS-formatering til at placere det.

Vælg Indsæt → Billede → Billede.

Dialogboksen Vælg billedkilde vises.

Gennemse for at finde det billede, du vil indsætte.

Afhængigt af dit computersystem kan du forhåndsvise billeder, mens du indsætter dem på forskellige måder. Her er tre almindelige muligheder:

• På en pc med Windows XP skal du vælge Miniaturer fra rullelisten Vis menu til højre for feltet Søg i for at få vist miniatureversioner af alle billederne i enhver åben mappe. Du kan også se en enkelt forhåndsvisning af ethvert valgt billede yderst til højre i dialogboksen.

• På en pc med Windows Vista eller Windows 7 skal du vælge en ikonindstilling (små ikoner, mellemstore ikoner, store ikoner eller ekstra store ikoner) fra rullelisten Vis menu til højre for feltet Søg i for at få vist miniatureversioner af alle billederne i enhver åben mappe. Du kan også se en enkelt forhåndsvisning af ethvert valgt billede yderst til højre i dialogboksen.

• På en Mac skal du vælge indstillingen Vis som kolonner øverst til venstre i dialogboksen. Du kan se en enkelt forhåndsvisning af ethvert valgt billede yderst til højre i dialogboksen.

  

  Kredit: Fotos af Casey Stoll

For at indsætte billedet skal du dobbeltklikke på billednavnet eller klikke én gang og derefter klikke på OK.

Hvis du indsætter et billede på en side, og billedet ikke er gemt i din lokale webstedsmappe, giver Dreamweaver dig en advarselsdialogboks og tilbyder at kopiere billedet til din lokale webstedsmappe. Mange designere opretter en undermappe kaldet billeder inde i den lokale webstedsmappe, hvor de gemmer alle billederne på deres websted, men du kan organisere billeder i flere undermapper, hvis du foretrækker det.

Vælg billedet på din webside for at se og redigere billedegenskaber.

Billedindstillinger vises automatisk i egenskabsinspektøren nederst på siden, når et billede er valgt.

Kredit: Foto af Casey Stoll

Når du indsætter en billedfil på en side, tilføjer du faktisk ikke en kopi af billedet til siden; du opretter en reference til billedet. Den underliggende kode ligner meget koden for et link fra en side til en anden.

Både billedreferencer og links inkluderer navnet på filen og stien fra siden til den pågældende fil. Grundlæggende opretter du en instruktion til en webbrowser for at finde billedet, når det viser siden.

For at vise et billede på din webside, skal du uploade både siden og billedet, når du udgiver din hjemmeside. Hvis dine billedfiler og siderne, der henviser til disse filer, ikke er på den samme relative placering på din harddisk, som de er på din webserver, bryder du referencen til dine billeder, og et grimt Broken Image-ikon vises på din side .

Den bedste måde at sikre, at dine billeder og filer forbliver, hvor de skal i forhold til hinanden, er at lade Dreamweaver holde styr på dem for dig. Det er derfor, det er så vigtigt at fuldføre webstedsopsætningsprocessen og sikre, at du aldrig flytter eller omdøber et billede, undtagen i panelet Filer.