Dreamweaver 8
fortsättningskurs
Lektion 1
Webbplatsens layout
Mahmud Al Hakim
[email protected]
www.hakimdata.se
1
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Agenda
Introduktion
12.30 – 13.30
Platshantering och FTP
Felsökning
13.30 – 13.45
Rast
13.45 – 14.45
Dreamweaver Mallar (Templates)
2
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Kursplanering
Lektion Datum
Innehåll
2008-04-14
Platshantering och FTP
Felsökning
Dreamweaver Mallar (Templates)
2008-04-21
Flash-knappar, roll-over bilder
Java Applets
CSS-mallar
Bibliotek
3
2008-04-28
Ramar
Navigeringsfält,Animerade menyer
Lager (Layers)
4
2008-05-05
Formulär, Validering
Extensions
2008-05-12
JavaScript
Beteenden (Behaviors)
Snippets
1
2
5
3
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Referenslitteratur 1
Dreamweaver 8 Help, Macromedia 2005
4
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Referenslitteratur 2
Webdesignskolan.com (Dreamweaverskolan)
5
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Referenslitteratur 3
Dreamweaver 8 Bible
6
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Referenslitteratur 4
Dreamweaver 8 All-in-One Desk Reference For Dummies
7
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Skolans datorer
Intel Core 2 Duo (2 GHz), 1 GB minne
Grafik: Radeon X1600 256 MB
17" WSXGA brightview
CD/DVD brännare, USB 2 (4st), FireWire 400 (1st)
Inbyggd WLAN upp till 20 Mbit/s
HDD 100 GB - Allt sparas lokalt på datorn och kopieras över till nätverket vid
lektionens slut.
Tips: Spara en kopia på ett USB-minne.
Kortläsare: Digital-, MultiMediaCard-, Memory Stick-, Stick Pro- eller Stick
Duo-, Smart Media- och SD-minneskort
Observera att du inte är garanterad samma dator vid
varje kurstillfälle.
8
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Platshantering
9
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Övning: Skapa en webbplats (Site)
Skapa en ny webbplats (Site) i Dreamweaver
Ange en titel (t.ex. DW8)
Webbplatsens root ska vara public_html
Webbplatsens bildmapp ska vara ”images” och ska ligga
direkt under rooten.
Alla interna länkar ska vara relativa till dokumentet.
Använd skriftlägeskänsliga länkar (case-sensitive links).
Skapa en webbsida och spara den som index.html
1
0
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Att överföra filer till webbserver med FTP
1
1
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Expandera FTP-klienten
1
2
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Övning: Publicera via FTP
Publicera webbplatsen till ”din” FTP-server!
Öppna den publicerade webbplatsen via en webbläsare.
Om du inte har något FTP server använd följande
ftp.hakimdata.se
Konto: [email protected]
Lösenord: guest
(obs! kontot är begränsad till max 10MB)
1
3
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Övning: Visa HTML-kod och
Panelen History
Skapa en ny webbsida.
Klicka på ”Split” i verktygsfältet ”Document”.
Skriv ditt namn och klicka på retur.
Skriv gatuadress och klicka på Shift+Retur
Skriv postadressen och klicka på Retur
Undersök HTML-koden!
1
4
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Panelen History
1
5
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Övning: Skapa följande Site
16
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Kontrollera länkar
17
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Kontrollera kompatibilitet
18
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Validera webbplatsen
19
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Skapa rapporter
20
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Templates (mallar)
Med mallar (templates) menas webbsidor som är mer eller
mindre formaterade och som ligger till grund för dina
webbsidor.
Med mallar kan du styra delar av webbplatsens utseende på
ett enkelt sätt.
Mallarna innehåller instruktioner om hur delarna ska
formateras.
Du kan antingen använda mallar som redan finns i
Dreamweaver, ladda ner mallar eller skapa egna.
21
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Använd befintliga DW-mallar
22
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Ladda ner Dreamweaver mallar från
www.adobe.com
23
http://www.adobe.com/products/dreamweaver/download/templates/
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Sök efter flera DW mallar
24
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Dreamweaver-templates.org
25
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Att skapa egna DW-mallar
Steg 1: Skapa en mall
Steg 2: Ange ändringsbara områden
Steg 3: Spara mallen
Steg 4: Skapa sidor som bygger på mallen.
26
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Steg 1: Skapa en mall
27
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Steg 2
Ange ändringsbara områden
28
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Steg 3: Spara mallen
Observera
filnamnstillägget
dwt
29
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Steg 4
Skapa en sida som bygger på mallen
30
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
En mallövning
Steg 1. Skapa en mall till en ny site
Steg 2. Ange ett ändringsbart område
Steg 3. Spara som en_mall.dwt
Ett ändringsbart
område
31
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Steg 4. Skapa en sida som bygger på mallen
Spara som index.html
32
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Skapa en ny sida som bygger på mallen
Spara som kontakt.html
33
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Öppna mallen och gör några ändringar.
Spara mallen och observera dialogrutan
”Update Template Files”
34
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
Spara alla sidor och granska i en webbläsare!
Ändringarna appliceras på alla sidor i siten!
Mallar är ett
kraftfullt verktyg i
Dreamweaver
eller hur!
35
Copyright, www.hakimdata.se, Mahmud Al Hakim, [email protected], 2008
