Hem Sociala medier Hur man lägger till bilder på din webbplats i Dreamweaver - dummies

Hur man lägger till bilder på din webbplats i Dreamweaver - dummies

Video: Bakgrundsbild i Photoshop till din webbsida i Dreamweaver med Distansskoan.se 2025

Video: Bakgrundsbild i Photoshop till din webbsida i Dreamweaver med Distansskoan.se 2025
Anonim

Att lägga till en bild på din webbsida kan tyckas nästan magisk först eftersom processen är så enkel med Dreamweaver. Utmaningen med webbgrafik lägger inte till dem på dina sidor men skapar snygga bilder som snabbt laddas i din tittarens webbläsare.

Du behöver ett annat program, till exempel Photoshop, Photoshop Elements eller Fireworks, för att skapa, konvertera, redigera och optimera bilder. Optimera bilder gör filstorlekar mindre så dina bilder hämtas snabbare. Dreamweaver ger några grundläggande verktyg för bildredigering, men oftast använder du Dreamweaver för att infoga och placera bilder på din sida.

Dreamweaver gör det enkelt att placera bilder på dina webbsidor och ger flera sätt att göra det:

  • Klicka på ikonen Bilder i panelen Vanlig inlägg och välj sedan en bild med dialogrutan Infoga bild.

  • I fönstret Filer klickar du på och drar ett bildnamn på den sida där du vill att bilden ska visas.

  • Använd menyn Infoga.

Om du inte har en webboptimerad JPEG, GIF eller PNG-bild, kan du ladda ner gratis bilder som redan är optimerade.

För att placera en bild på en webbsida med hjälp av menyn Infoga, följ dessa instruktioner:

  1. Öppna en befintlig sida eller skapa och spara en ny sida.

  2. Placera markören där du vill infoga bilden på sidan.

    Du kan infoga bilder längst upp till vänster om en ny blank fil och du kan infoga bilder i taggar och element på en webbsida, men du kan inte bara placera en bild mitt på en sida utan att använda ytterligare HTML taggar eller CSS-formatering för att placera den.

  3. Välj Infoga → Bild → Bild.

    Dialogrutan Välj bildkälla visas.

  4. Bläddra för att hitta bilden du vill infoga.

    Beroende på ditt datorsystem kan du förhandsgranska bilder när du sätter in dem på olika sätt. Här är tre vanliga alternativ:

    • På en dator med Windows XP, välj miniatyrer i listrutan Visa-menyn till höger om fönstret Look In för att visa miniatyrversioner av alla bilder i en öppen mapp. Du kan också visa en enda förhandsgranskning av vald bild längst till höger i dialogrutan.

    • På en dator med Windows Vista eller Windows 7 , välj ett ikonalternativ (Små ikoner, Mellansymboler, Större ikoner eller Extra stora ikoner) på rullgardinsmenyn Visa meny till höger om Look In fält för att visa miniatyrversioner av alla bilder i en öppen mapp. Du kan också visa en enda förhandsgranskning av vald bild längst till höger i dialogrutan.

    • På en Mac, välj alternativet Visa som kolumner längst upp till vänster i dialogrutan. Du kan visa en enda förhandsgranskning av vald bild längst till höger i dialogrutan.

      Kredit: Bilder från Casey Stoll
  5. För att infoga bilden, dubbelklicka på bildnamnet eller klicka en gång och klicka sedan på OK.

    Om du lägger in en bild i en sida och bilden inte sparas i din lokala sappsmapp, frågar Dreamweaver dig med en varningsdialogruta och erbjuder att kopiera bilden till din lokala webbplatsmapp. Många designers skapar en undermapp som heter bilder inuti den lokala webbplatsmappen där de lagrar alla bilder på deras webbplats, men du kan organisera bilder i flera undermappar om du föredrar det.

  6. Välj bild på din webbsida för att visa och redigera bildegenskaper.

    Bildalternativ visas automatiskt i egenskapsinspektören längst ner på sidan när en bild väljs.

    Kredit: Foto av Casey Stoll

När du lägger in en bildfil på en sida lägger du inte till en kopia av bilden till sidan. du skapar en hänvisning till bilden. Den underliggande koden ser ungefär ut som koden för en länk från en sida till en annan.

Både bildreferenser och länkar innehåller namnet på filen och sökvägen från sidan till den filen. I huvudsak skapar du en instruktion för en webbläsare för att hitta bilden när den visar sidan.

För att visa en bild på din webbsida måste du ladda upp både sidan och bilden när du publicerar din webbplats. Om dina bildfiler och sidorna som refererar till dessa filer inte befinner sig i samma relativa plats på hårddisken som de är på din webbserver, bryter du upp referensen till dina bilder och en grym Broken Image-ikon visas på din sida.

Det bästa sättet att se till att dina bilder och filer stannar var de ska vara i förhållande till varandra är att låta Dreamweaver hålla reda på dem för dig. Därför är det så viktigt att du slutför installationsprocessen och säkerställ att du aldrig flyttar eller byter namn på en bild, utom i filpanelen.

Hur man lägger till bilder på din webbplats i Dreamweaver - dummies

Redaktörens val

Office 365 Grupper - Dummies

Office 365 Grupper - Dummies

Du kan använda Office 365 Grupper, eller helt enkelt grupper, för att snabbt bandet tillsammans med medarbetare till samarbeta utan administrationsansvar som följer med en SharePoint-webbplats. Grupper är inte en del av SharePoint Online. Det är faktiskt en funktion i Exchange Online, men den använder SharePoint Online-funktioner, till exempel OneDrive for Business för att lagra gruppfiler ...

Office 365 Mobil Dokument i molnet - Dummies

Office 365 Mobil Dokument i molnet - Dummies

Varje Office 365-abonnent med en kvalificerad plan kan installera Office mobilappar på upp till fem tabletter och fem smartphones. Kvalificeringsplanerna är: Office for Business Premium, Office 365 Business, Office 365 Pro Plus, Office 365 E3 och Office 365 E5. Kärnan Office-appar finns i Windows, iOS och Android ...

Office Graph och Delve - dummies

Office Graph och Delve - dummies

Office Graph i Office 365 ger en möjlighet för människor att dra nytta av relationer och aktiviteter och göra dem till meningsfulla insikter. De signaler du skickar från e-postkonversationer och möten i Outlook, snabbmeddelanden i Skype for Business, sociala interaktioner på Yammer och dokument i SharePoint Online och OneDrive samlas alla och ...

Redaktörens val

Elektronik Komponenter: Sätt in induktorer till arbete - dummies

Elektronik Komponenter: Sätt in induktorer till arbete - dummies

Om du har undrat vad induktorer används egentligen i elektroniska kretsar i verkligheten, här är några av de vanligaste användningarna för induktorer: Utjämning av spänning i en strömförsörjning: Det sista steget i en typisk strömförsörjningskrets som omvandlar 120 VAC hushållsström till en användbar direkt Nuvarande är ofta en ...

Elektronik Komponenter: Introduktion av mikrokontroller - dummies

Elektronik Komponenter: Introduktion av mikrokontroller - dummies

En mikrokontroller är en komplett dator på en enda elektronisk chip. De kan köpas för $ 50 eller mindre. Liksom alla datorsystem består mikrodatorer av flera grundläggande delsystem: Central Processor (CPU): En CPU utför de instruktioner som tillhandahålls av ett program. CPU kan göra alla nödvändiga åtgärder för ...

Elektronik Komponenter: Motstånd Power Ratings - dummies

Elektronik Komponenter: Motstånd Power Ratings - dummies

Motstånd är som bromsar för ström som strömmar genom en elektronisk krets. Liksom bromsarna i din bil arbetar motstånd genom att använda den elektriska ekvivalenten av friktion till strömningsströmmen. Denna friktion hämmar strömmen av ström genom att absorbera en del av strömens energi och sprida den i form av värme. När du använder en ...

Redaktörens val

Hur man konfigurerar SSH för din webbplats - dummies

Hur man konfigurerar SSH för din webbplats - dummies

Secure shell (SSH) är ett nätverksprotokoll för att tillåta säker datakommunikation. I själva verket är det som en webbhotell bakdörr i ditt system - en som borde förbli låst om du inte behöver använda den. Naturligtvis är exakt hur du konfigurerar SSH olika på alla typer av webbhotell, men som ...

Hur man skapar en ny webbhotell - dummies

Hur man skapar en ny webbhotell - dummies

Du måste skapa din databas inom din webbhotellskontrollpanel och skapa en speciell databasanvändare som har behörighet att komma åt den. När du installerar en webbapplikation eller ett skript som kräver en databas från kontrollpanelen, kommer installationsprogrammet sannolikt att kunna skapa en egen databas och användare. ...

Hur man skapar nya konton på webbhotell med FTP-dummies

Hur man skapar nya konton på webbhotell med FTP-dummies

Du kanske vill att skapa ytterligare konton på en webbhanterad ftp av olika orsaker. Detta möjliggör viss mångsidighet och kontroll för att förbättra din företagsfunktionalitet. Några skäl till att lägga till ett konto är följande: Du vill ge någon annan FTP-åtkomst till din webbplats. Du vill ge någon FTP-åtkomst ...