BÀI GIẢNG MÔN THIẾT KẾ WEB_6 doc

BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
7
77
78
88
8

Chương01
TỔNGQUANVỀMACROMEDIADREAMWEAVER
 SơlượcvềMacroMediaDreamweaver
 Mànhìnhlàmviệc
 ĐịnhnghĩaSite

SửdụngbảngđiềukhiểnSite

I.SơLượcVềDreamweaver


Làmộtchươngtrìnhdùngđểtạoravàquảnlýcáctrangweb.Phầncốtlõicủanólà
HTML(HyperTextMarkupLanguage-Ngônngữđánhdấusiêuvănbản)
Làmộtcôngcụmạnh,dễdùng,mộtcôngcụtrựcquan:CóthểbổsungJavascrip,
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.
CungcấpchếđộlàmviệcDesignWYSIWYG(nhữnggìthấylànhữnggìcóđược).
vàchếđộlàmviệcmã–Code.
II.MànHìnhLàmViệc
1.Khởiđộng:
StartProgramsMacroMediaMacroMediaDreamWeaverMX2004
CreateNewHTML

2.Mànhìnhlàmviệc

1. Thanhtiêuđề:Chứatêntậptinđangthiếtkê
1.Thanhtiêuđ
ề

2.Thanhtrình
đơn

3.Thanhcôngc
ụInsert

4.ThanhcôngcụDocument
7.B
ảngđiềukhiển

5.Thanhtrạngthái
6.Cửasổthuộctính
Vùngthi
ếtkế

This is trial version
www.adultpdf.com
BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
7
77
79

99
9

2. Thanhtrìnhđơn:Chứacáctậplênhthựchiệncácchứcnăng
3. ThanhcôngcụInsert:Chứanhómcáccôngcụtạovàđịnhdạngcácđốitượng.
4. ThanhcôngcụDocument:Cáchìnhthứctrìnhbàytrangđangthiếtkế
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.
6. Cửasổthuộctính(Properties):CácthuộctínhcủađốItươngđangđượcchọn.
7. Bảngđiềukhiển:Trìnhbàycácbảngđiềukhiển
III.ĐịnhNghĩaSite
1.Kháiquát
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
cácthưmụcconchứacáctậptinâmthanh,hìnhảnh...
2.ThiếtLậpCấuTrúcSite
Việc tổ chức site cẩn thận ngay từ lúc đầu sẽ tiết kiệm thời gian về sau. Thông
thườngđể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
site,sauđósaochépcácfilenàyđếnwebserver
3.TạoMớISite
ChọnmenuSite/ManageSitesNew/Site

Hộp thoại Site Definition for Unnamed Site 1 hiển thị, có hai lớp (Basic và
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ẽ
khôngcósựkhácbiệtnhaugiữahailớpnày.)
XétlớpAdvanced

1

2

3

4

5

6

This is trial version
www.adultpdf.com
BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
8
88
80
00
0

Xácđịnhcácmụctronghộpthoại:
•
[1]Sitename:Nhậptênchosite(VD:CLBTinHoc)
•
[2]LocalRootFolder:Xácđịnhthưmụctrênổđĩacụcbộnơilưutrữcáctậptin.
•
[3]RefreshLocalFileListAutomaticaly:TựđộngtinhchỉnhmỗikhithayđổIcác
tậptincóliênquantronglocalsitehaykhông.
•
[4]DefaultImagesFolder:Chỉđịnhthưmụcmặcđịnhlưutrữcáctậptinảnhtrong
site.

•
[5]Cache:ChỉđịnhCachecụcbộcóđượctạohaykhôngđểcảithiệntốcđộliênkết
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
đủbộnhớRAMcóthểbỏquatùychọnnày.
Xácđịnhxongcácmụctronghộpthoại,clickOKđểtạositeTrởvềcửasồManage
SitesclickDone

IV.SửDụngBảngĐiềuKhiểnSite
1.BảngđiềukhiểnSite
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,
xem,mởvàdichuyển;tạocácthưmụcvàxóacácthưmục.
ĐểmởbảngđiềukhiểnSitetrongnhómcácbảngđiềukhiểnchọnFiles

2.CácthaotácquảnlýLocalSite
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đấncây
thưmụctrongđĩacứng.
a.TạothưmụctrongSite
Clickphảitênsite(Hoặcthưmục)muốntạothưmụccon
NewFolderNhậptên
b.TạotậptinHTMLtrongSite
ClickphảItênsite(Hoặcthưmục)chứatrangHTML
This is trial version
www.adultpdf.com
BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
8
88
81

11
1

NewFileNhậptên.
c.ĐổitênThưmụchoặctậptin
ClickphảItênthưmục(Hoặctậptin)EditRename
Nhậptênkhác.
d.Nhânđôitậptin
ClickphảitêntậptinEditDuplicateNhậptênkhác.
e.XóathưmụctậptinHTML
ClickphảItêntậptin(hoặcthưmục)EditDelete



This is trial version
www.adultpdf.com
BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
8
88
82
22
2

Chương02

THIẾTKẾTRANGWEB
 CácthaotácquảnlýtrangWeb
 Thiếtlậpcácthuộctínhtrang
 Tạovàđịnhdạngvănbản
 Tậptinhìnhảnh
 TậptinMedia
 TậptinFlash
I.CácThaotácQuảnLýTrangWeb
Khiđãtạo1sitecụcbộ,tacóthểtạocáctrangwebđểđưavàosite.Khitạovàlàm
việcvớicáctrangweb,DreamweaversẽtựđộngphátsinhmãnguồnHTML.
Cócáccáchkhácnhauđểtạo:Tạomớitrangwebtrốnghaytạomớidựavàocác
trangwebmẫu(template)
1. Tạomớitrangtàiliệu:
ChọnmenuFile/New

HộpthoạiNewDocumenthiểnthị,
ChọnlớpGeneral,chọnBasicpagechọnkiểudạngHTML.NhấnvàonútCreate,

2. Lưumộttrangtàiliệu:
•
ChọnmenulệnhFile/Save
•
Nhậptênchotậptinvàchọnthưmụcchứatậptincầnlưu.
•
ClicknútSaveđểlưu.
Nếumuốnlưutậptinvớitênkhác,
chọnmenulệnhFile/Saveas..

3. MởmộttậptinHTMLđangtồntại:
ChọnmenuFile/Open,chọnfilecầnmởvànhấnOpenđểmở.

This is trial version
www.adultpdf.com
BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
8
88
83
33
3

II.ThiếtLậpThuộcTínhTrang
Tiêuđềtrang,ảnhvàmàunền,màuvănbảnvàliênkết,cáclềvàcácthuộctínhcơ
bảncủatrangweb.
•
ChọnmenuModify/PageProperties...Hoặcclickchuộtphảitrêntrêntrangđang
thiếtkếchọnPageProperties...
•
HộpthoạiPagePropertieshiểnthị:
1.Thuộctínhchungchotrang:LớpAppearance

(1)-PageFont:Fontchữmặcđịnhchotrang
(2)-Size:Cỡchữmặcđịnhchotrang
(3)-Textcolor:Màuchữmặcđịnhchotrang
(4)-Backgroundcolor:Màunềntrang
(5)-BackGroundImage:Ảnhnềnchotrang(ẢnhphảInằmtrongthưmụccủaSite)
(6)-Left/Right/Top/BottomMargin:Lềtrang
2.Cácthuộctínhchungcholiênkết:LớpLink


 (1)-LinkFont:Fontchữchovănbảnliênkết
 (2)-Size:Cỡchữchovănbảnliênkết
 (3)-Linkcolor:Màuchữchovănbảnliênkết
 -Visitedlinks:Màuchữchovănbảnliênkếtkhiđãviếngthăm
 -Rolloverlinks:Màuchữchovănbảnliênkếtkhirêchuộtqua
 -Activelinks:MàuchữchovănbảnliênkếtkhiClickchuột
(4)-Underlinestyle:Kiểugạchchânchovănbảnliênkết
  +Never....:Khôngbaogiờcógạchchân
1

2

3

4

5

6

1

2

3

4

This is trial version
www.adultpdf.com

BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
8
88
84
44
4

  +Always...:Luôncógạchchân
  +Show....:Hiệnthịđườngkẽngangkhirêchuộtvào
  +Hide.....:Ẩngạchchânkhirêchuộtvào
3.Tạomẫuvănbảnđềmục:LớpHeadings
Tạocácmẫuvănbảnđềmục(Heading1,...)đểdùngkhiđịnhdạng.

4.Tiêuđềtrang:ChọnmụcTitle/Encoding

Title:Nhậptiêuđềchotrangvàomục.
Encoding:ChọnUTF-8(nếutrêntrangcósửdụngvănbảnUniode)
III.TạoVàĐịnhDạngVănBản
ViệcnhậpvàđịnhdạngvănbảntrongDreamweaverMXhoàntoàngiốngnhưtrình
soạnthảovănbảnthôngthường.
1.Tạovàđịnhdạngvănbản
•
NhậpvănbảntrựctiếptrongcửasổDocument.
•
ĐểthayđổiFont,kíchthước,màusắcvàsựcanhlềchocácvănbảnđượcchọncó
thểsửdụngtrìnhđơnTexthoặctruycậpcácthuộctínhtrênProperties.


ĐểnhậpvănbảntiếngViệt,nênsửdụngcácfontvàbảngmãtươngứng.Thông
thườngnênsửdụngfonttheomãUnicodeđểcóthểxemtrênmọimáy.
2.ThiếtlậpvàthayđổicácFontvàStyle:
•
Chọnvănbản.
•
Thiếtlậpcáctùychọnsau:
o
ĐểthayđổiFont:ChọntổhợpfonttừProperties(HaytừmenuText/Font)
o
ĐểthayđổikiểuFont:ClickBold/ItalictrênProperties(HaychọnkiểuFont
trênmenuText/Style)
This is trial version
www.adultpdf.com
BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
8
88
85
55
5

o
Đểthayđổicỡchữ:Chọn1kíchcỡtừProperties(HaytừmenuText/Size)
cáckíchcỡtừ1đến7l(Mặcđịnhlà3)
o
Đểtănggiảmkíchcỡcủavănbảnđượcchọn:Chọnkíchcỡtươngđối(+1
hay-1chođến+7hay-7)từProperties(HaytừmenuText/Size)

SửdụngcácParagraphvàcácHeading:

Đặtđiểmchènvàotrongđoạnvănbản.
DùngFormattrênProperties(HaymenuText/ParagraphFormat)đểápdụngđoạn
vănbảnchuẩnvàcácthẻHeading.
3.Đổimàuvănbản:
•
Chọnvănbảnmuốnđổimàu.
•
Thựchiện:ClickôTextColortrênProperties(HaychọnMenuText/Color)đểmở
bảngmàu,chọn1màutrongbảng.





4.
4. 4.
4. Canhchỉnhvănbản:
•
Chọnvănbảnmuốncanhchỉnhhayđặtđiểmchènvàotrongđoạnvănbản.
•
ClickchọnmộtdạngcanhlềtrênProperties(HaychọnmenuText/Align)
5.ThayđổitổhợpFont:
Sử dụng lệnh Edit Font List để thiết lập các tổ hợp font được hiển thị trên
PropertiesvàmenuText/Font.
Chọn tổhợpfont từdanhsáchởphíatrêncủahộpthoại EditFontList.Cácfont
trongtổhợpđượcliệtkêtrongdanhsáchChosenFonts.DanhsáchAvailablechứacác
fontchophépcàiđặt.NếukhôngcóFontnàotrongtổhợpđượccàiđặtthìsẽhiểnthịFont
mặcđịnhcủatrìnhduyệt.







6.Tạomộtdanhsáchmới:
•
Đặtđiểmchènởvịtrímuốntãtạodanhsách(Hoặc1nhómcácdòng)
•
ClicknútUnorderedListhayOrderedListtrênProperties 
(HayMenuText/Listvàchọnkiểucủadanhsách)
ấnEnterđểchuyểnsang.
Đểhoànthànhdanhsách,ấnEnterhailần.
This is trial version
www.adultpdf.com
BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
8
88
86
66
6

Cácthuộctínhcủadanhsách:Đểxemhayhiệuchỉnhcácthuộctínhcủadanhsách.
•
ChọnmộthạngmụctrongdanhsáchvàchọnText/List/Properties(HayclickList
ItemtrênProperties)


TronghộpthoạiListPropertiescócácthuộctính.
o
ListType:Kiểuđánhdấucủadanhsách.
o
Style:Kiểucủakýtựdùngđánhdấudanhsách.
o
StartCount:Đặtbiếnbắt đầuđánh dấuchohạngmụcđầutiêntrongdanh
sách.
o
NewStyle:Chophépchọnmộtkiểukýtựmớiđánhdấubắtđầutừhạngmục
đượcchọn.
o
ResetCountTo:Đặtgiátrịbắtđầuđánhdấutừhạngmụcđượcchọn






7.Tạodanhsáchkếttổ:
o Chọndanhsáchcáchạngmụcmuốnkếttổ.
o ClicknútTextIndent/TextOuttrênProperties(HaychọnText/IndentHoặc
Text/Outdent)
8.Sửdụngđườngkẻngang:
Cácđườngkẻngangrấthữuíchchoviệctổchứcthôngtin.Trên1trang,cóthểtách
rờicácvănbảnvàcácđốitượngvớimộthaynhiềuđườngkẻngang.
•
Đặtđiểmchèntạivịtrímuốntạođườngkẻngang.
•

Chọn Insert / Horizontal Rule (Hay Click nút Insert Horizontal Rule trong Panel
Objects/HTML)
Chỉnhsửađườngkẻngang:
•
Chọnđườngkẻngang.
•
ChọnvàđiềuchỉnhcácthuộctínhcủađườngkẻngangtrênProperties:
o
WvàH:địnhchiềucaovàbềdày.
o
Align:chọnchếđộcanh.
o
Shanding:chọnkiểubóngđổ.

9.Chèncáckýhiệuđặcbiệt
•
Đặtđiểmchèntạivịtrímuốnchènkíhiệuđặcbiệt
•
ChọnInsert/HTML/SpecialCharcters/Orter(HayClicknútCharactertrongPanel
Objects/Text)
This is trial version
www.adultpdf.com
BàiGingMônThitKWeb  Phn4:MacroMediaDreamWeaver


Biênson:DngThànhPht  Trang
8
88
87
77

7


ChọnkýhiệuOk
IV.TậpTinHìnhẢnh
1.Kháiquátvềhìnhảnh
Hìnhảnhlàthànhphầnquantrọnggópphầntrangtrítrangwebthêmhấpdẫnvàlinh
động.TuynhiênlạIlànhântốgâycảntrởtốcđộhiểnthịtrangweb.Vìvâycầncânnhắc
theocácnguyêntăcsau:
 MàusắcphảIphùhợpvớITonemàuchungcủatrangweb
 Đừnglạmdụngquánhiềuhìnhảnhtrêncùng1trang.
 Khôngsửdụngảnhcókíchthướcquálớn(Nếucầnnêntạoliênkếtphóngto)
 Độphângiảiảnhthôngthường72dpi
 ChọnđịnhdạngảnhphùhợptheodạngthứccủatừngloạIảnh:
Jpeg–Jpg:Ảnhtĩnh,hỗtrợ16triệumàu,phùhợpvớicácảnh
Gif:Ảnhtĩnhhoặcđộnghỗtrợ256màu
Swf(MacromediFlash):Ảnhđộngvéctơ,hỗtrợ16triệumàutuynhiênđể
xemmáytínhphảicàiFlashPlugin.
Ghichú:Cáchìnhảnhphảiđượclưutrữvào1thưmụctrongSite.
2.ChènẢnhVàoTrangWeb
a.Chènhìnhảnhvàotrang
 ĐặtđiểmchènởvịtrímuốnchènClickbiểutượngImageImagetrênthanh
côngcụCommon.(HoặctrìnhđơnInsert/Image)
 Hoặc 
TìmchọnảnhClickOk
This is trial version
www.adultpdf.com