Bài giảng môn Thiết kế web - Phần 4: MacroMedia Dreamweaver

Bài Gi ng Môn Thi t K Web<br /> <br /> Ph n 4: MacroMedia DreamWeaver<br /> <br /> Chương 01<br /> <br /> T NG QUAN V MACROMEDIA DREAMWEAVER<br /> Sơ lư c v Macro Media Dreamweaver<br /> Màn hình làm vi c<br /> nh nghĩa Site<br /> S d ng b ng i u khi n Site<br /> <br /> I. Sơ Lư c V Dreamweaver<br /> Là m t chương trình dùng<br /> t o ra và qu n lý các trang web. Ph n c t lõi c a nó là<br /> HTML (HyperText Markup Language - Ngôn ng<br /> ánh d u siêu văn b n)<br /> Là m t công c m nh, d dùng, m t công c tr c quan: Có th b sung Javascrip,<br /> bi u m u, b ng bi u và nhi u lo i i tư ng khác mà không c n ph i vi t 1 dòng mã nào.<br /> Cung c p ch<br /> làm vi c Design WYSIWYG (nh ng gì th y là nh ng gì có ư c).<br /> và ch<br /> làm vi c mã –Code.<br /> II. Màn Hình Làm Vi c<br /> 1. Kh i<br /> <br /> ng:<br /> <br /> Start<br /> <br /> Programs<br /> <br /> Create New<br /> <br /> MacroMedia<br /> <br /> MacroMedia DreamWeaver MX 2004<br /> <br /> HTML<br /> <br /> 2. Màn hình làm vi c<br /> 2.Thanh trình ơn<br /> 3.Thanh công c<br /> <br /> 1.Thanh tiêu<br /> 7. B ng i u khi n<br /> <br /> Insert<br /> <br /> 4.Thanh công c Document<br /> <br /> Vùng thi t k<br /> <br /> 5.Thanh tr ng thái<br /> <br /> 6.C a s thu c tính<br /> <br /> 1. Thanh tiêu<br /> <br /> : Ch a tên t p tin ang thi t kê<br /> <br /> Biên so n: D

ng Thành Ph t<br /> <br /> Trang 78<br /> <br /> Bài Gi ng Môn Thi t K Web<br /> <br /> Ph n 4: MacroMedia DreamWeaver<br /> <br /> 2. Thanh trình ơn: Ch a các t p lênh th c hi n các ch c năng<br /> 3. Thanh công c Insert: Ch a nhóm các công c t o và<br /> <br /> nh d ng các<br /> <br /> i tư ng.<br /> <br /> 4. Thanh công c Document: Các hình th c trình bày trang ang thi t k<br /> 5. Thanh tr ng thái: Báo khu v c trên trang ang ch n làm vi cvà kích thư c trang.<br /> 6. C a s thu c tính(Properties):Các thu c tính c a<br /> <br /> I tương ang<br /> <br /> ư c ch n.<br /> <br /> 7. B ng i u khi n: Trình bày các b ng i u khi n<br /> III.<br /> <br /> nh Nghĩa Site<br /> <br /> 1. Khái quát<br /> Site là vùng lưu tr c c b trên máy tính ch a các t p tin c a 1 website bao g m<br /> các thư m c con ch a các t p tin âm thanh, hình nh . . .<br /> 2. Thi t L p C u Trúc Site<br /> Vi c t ch c site c n th n ngay t lúc<br /> u s ti t ki m th i gian v sau. Thông<br /> thư ng<br /> xác l p 1 site là t o 1 thư m c g c trong ĩa c c b ch a t t c các file trong web<br /> site, sau ó sao chép các file này n web server<br /> 3. T o M I Site<br /> Ch n menu Site / Manage Sites<br /> <br /> New / Site<br /> <br /> H p tho i Site Definition for Unnamed Site 1 hi n th , có hai l p (Basic và<br /> Advanced). L p Advanced trình bày t ng quát, còn l p Basic trình bày d ng t ng bư c (s<br /> không có s khác bi t nhau gi a hai l p này.)<br /> Xét l p Advanced<br /> <br /> 1<br /> <br /> 2<br /> 3<br /> 4<br /> 5<br /> <br /> 6<br /> <br /> Biên so n: D

ng Thành Ph t<br /> <br /> Trang 79<br /> <br /> Bài Gi ng Môn Thi t K Web<br /> <br /> Xác<br /> <br /> Ph n 4: MacroMedia DreamWeaver<br /> <br /> nh các m c trong h p tho i:<br /> <br /> •<br /> <br /> [1] Site name: Nh p tên cho site (VD: CLBTinHoc)<br /> <br /> •<br /> <br /> [2] Local Root Folder: Xác<br /> <br /> •<br /> <br /> [3] Refresh Local File List Automaticaly: T<br /> t p tin có liên quan trong local site hay không.<br /> <br /> •<br /> <br /> [4] Default Images Folder: Ch<br /> site.<br /> <br /> •<br /> <br /> nh thư m c trên<br /> <br /> ng tinh ch nh m i khi thay<br /> <br /> nh thư m c m c<br /> <br /> nh lưu tr<br /> <br /> I các<br /> <br /> các t p tin nh trong<br /> <br /> [5] Cache: Ch nh Cache c c b có ư c t o hay không<br /> c i thi n t c<br /> liên k t<br /> và qu n lý tài nguyên c a site. Khuyên nên ch n m c này, tuy nhiên n u máy không<br /> b nh RAM có th b qua tùy ch n này.<br /> <br /> Xác nh xong các m c trong h p tho i, click OK<br /> Sites click Done<br /> <br /> IV. S<br /> <br /> ĩa c c b nơi lưu tr các t p tin.<br /> <br /> t o site<br /> <br /> Tr v c a s<br /> <br /> Manage<br /> <br /> D ng B ng i u Khi n Site<br /> <br /> 1. B ng i u khi n Site<br /> S d ng c a s Site cho các thao tác qu n lý t p tin trong Site như: t o trang HTML ,<br /> xem, m và di chuy n; t o các thư m c và xóa các thư m c.<br /> m b ng i u khi n Site trong nhóm các b ng i u khi n ch n Files<br /> <br /> 2. Các thao tác qu n lý Local Site<br /> Các thao tác qu n lý thư m c và t p tin t I c a s Local Site ư c ánh x tr c ti p<br /> thư m c trong ĩa c ng.<br /> <br /> n cây<br /> <br /> a. T o thư m c trong Site<br /> Click ph i tên site(Ho c thư m c) mu n t o thư m c con<br /> New Folder<br /> <br /> Nh p tên<br /> <br /> b. T o t p tin HTML trong Site<br /> Click ph I tên site(Ho c thư m c) ch a trang HTML<br /> <br /> Biên so n: D

ng Thành Ph t<br /> <br /> Trang 80<br /> <br /> Bài Gi ng Môn Thi t K Web<br /> <br /> New File<br /> c.<br /> <br /> Ph n 4: MacroMedia DreamWeaver<br /> <br /> Nh p tên.<br /> <br /> i tên Thư m c ho c t p tin<br /> <br /> Click ph I tên thư m c(Ho c t p tin )<br /> <br /> Edit<br /> <br /> Rename<br /> <br /> Nh p tên khác.<br /> d. Nhân ôi t p tin<br /> Click ph i tên t p tin<br /> <br /> Edit<br /> <br /> Duplicate<br /> <br /> Nh p tên khác.<br /> <br /> e. Xóa thư m c t p tin HTML<br /> Click ph I tên t p tin(ho c thư m c)<br /> <br /> Biên so n: D

ng Thành Ph t<br /> <br /> Edit<br /> <br /> Delete<br /> <br /> Trang 81<br /> <br /> Bài Gi ng Môn Thi t K Web<br /> <br /> Ph n 4: MacroMedia DreamWeaver<br /> <br /> Chương 02<br /> <br /> THI T K TRANG WEB<br /> Các thao tác qu n lý trang Web<br /> Thi t l p các thu c tính trang<br /> T o và nh d ng văn b n<br /> T p tin hình nh<br /> T p tin Media<br /> T p tin Flash<br /> I. Các Thao tác Qu n Lý Trang Web<br /> Khi ã t o 1 site c c b , ta có th t o các trang web<br /> ưa vào site. Khi t o và làm<br /> vi c v i các trang web, Dreamweaver s t<br /> ng phát sinh mã ngu n HTML.<br /> Có các cách khác nhau<br /> trang web m u (template)<br /> <br /> t o: T o m i trang web tr ng hay t o m i d a vào các<br /> <br /> 1. T o m i trang tài li u:<br /> Ch n menu File / New<br /> <br /> H p tho i New Document hi n th ,<br /> <br /> Ch n l p General, ch n Basic page ch n ki u d ng HTML. Nh n vào nút Create,<br /> <br /> 2. Lưu m t trang tài li u:<br /> •<br /> <br /> Ch n menu l nh File / Save<br /> <br /> •<br /> <br /> Nh p tên cho t p tin và ch n thư m c ch a t p tin c n lưu.<br /> <br /> •<br /> <br /> Click nút Save<br /> <br /> lưu .<br /> <br /> N u mu n lưu t p tin v i tên khác,<br /> ch n menu l nh File / Save as . .<br /> <br /> 3. M m t t p tin HTML ang t n t i:<br /> Ch n menu File / Open, ch n file c n m và nh n Open<br /> Biên so n: D

ng Thành Ph t<br /> <br /> m .<br /> Trang 82<br /> <br />