Hur man sätter in bilder i Dreamweaver - dummies

Dreamweavers minimalistiska bildredigeringsverktyg gör det möjligt för dig att utföra rudimentär bildredigering, till exempel ändra storlek och beskärning. Du hittar de här verktygen i Egenskapsinspektionen.

Du skapar inte bilder i Dreamweaver. Därefter ger Adobe Illustrator (för konstverk, grafisk text, sidbakgrundsbilder, navigering ikoner och så vidare) och Photoshop (för att förbereda bilder på webben), liksom andra verktyg. Som en allmän regel håller du dig med att förbereda bilder för webben i de här programmen.

För att infoga bilder, se till att du arbetar med Designvy (eller, i Split-vy med markören i fönstret Design). Du har två grundläggande vägar: Sätt in från din maskin eller använd en kopia -Paste-teknik. I båda fallen måste du vara i Design-vy (välj Visa → Design, eller, för Split-vy, väljer e Visa → Kod och Design) för att se bilder som du klistar in eller bäddar in dem.

Chansen är den HTML-sida som du lägger i en bild kommer att ha lite text på den. Så det första steget är att ta reda på var du vill att bilden ska visas.

Till skillnad från utskriftsdesign placeras bilder på webbsidor inte på specifika platser. Det driver designernötter.

Följ så här för att infoga en bildfil från din dator till en öppen HTML-webbsida i Dreamweaver:

1. Klicka i dokumentfönstret vid den punkt där bilden ska infogas.

   I det här steget hittar du var i HTML-koden ska bilden läggas in. Återigen, var och hur bilden visas kommer att definieras med CSS.

2. Välj Infoga → Bild.

3. I dialogrutan Välj bildkälla som öppnas navigerar du till och väljer vilken fil som helst på din dator.

   Om den bild du väljer är utanför din webbplatsmapp visas en användbar dialogruta där du uppmanas att spara en kopia av bilden till din Dreamweaver-webbplatsens rotmapp.

   

   1. Klicka på Ja.

   2. Klicka på Spara i dialogrutan Kopiera fil som.

4. Definiera tillgänglighetsattribut.

   Som standard visas dialogrutan Dreamweaver Image Tag Accessibility Attribut innan en bild slutligen läggs in på en sida.

   Alternativtextfältet är det viktigaste av de två alternativen i den här dialogrutan. Den visar text som läses högt i läsarprogrammet för synskadade besökare, och även det som visas i webbläsarmiljöer där bildvisning är inaktiverad. Alternativ text kan och bör ofta innehålla versaler och små bokstäver, mellanslag och specialtecken.

   

   Om synvisade besökare eller personer i webbläsarmiljöer som inte stöder bilder är en del av din målgrupp, kan du överväga att skapa HTML-filer med mer omfattande bildbeskrivningar.Sådana filer är länkade till bilden genom att definiera en länk i rutan Lång beskrivning i dialogrutan Bildmärknings tillgänglighetsegenskaper.

5. Klicka på OK för att infoga bilden.

Här har du bara satt in bilden. Siddesign, inklusive att placera bilder och flödande text runt dem, hanteras med CSS