Skapa en webbplats i Dreamweaver MX

Dreamweaver är en kraftfull professionell HTML-editor som skapar HTML, DHTML, CSS och javascript-kod. En av Dreamweaver's fördelar är att du kan hantera stora webbplatser med tusentals dokument och bilder. Du kan tex enkelt byta layout eller namn på länkar eller filer och programmet ser till att alla HTML-koder ändras i de berörda webbsidorna. Förutsättningen för att få en sådan dynamisk koppling mellan alla webbsidor i en webbplats är att du skapar en Site (Plats). I guiderna om Dreamweaver använder vi benämningarna webbsida och webbplats. Det förekommer flera benämningar på samma sak och vilken du använder avgör du själv:
webbsida (webbsida - hemsida - homepage - internetsida) = sidan som visas i webbläsaren
webbplats (webbplats - site - website - webbsajt) = en samling webbsidor

OBS! Om du använder Dreamweaver 4 ska du istället titta i guiden Skapa webbplats - grunderna i Dreamweaver 4 » som till skillnad från denna guide också omfattar grunderna i HTML » (punkt 3 och framåt) och beskrivningar av arbetsytan mm.

 

Skapa en webbplats med dialogrutan Avancerad (rekommenderas)

För att utnyttja Dreamweavers kraftfulla funktioner måste du ange vilka dokument och bilder som ingår i din webbplats. Det gör du i programdelen "Site" (Plats). I Site anger du vilken mapp som ska vara "root" (rotmapp). Det är den mapp som alla sökvägar i länkar bilder mm utgår ifrån. När du arbetar med din webbplats lokalt på din dator används de lokala hårddiskarna som sökvägar men när du senare publicerar webbplatsen till en webbserver måste sökvägarna vara relativa till ett domännamn eller IP-adress.

1. När du startar Dreamweaver MX första gången kommer du automatiskt in i guiden "Site definition" dit du även kommer genom att välja "Define a Site" (Definiera webbplats) i paletten "Site" (Plats). Du kan även använda huvudmenyerna "Site/New Site" (Plats/Ny plats):
   
   
   
2. Du kan välja att använda guiden "Basic" (Grundläggande) där du steg-för-steg får göra val eller att använda dialogrutan "Advanced" (Avancerat) där fler valmöjligheter finns. Det är egentligen enklare att välja det senare och det är inte så avancerat som det låter. Bägge metoderna beskrivs nedan men vi börjar med den enklaste (?) metoden och väljer fliken "Advanced" (Avancerat):
   
   
   
   Gå vidare med knappen "Next" (Nästa).
   
3. Sätt ett namn på din nya webbplats. OBS! Här kan du använda mellanslag och ÅÖÄåäö vilket inte rekommenderas för övriga filer i din webbplats. Detsamma gäller mappnamnet på huvudmappen "Local Root Folder" eftersom själva mappen inte publiceras senare utan bara mappens innehåll.
   
   Klicka på mappsymbolen för att välja vilken mapp som ska vara huvudmapp, rotmapp, eller ange sökvägen direkt. OBS! Använd inte en mapp som redan innehåller filer som inte ska tillhöra webbplatsen. Skapa hellre en ny mapp för ändamålet:
   
   
   
   Kontrollera att namnet och sökvägen stämmer till den mapp du valt som "root folder":
   
   
4. Om du vill ange inställningarna för den webbserver du tänker använda väljer du "Remote Info" (Fjärrinformation):
   
   
   Har du inte tillgång till en webbserver ännu hoppar du över detta steg, du kan komplettera uppgifterna senare.
   
5. Att arbeta med webbplatsen lokalt i dator och sedan skicka filerna till en webbserver är förmodligen den vanligaste metoden. Du kan jobba "skarpt" med dina filer men risken är då att det någon gång blir fel. Om du istället arbetar lokalt på din dator och sedan skickar filerna till webbservern när de är klara så har du ju alltid en säkerhetskopia om något blir fel...
   
   I exemplet är överföring via FTP valt vilket är den vanliga metoden för överföring till webbserver på tex ett webbhotell. Om du eller ditt företag har en egen webbserver väljer du att ange direkt sökväg eller IP-adress till webbservern istället.
   
   Ange de uppgifter du behöver för att logga in på webbservern: FTP-host (FTP-värd), Login (Användarnamn) och Password (Lösenord). Om du har hyrt in dig på ett webbhotell har du fått dessa uppgifter från webbhotellet:
   
   
   
   Host Directory (Värdkatalog) behöver normalt inte anges men på vissa webbservrar ligger din webbplats i en undermapp med namn som tex "www" eller "home" och du kan då istället ange mappnamnet i fältet här så lipper du bläddra varje gång du loggar in på webbservern...
   
   (Om du jobbar i nätverk eller har bredbandsuppkoppling kan du behöva ange uppgifter för "brandväggen" (Firewall) eller ange annan port än 21 som är standard. Välj då "Use Firewall" och klicka på knappen "Firewall settings...")
   
6. Om du bygger dina sidor med hjälp av scriptspråk som tex ASP, PHP, JSP eller ColdFusion kan typ av server som "Testing Server" (Test server). Om du inte använder annat än HTML-CSS etc hoppar du över detta val:
   
   

 

Skapa en webbplats med steg-för-steg-guiden

Vi rekommenderar att du anger dina egna inställningar i dialogrutan "Advanced" där du har bättre överblick. Om du ändå föredrar guiden gör du så här...

1. Se till att fliken "Basic" (Grundläggande) är valt och ange namnet på din webbplats:
   
   
   
   Gå vidare med knappen "Next" (Nästa)!
   
2. Om du bygger dina sidor med hjälp av scriptspråk som tex ASP, PHP, JSP eller ColdFusion kan typ av server som "Testing Server" (Test server). Om du inte använder annat än HTML-CSS väljer du enligt nedan:
   
   
   
   ...om du använder scriptspråk väljer du istället enligt nedan:
   
   
   
3. Att arbeta med webbplatsen lokalt i dator och sedan skicka filerna till en webbserver är förmodligen den vanligaste metoden. Du kan jobba "skarpt" med dina filer men risken är då att det någon gång blir fel. Om du istället arbetar lokalt på din dator och sedan skickar filerna till webbservern när de är klara så har du ju alltid en säkerhetskopia om något blir fel...
   Välj en befintlig mapp eller skapa en ny mapp som ska vara din huvudmapp (root folder). Klicka på mappsymbolen för att välja vilken mapp som ska vara huvudmapp, rotmapp, eller ange sökvägen direkt. OBS! Använd inte en mapp som redan innehåller filer som inte ska tillhöra webbplatsen. Skapa hellre en ny mapp för ändamålet:
   
   
   
   Kontrollera att namnet och sökvägen stämmer till den mapp du valt som "root folder".
   
4. I exemplet är överföring via FTP valt vilket är den vanliga metoden för överföring till webbserver på tex ett webbhotell. Om du eller ditt företag har en egen webbserver väljer du det alternativet istället.
   
   Ange de uppgifter du behöver för att logga in på webbservern: FTP-host (FTP-värd), Login (Användarnamn) och Password (Lösenord). Om du har hyrt in dig på ett webbhotell har du fått dessa uppgifter från webbhotellet:
   
   
   
   Det fält som är tomt ovan avser Host Directory (Värdkatalog) och behöver normalt inte anges men på vissa webbservrar ligger din webbplats i en undermapp med namn som tex "www" eller "home" och du kan då istället ange mappnamnet i fältet här så lipper du bläddra varje gång du loggar in på webbservern...
5. Om ni är flera som jobbar med samma webbplats finns risk att ni arbetar med samma filer och skriver över information som någon sánnan uppdaterat. Då finna möjlighet att Checka ut och Checka in filer.
   Checka in
   Skickar en kopia från din lokala webbplats till webbservern och gör filen tillgänglig för redigering av andra (den lokala filen blir i stället skrivskyddad).
   Checka ut fil
   Hämtar en kopia från webbservern till din lokala webbplats (den befintliga lokala filen skriv över) med de senaste uppdateringarna. Om du jobbar ensam med din webbplats behöver du inte använda funktionen:
   
   
   
6. Kontrollera dina uppgifter och särkilt att sökvägen till huvudmappen (Local Root folder) är korrekt:
   
   
   
   Avsluta med "Klart" (Done)!

Gå vidare och läs om grunderna i HTML i guiden Skapa webbplats i Dreamweaver 4 » (punkt 3 och framåt).

När du är färdig med din webbplats och det är dags att publicera filerna till din webbserver - läs mer i guiden Publicera webbplatsen »

 

Copyright © www.webdesignskolan.se
Materialet får skrivas ut och användas för personligt bruk.
Användning i undervisningssyfte är ej tillåten utan vårt tillstånd - läs mer här »