Sådan indsætter du billeder i Dreamweaver - dummies

Dreamweaver's minimalistiske billedredigeringsværktøjer giver dig mulighed for at udføre rudimentær billedredigering, f.eks. resizing og beskæring. Du finder disse værktøjer i Egenskabsinspektøren.

Du opretter ikke billeder i Dreamweaver. Til det giver Adobe Illustrator (til illustrationer, grafisk tekst, sidebakgrundsbilleder, navigation ikoner osv.) og Photoshop (til forberedelse af billeder til internettet) samt andre værktøjer. Som hovedregel skal du holde dig til at forberede billeder til internettet i disse programmer.

For at indsætte billeder skal du sørge for at du arbejder i designvisning (eller i splitvisning med markøren i vinduets designside). Du har to grundlæggende stier: Indsæt fra din maskine eller brug en kopi- og -paste teknik. I begge tilfælde skal du være i Design visning (vælg Vis → Design; eller, for Split visning, vælger e Vis → Kode og Design) for at se billeder, som du indsætter eller indlejrer dem.

Chancerne er den HTML-side, hvor du indlejrer et billede, vil have noget tekst på det. Så det første skridt er at finde ud af, hvor du vil have billedet til at dukke op.

I modsætning til printdesign er billeder i websider ikke placeret på bestemte steder. Det kører designere nødder.

Følg disse trin for at indsætte en billedfil fra din computer til en åben HTML-webside i Dreamweaver:

1. Klik i dokumentvinduet på det sted, hvor billedet skal indsættes.

   I dette trin finder du hvor i din HTML kode billedet indsættes. Igen, hvor og hvordan billedet vises vil blive defineret med CSS.

2. Vælg Indsæt → Billede.

3. I dialogboksen Vælg billedkilde, der åbnes, skal du navigere til og vælge en hvilken som helst fil på din computer.

   Hvis det billede, du vælger, er uden for dit websted mappe, vises en nyttig dialogboks, hvor du bliver bedt om at gemme en kopi af billedet til din Dreamweaver-webstedets rodmappe.

   

   1. Klik på Ja.

   2. Klik på Gem i dialogboksen Kopier fil som.

4. Definer tilgængelighedsattributter.

   Som standard vises dialogboksen Dreamweaver Image Tag Accessibility Attributes, før et billede endelig indsættes på en side.

   Feltet Alternativ tekst er det vigtigste af de to muligheder i denne dialogboks. Den viser tekst, der læses højt i læserprogrammet til synshandicappede besøgende, og det vises også i browsermiljøer, hvor billedvisning er deaktiveret. Alternativ tekst kan og ofte skal indeholde store og små bogstaver, mellemrum og specialtegn.

   

   Hvis synshæmmede besøgende eller personer i browsermiljøer, der ikke understøtter billeder, er en del af din målgruppe, kan du overveje at oprette HTML-filer med mere omfattende billedbeskrivelser.Sådanne filer er knyttet til billedet ved at definere et link i feltet Lang beskrivelse i dialogboksen Billedmærke tilgængelighedskendetegn.

5. Klik på OK for at indsætte billedet.

På dette tidspunkt har du kun indsat billedet. Side design, herunder at placere billeder og flydende tekst omkring dem, styres med CSS