Khóa luận tốt nghiệp Hóa học: Phối hợp phần mềm Macromedia Dreamweaver MX và Macromedia Flash MX 2004 để tạo trang web hỗ trợ cho học sinh trong việc tự học môn hóa học lớp 11 - nhóm nitơ chương trình phân ban thí điểm

Thực tế nước ta việc phối hợp DREAWEAVER và FLASH để tạo các trang Web quáng cáo với các hoạt hình đẹp mắt là rat phổ biến tuy nhiên ứng dụng chủng vào việc dạy học thi còn hạn chế.. Đặc

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRUONG ĐẠI HỌC SƯ PHAM THÀNH PHO HO CHÍ MINH

KHOA: HÓA

OQ

CỬ NHÂN HÓA HỌC Chuyin sgàaá: Dhutong phip gidng day

Đ ai: PHÔI HỢP PHAN MEM MACROMEDIA

DREAMWEAVER MX VA MACROMEDIA

FLASH MX 2004 DE TAO TRANG WEB HO

TRỢ CHO HỌC SINH TRONG VIỆC TU HỌC

MÔN HOA HỌC LỚP II - NHÓM NITƠ

CHUONG TRINH PHAN BAN THÍ DIEM

Giáo viên hướng din khoa học: Tiến si Lê Trọng Tin

Sinh viên thực hiện: Nguyễn Ngọc Anh Thư

Niên khoả: 2002-2 2002-2006

THWVIEN — Thanh phổ ; CR Ham 2006— h

a '@°*%a “a4

LOI CẢM ON

« Den gừ nay ÁÁc đã hean thank khéa twin Ul nghitp, Uti thil lạ wi mitng vt hank phic

vi minh dd hdd gua mel chang dưng đẩy hhé than wdl vd Tid dé đạc va dense mil sin

phdim ÁÁou hoe hein chink nhdl, sing lao nd, mit mé nhdl déi wti chink bin than

| gi dé hank ÁÁáác sà tet hao sể thank gud (ao ding esa minh

SPR NH OPH CC STH BOSH HOLTON Oa hs * 'ôâ ^ bh bh RR ^ ^

đang ther gian thee hitn tba lain til nghitp, bin can nổ lute cda đản than tei đã

nhdn date ral nhide sự gitip de, ding vitn, se chd bdo lin tink cáa thdy có, gia dink wa

& ban

Ẩm xin cẩm đa cấm om huttmg Doi Hoe Set gom, odin ch các thy of hong khoa Hea dã tin lnk day bdo vt đạo my điều điểm đữ mÁđỮ dé om có thé hee lbp vt Ácàn

thank ÁÁóa lain này

Con xin cảm om thy Le Tiong Fin dit bé val nbides theri gian gud kde dd chi bdo và

sate chit nhding sai sél lit đó con mii có thd hein chink due khéa tél nghit, tél nghifp

Sm sion cứ 22 đấy Thanh Frang, có Van đấy Hing Nomypl cùng các địy ot ti

Kiba của lường hung hee ÁÁể thing Mac Bink (Ác dé lin tinh day bdo wt chia sé cho

om nhing kink nghiim giảng dey cing nhe hink nghitm cước sing

Minh xin cấm on lal cá ban đò gần xa dé nbipl link giip de mink hong the gian

mink lhur hién hhia ludn tél nghitp

MO BAU ROT SOS ONS NOOR ree RN aE vise hi œÏ

Chương 1: CƠ SỞ LÝ THUYET

1.1, Cơ sở lý luận của phản mém MacroMedia Flash MX 2004 5

1.1.1 Giới thiệu về MacroMedia Flash MX 2004 5

1.1.2 Công cụ của MacroMedia Flash MX200 6

1.1.3 Vùng làm việc của MacroMedia Flash MX 2004 6

1.1.4 Các thành phan cơ bản của Flash MX 2004 7

1.1.5 Những the mạnh của Flash 2-2222 22222222 c2 13 1.2 Cơ sở lý luận của phan mém MacroMedia Dreamweaver MX “Í.“ 21 1.2.1 Giới thiệu về MacroMedia Dreamweaver MX 21

1.2.2 Ving làm việc của MacroMedia Dreamweaver MX 2!

1.2.3 Các nội dung cơ ban của MacroMedia Dreamweaver MX 2

1.2,G030NW MA 0a NGÔ de S220 00 6026206642 2s 36

BTS Tự ag a ae ik cena a in aaa ER 36 13.8% Clc hình Đắc cole thet lho 4:24 0626060062200 202i2 000 Ÿỹ.Ÿ 36 13:3: Chu tình tự học cia học stellt cosas seen eee 37 14: Và NÓ GIÁ SE NOG qaeuptatqbatii6igtii20664i60icusaseu 37 1.3.5 Tự hoc qua mang va những lợi ích của nó 38

1.4 Cơ sở lý thuyết của nhóm Nitơ - -5 cv cvcsseorseerc.ee 40 T41, K0 eS es 40 BAEZ, (ND sca ecnevsnscommanannncn sy i 2160 000000000263A 0000640007060 66u60006000606007010003/4048/0080030seẺ 42 1.4.3 Amoniac và muối amoni 44 1.4.4 Axit nitric va mudi nitrat - san mm 50

1.4.6 Axit Photphoric và muỗi photphat 5:52 552-555- 57

1.4.7 Phân bón hóa học ooo coc cccccccccccceccccccnceveesesssveveenernresveenmueeeeens 59

31,

3.2.

Chương 2: THIẾT KE TRANG WEB NITO - PHOTPHO

Dinh hướng khoa học TT sane

2 Thiết kế hoạt hình dựa trên nên tang của nhà sa MacroMedia Flash 63

2.2.1 Xây dựng bảng hệ thống tuần hoàn các nguyên tô hóa học có hoạt động

IAI HƠA|Leoceyaaeesseevcaooieeenaeasoaeoiieree mm mm.

222 Thiết kế các hoạt hình thi nghiệm hóa học — 67

2.2.3 Thiết kể sơ GO sản xuất axit nitric ng: 79

2.2.4 Xây dựng phan trắc nghiệm hóa học - s:252-55522 85

22.5 Xây dựng các hoạt hình trang trí - 5525 SS5<<5 S2 89

Sử dụng phản mém MacroMedia Dreamweaver MX để xây dựng trang Web

hóa học b\Gø D0725 TA i SS Tgp hast E220 GD % 9Ị

S321: Tag ci oi 0000200040006 660L 000 ng 91

306: Waren LCs GÀ ÔN waa acess Seca ia eae aCe a hana chs 95

2.3.3 Sử dụng phân mềm MacroMedia Dreamweaver thiết kế trang kiến thức

239 Sử dụng phan mêm MacroMedia Dreamweaver thiết ke trang tư liệu

Giem KHÂ0 864414214) 004A60N0Ai0N%i0( (a0 g& 108

Chương 3: THỰC NGHIỆM SƯ PHAM

Mục đích thực nghiệm sư phạm ee er ey DỤ, Phuong pháp thực nghiệm jištGG@8 tù i8 haxcseyc 110

3.3 Nội dung thực nghiệm win city X61sG2c09sGf6x0G 6 6G(4002XigeGg 110

š 1 KẾ dai tt HN ccccseeoioioooaaoreeoeeeoooooeeec t1A14010005đ0 sa ĐỂ

3.4.1 Thực nghiệm về sự cân thiết của trang Web hóa học Nito - Photpho 112

3.4.2 Thực nghiệm vẻ tính chính xác, khoa học, logic của trang Web hóa học

NHỚ = PHO as ois ce ssseinseiteacesenensecaivienvesnananaapseesveuesversiessosvenioees 112

3.4.3 Thực nghiệm vẻ tinh thâm mi, sáng tạo của trang Web hóa học Nitơ

-CL ee TA.

3.4.4 Thực nghiệm vẻ mức độ sinh động, hấp dẫn, gây hứng thú thu hút học

sinh tham gia của trang Web hóa học Nito- Photpho 113

2.4.5 Thực nghiệm vẻ mức độ hỗ trợ học sinh tự học tốt chương Nito

Fhotpbo của tung We v0 4260064166622 6v20áa se 14

3.5 Phân tích kết quả thực nghiệm sư pham 0.0.00cc00c0essepssesseeneeenernees 114

3:5:1 Hiên tích Cipla NHNG: ¡46C 220020CCCEcciioaaycodi 114

3,423, Phền tích định hh:- cuc 2266220202 00002G00220 2.0100 ảảA) 114 Ess DI GIÁ ORIN acess ct y0 cc2i02G00b-c0 calpimebaaSesmaoaees eaaiea nek slopes „115

3.7 Một số điểm cản hoàn thiện -ccicccrocccccccce, 115

Chuong 4: KET LUAN

4.1, Kết luận 2 +2 22 S2 CS SE E2EEE1311707132121122111731117170722272222 220 116

4.2 Điểm mới của để tài À -s- 2 sự vệ zcvzccxzcvvrxxerxkerszcrszvzzceecr 118

4:3, Histone ái@triện oêø để Nễ .s- mm

Os RE NH3 a a at 119

TALLIED THAM KHAO ¿Ga CC oe oem eee 120

Than: MF đầv

LÝ DO CHON DE TÀI

MỤC ĐÍCH NGHIÊN CỨU

LICH SỬ VAN DE

NHIỆM VU CUA DE TÀI

KHACH THE NGHIÊN CUU

ĐỐI TƯỢNG NGHIÊN CUU

GIÁ THUYẾT KHOA HỌC

PHƯƠNG PHÁP LUẬN VÀ

PHƯƠNG PHÁP NGHIÊN CỨU

PHAM VI DE TÀI

Khda luận tết sgihiện @0/Ð: TS Le Trong Tin

MO ĐAU

1 LÝ DO CHON DE TÀI

Sự bùng nỗ của công nghệ thông tin va sy phát triển như vũ bao của khoa

học kĩ thuật đã đặt ra một yêu cầu khá cao đối với thé hệ tương lai Thể hệ tương lai

la phải những người không những biết sử dung ma còn phải sảng tạo ra khoa học.

Va để có được những con người có khả năng như thé thi nền giáo duc ta đã chủ

trương đôi mới phương pháp đạy học theo nhiều xu hướng khác nhau như: phát huy

tính tich cực, tự lực, chủ động, sáng tao của người học; sử dụng tối ưu các phương

tiện dạy học đặc biệt là tin học vả công nghệ thông tin; vận dụng kiến thức vào đời

sông; tăng cường hoạt động tự học Tất cả những đôi mới đó nếu thực hiện tốt sẽ

mang lại thành công rực rỡ cho người học lẫn người dạy, tuy nhiên do mới lạ nên

nó cũng mở ra con đường day ap những khó khăn vat vả Một trong những khó

khăn lớn nhất đó là: khối lượng kiến thức quá nhiều trong khi thời gian giảng dạy

trên lớp thi qua ít Vì vậy, giáo viên thường không đủ thời gian dé biếu điển các thi

nghiệm, giải thích kỹ các cơ chế phan ứng bằng các so 44 mô hình hoá hay liên hệ

mở rộng kiến thức sau bai hoc ma nêu có thì cũng chỉ dừng lại ở một mức độ giới

han nào đó Rất nhiều trường hợp giáo viên “ chạy đua” cho kịp chương trình còn

học sinh muốn theo kịp bài thi phải có khả năng tự hoc, tự nghiên cửu cao Tuy

nhiên, không phải ai cũng làm được điều đó Người học phải học như thế nào và

người dạy phải dạy như thế nào đẻ đạt được hiệu quả cao nhất? Đây là một vấn đề

thật sự khó khăn.

Với mong muốn đưa ra một giải pháp khoa học cho những khó khăn trên,

với mơ ước ứng dụng công nghệ thông tin một cách sâu rộng vào việc day va học

hóa học ở trưởng phổ thông cùng với niềm say mê tìm tòi nghiên sáng tạo ra một cái mới cho chính ban thân mình tôi đã quyết tâm chon dé tai: “PHÓI HỢP

PHAN MEM MACROMEDIA DREAMWEAVER MX VA MACROMEDIA

FLASH MX 2004 DE TAO TRANG WEB HO TRỢ CHO HỌC SINH

TRONG VIỆC TỰ HỌC MON HOÁ HỌC LỚP 11 NHÓM NITO CHUONG

TRINH PHAN BAN THÍ DIEM”

SOUTH: Uguyén Vgge Anh Thit Trang 1

Khda luận tố! nghiệp GUWD: TS Lb Trong Tin

2 j N N

Mục đích nghiên cứu nhằm tạo ra một trang WEB hoá học với vai trò vừa

là một công cụ hỗ trợ cho học sinh tự học hoá học vừa là một phương tiện hữu hiệu

giúp giáo viên giải quyết mâu thuẫn giữa kiến thức vô hạn và thời gian lên lớp hữu hạn nhằm nâng cao chất lượng day học môn hoá học ở trường phô thông.

Trên thé giới hiện nay có rất nhiều trang WEB hoá học với nhiêu thông tin

mới la, hap dẫn, nhiều hoạt hình sinh động Tuy nhiên, những trang Web nay it

được học sinh quan tâm do nó được viết bằng tiếng Anh và thông tin trên nhữngtrang Web thường không phủ hợp với trình độ của học sinh pho thông

Thực tế nước ta việc phối hợp DREAWEAVER và FLASH để tạo các

trang Web quáng cáo với các hoạt hình đẹp mắt là rat phổ biến tuy nhiên ứng dụng

chủng vào việc dạy học thi còn hạn chế Đặc biệt việc phối hợp DREAWEAVER

và FLASH để tạo trang Web hoa học chuyên dùng cho học sinh phổ thông là mộtvấn dé rat hay, rất cần thiết và tương đối mới mẻ đòi hỏi chúng ta cần quan tâm

nghiên cứu

Các anh chị năm trước đã bước đầu ứng dụng phần mềm Flash vả

Dreamweaver vảo việc giảng dạy hoá học ở trường phê thông trong một số vấn đẻ

riêng lề nên việc phối hợp điểm mạnh của hai phần mém này trong giảng dạy hoá

học chưa được khai thác một cách triệt để Đồng thời phan lớn các anh chị nghiên

cứu về các chương halogen, lưu huỳnh-oxi, hidrocacbon của sách cũ còn nhóm

Nitơ của chương trình phân ban thí điểm thì chưa được quan tậm nghiên cứu.

4 NHIEM VU CUA DE TÀI

* Nghiên cứu:

- Cơ sở lý thuyết của Macromedia Flash MX 2004 và Macromedia

Dreamweaver

- Cơ sở lý luận về tự học

- Cơ sở lý thuyết nhóm Nitơ

* Tận dụng thé mạnh cúa 2 phan mém Macromedia Dreamweaver vaMacromedia Flash dé thiết lập trang Web hóa học nhằm hỗ trợ cho học sinh trong

việc tự học môn hóa học lớp 11 nhóm Nitơ chương trình phân ban thi điểm”.

SOTH: ⁄Àguuản Ugoe Anh Thi “rang 2

Khia luận tốt nghiệp GUD: TS Le Trong Tin

- Thiết kế sơ đỏ sản xuất axit nitric HNO;

- Xây dựng bảng hệ thông tuần hoàn các nguyên tô hoa học

- Xây dựng phân trắc nghiệm hóa học

- Thiết kế một số hoạt hình động để trang trí cho trang Web

> Ung dụng phần mém MacroMedia Dreamweaver dé thiết kế trang

Web hóa hoc NITO PHOTPHO với các nội dung sau:

- Trang chủ: giới thiệu tổng quát

- Trang lịch sử tim ra các nguyên tố nhóm Nitơ

- Trang kién thức cơ bản

~ Trang thí nghiệm hóa học

- Trang trắc nghiệm hóa học

- Trang bài tập hóa học

~ Trang ứng dụng

- Trang hóa học vui

- Trang tư liệu tham khảo

* Thực nghiệm sư phạm

* Kết luận và đề xuất ý kiến

5 KHÁCH THÊ NGHIÊN CUU

Khách thé nghiên cứu là quá trình day học ở trường phô thông

6 DOI TƯƠNG NGHIÊN CUU

Đối tượng nghiên cứu là: Thiết kế trang Web hỗ trợ cho việc học và tự học

môn hóa học lớp 11 - nhóm Nitơ chương trình phân ban thí điểm

Đây là đề tài rất hay rất mới mẻ Nếu trang Web được làm xong với đúngmục đích yêu cau đề ra và được đưa vào sử dụng thi trang Web nay nhất định sẽ làmột công cụ học tập đắc lực và đáng tin cậy cho học sinh Những điều chưa hiểu,

SOUTH: Hguyin ⁄3gọc Anh Tht Trang 3

Xkáa luận tất nghiệp GOMD: TS è “Trọng Tin

những thi nghiệm đẹp mắt, những thông tin xoay quanh bai học sé được mở ra khi

các em truy cập Website này Trang Web này giúp các em làm quen dân với mộthình thức tự học mới cần được phát huy trong tương lai đó là: học sinh tích cực,

chủ động tự tìm kiến thức cho riêng mình Trang Web này cũng sẽ góp phân lảm

phong phú thêm nguồn tư liệu cho giáo viên khi cần thiết

- Phương pháp luận: Dựa trên quan điểm triết học duy vật biện chứng vẻ

quá trinh nhận thức của học sinh.

- Phương pháp nghiên cứu:

+ Phương pháp tông kết cơ sở lý luận

+ Phương pháp điều tra thực tiễn

+ Phương pháp xây dựng các ý tưởng và mô hình hoá nó bởi sự hỗ trợ

của phần mềm MACROMEDIA DREAMVEAER MX 2004 và MACROMEDIA

FLASH MX 2094

+ Phương pháp thực nghiệm sư phạm

+ Phương pháp tông hợp xứ lý kết qua theo thống kê toán học

9 PHAM VICỦA DE TÀI

Vẻ mặt lý thuyết, trang Web này có khả năng liên kết toàn bộ chương trình phổ thông nhưng do thời gian nghiên cứu có hạn nên em chi đi sâu nghiên cứu

nhóm Nitơ - lớp 11 - chương trình phân ban thí điểm.

SOTH: Hguyén Agoe Ankh Thur Trang 4

Chương 1: CƠ SỞ LÝ THUYẾT

Chương 2: THIẾT KẾ TRANG WEB

NITƠ - PHOTPHO

Chương 3: THỰC NGHIỆM SƯ PHẠM

Chương 4: KẾT LUẬN

Xkáa luận tất nghiệp (2⁄0): TS Li “Trọng Tin

Chases CO SO LY THUYET

1.1 CO SO LY LUAN CUA PHAN MEM MACROMEDIA

FLASH MX 2004

1.1.1 GIỚI THIÊU VE MACROMEDIA FLASH MX 2004

Hiện nay cỏ rất nhiều chương trình thiết kế Flash nhưng phd biến

nhất vẫn là chương trình Flash của hãng Macromedia, và từ sau phiên bản 4.0,

Macromedia đã tự khẳng định mình là hang hang đầu trong lãnh vực thiết kế Web.

Bởi lẽ FLASH với tư cách là một chuân đỏ họa hoạt hình trên Web đã tạo ra những

hình ảnh động gọi là hoạt cảnh (Animation), giúp cho trang Web có tính tương tac

cao hơn và hắp dẫn hơn

MACROMEDIA FLASH MX là một phần mềm ứng dụng bao gồmcác công cụ được sử dung dé tạo ra các hoạt hình, đồ họa vecto, các ứng dụng, các

phan mẻm, các bản trình điển hoặc website Flash có nhiều công cụ tại chỗ giúp

cho kích thước các tập tin swf nhỏ gọn và các site chạy nhanh vì vậy mà không cần

qua giai đoạn tải xuống Các tập tin này được xem thông qua trình thé hiện Flash

Player (hiện nay mới nhất là version 7.0) Flash sử dụng một ngôn ngữ kịch bản có

tên là ActionSript Voi phiên ban MACROMEDIA FLASH MX 2004,

ActionScript 2.0 đã chính thức ra mắt Day là 1 công cy hoàn hảo cho người thiết

kế web, chuyên gia trong lĩnh vực media tương tác, hay chuyên gia phát triển nội

dung multimedia (đa phương tiện) Trọng tâm của phiên bản được đặt vào việc tạo,

nhập liệu va thao tác nhiều loại media (như audio, video, bitmaps, vectors, text, va

đữ liệu).

Phiên bản MACROMEDIA FLASH MX PROFESSIONAL 2004

gồm tat cả các đặc tính của Flash MX 2004, cùng với một số công cụ mạnh mới

Nó cung cap những công cụ quản lý dự án để tối ưu hoá lược đồ công việc giữa các

thánh viên trong | đội làm web gồm nha thiết kế và người phát triển Khả năng lập

mã bên ngoài va xử lý dữ liệu từ database là 1 số đặc tính làm cho Flash đặc biệt

phù hợp cho các dy án phức tap, qui mô lớn được triển khai bang cách sử dụng

Flash Player cùng với | hệ lai HTML làm nội dung.

SOUTH: (Àguuễn Wage Anh Thi Trang 5

Khéa luận tất ngiiệp Q\22⁄0: TS Lé “Trọng “Tín

1.1.2 CONG DUNG CUA MACROMEDIA FLASH MX 2004

Với Flash, ban sẽ bố sung các các hiệu ứng thú vị cho trang Web làm

cho trang Web có tính tương tac, hấp dẫn vả sinh động hơn Các công cụ da dangtrong Flash cho phép bạn phát huy hết khả nang sáng tạo của minh hoặc đi theo cácchuẩn đã được thiết lập: Flash điều tiết va hợp nhất giữa thiết kế và phát triển dé

bạn có thê tạo ra hậu như mọi thứ.

Các hình ảnh mà bạn vẽ trong Flash được tạo bang dé hoạ vectơ thay

vì hình ảnh Bitmap Đô họa vectơ ưu việt hơn nhiều so với các hình anh Bitmap ở

một số điểm quan trọng Dé hoạ vectơ có dung lượng nhỏ hơn các bitmap tương

đương hình vectơ có thé thay đỏi kích thước mà không thay đổi chất lượng trong

khi phóng to một ảnh bitmap thì chúng trông rất thô.

1.1.3 VỮNG LAM VIỆC CUA MACROMEDIA FLASH MX 2004

Biểu tượng trên Desktop:

Xkhỏa luận tất sgkiệp (02/0: TS Lộ “Trọng Fin

a

1.1.4 CÁC THÀNH PHAN CƠ BAN CUA FLASH MX 2004

1.1.4.1 Hộp cụng cụ Toolbox

Macromedia Flash cung cấp cho ta một số cụng cụ rất mạnh cho

phộp ta vẽ hỡnh, sửa ảnh trực tiếp trờn Stage Mỗi cụng cụ khi được chọn sẽ hiển thị

thuộc tinh riờng vào thanh Properties năm đưới đỏy man hinh dong thời xuất hiện

cỏc cụng cụ bú sung nam ở phớa dưới cửa sộ

Đề hiện thanh cụng cụ, từ menu Windows ——> Tools,

Free Transform <————EI Fill Transform

Ink Bottle <——_+đằ Paint Bucket

Eyedropper <—————+# o> Eraser

——

Had <=———€? QG——> Loom

Colors

72 Stroke color <——— đ Fill color

Đcđ=

Opters

Cỏc cụngcỤ ô fn

bổ sung ~€ +

- Cụng cu Selection ` cụng cụ chọn và hiệu chỉnh đụi tượng Cú 3 tựy

chọn: Snap to Object: khi vẽ hay di chuyển sẽ được bắt dớnh vào lưới hoặc đối

tượng khỏc; Smooth: làm mềm đường cong, bỏ bớt những đoạn cong nhỏ, Straighten: làm thang đường cong.

- Cụng cụ Subselection b

hiện cỏc điểm vertex Nhắp và rờ cỏc điểm vertex để thay đổi hỡnh ảnh đối tượng

: cụng cụ dộ chọn cỏc đường outline dộ xuất

SOTH: (quyờn UHgoe Anke Thu Frang 7

Khda luận tt nghiệp GOWD: TS Lé “Trọng Tin

—————————————————~

- Công cụ Line : dùng dé vẽ các đường thăng có thé chọn mau, loại

đường kẻ trong bang Properties.

- Công cụ Lasso P dùng dé chọn các đối tượng trên khung làm việc, đặc

biệt hơn công cụ selection (chọn các đôi tượng trên khung làm việc dựa vao hình

chữ nhật) ở chỗ có khả năng xác định vùng có hình dang bat ky của các đôi tượng

trong khung làm viéc.Céng cụ này có 3 mức làm việc:

Magic Wand (bên trái): chọn đối tượng dựa trên màu sắc trong

vùng có hình dạng bat ky.Magic Wand Properties (bên phải): điều chính thông số cho Magic Wand Polygon (dưới): chọn các vùng có hình dang

- Công cụ Pen Q Công cụ vẽ các đường thăng gap khúc hoặc các đường

cong bằng các cham các điểm tại các vị trí khác nhau rồi nối chúng lại dưới dang

các đường tháng đường cong Công cụ này tương tự như công cụ Line nhưng tiện

hơn công cy Line rất nhiều, dựa vào chức năng nối các điểm nếu ta nối điểm đầu

vào điểm cuối (3 diém trở lên) sẽ tạo thành các hình đa giác.

- Công cụ Text A : công cụ để nhập văn bản vào Stage, sử dụng bang

Properties để hiệu chỉnh văn bản như Font, màu, khoảng cách, kỷ tự, liên kết đến

một trang web.

- Công cụ Oval Ô: Công cụ dùng để vẽ những hình tròn , hình bau dục , có

4 tỉnh năng tương tự công cụ Pen.

- Công cụ Rectangle n, Công cụ về các hình chữ nhật ngoài 4 tính năng

như Oval, ta còn có thêm tính năng bo tròn các góc (Round Rectangle Radius) ở

bảng options.

- Công cụ Pencil 4 : chức năng tương tự công cy Pen nhưng độ chi tiết

không như công cy Pen (các nét xa sẽ thánh đường thẳng, các nét gần sẽ tạo thành

đường cong, tat cả là do chương trình tự tính toán và bạn hoan toan vẻ bang tay)

- Công cụ Brush ⁄ : công cụ quét màu với 4 tinh năng: Brush mode: kiêu

quét; Brush size: độ lớn của công cụ quét; Brush shape: hình dang của công cụ quét

(hình que xéo, hình tron, hinh bau dục ): Lock fill: không cho tô màu lên

SOUTH: Aguyéen Hage Anh Tha rang %

Khda luận tất ®gkiệp GOWD: TS lò “Trọng Tin

- Céng cu Free Transform H: công cụ này giúp chọn các đối tượng trên

khung làm việc, giúp chọn một vùng mau, xoay vùng chọn một góc bất kỳ và có

kha nang tăng giảm kích cỡ các chiều trong vùng chọn Công cụ này có Š tính năng

chính, 4 tính năng trong mục options (Rotate and Skew; Scale; Distort; Envelope)

vả được thê hiện qua các thao tác trỏ chuột Chức năng còn lại là Fill color trong

bang Properties.

- Công cu Ink bottle © : thay đổi mau, kích thước kiểu của một đường nét

bao quanh một hình dạng trong khung làm việc Công cụ này có 3 tính năng tương

tự như Line.

- Cong cụ Paint Bucket & : tô mau cho các hình dang tao ra từ các đường

viên (tô màu cho các hình dang được tao ra từ công cụ pencil chăng han), thay đôi

mau đã có trong khung làm việc Có hai tinh nang Gape Size và Lock Fill trong

mục options.

- Công cụ Eyedropper : cho phép lấy mẫu sao chép màu tô đường nét

của đối tượng đang xét rồi áp dụng cho một đối tượng khác, công cụ này không có

tinh chất khác, giúp ching ta tiết kiệm thời gian.

- Công cụ Eraser :, công cụ này làm nhiệm vụ xóa màu, đường nét của

một đối tượng trong khung làm việc.Công cụ gồm có 3 tỉnh năng trong mục

options: Eraser mode (tương tự với Brush mode); Eraser shape ( tương tự với

Brush shape); Faucet: xóa nhanh đường nét nối lién, màu tô một vùng tô màu của

đối tượng.

1.1.4.2 Layer (lớp!

Dùng dé quan lý các đối tượng trên một hoạt cảnh theo từng lớp hoặc theo

tửng chuyên động Trong một hoạt cành có thê có nhiều layer

SOTH: Aquyéen UHgoe Anke Thi Frang 9

- * Show / hide all layers: hiện hoặc ân tat ca các layer

- ® Lock / unlock all layers: khóa hoặc mở khóa tat ca các layer

- Ð show all layer as outline: quy định mau sắc bao các đối tượng trong

lớp.

- © Insert Layer: tạo thêm một layer thường, mặc định lớp nay tạo ra sẽnăm trên lớp hiện hành (tức là lớp ma ban dang dé trỏ chuột)

- Ýằ Add Motion Guide: chén lớp dẫn (Guide) cho lớp hiện hành.

Insert Layer Folder: chèn thư mục.

- © Delete Layer: xóa lớp ma ban đang chon.

* Các công dụng của Layer (lớp):

- Khi tạo một phép biến hình, tất cả các đối tượng trên lớp có phép biến hình

đó phải di chuyển với nhau Nếu bạn muốn các đối tượng tĩnh trong phim phảiđược bố trí trên các lớp không chứa các phép biến hình Nếu bạn có các phép biến

hình khác nhau, chúng phải nam trên các lớp riêng biệt.

- Nếu bạn muốn tạo một phím nơi mà các đối tượng chi thấy một phần của

stage, bạn cân phải sử dụng một lớp đặc biệt có tên là lớp mặt nạ (mask) Có thé sử

dụng lớp này tạo hiệu ứng một ký tự di chuyển phía sau một cửa sé

- Khi tạo một phép biến hình chuyển động, các đối tượng làm hoạt hình

nhìn chung di chuyển theo một đường thẳng Nếu muốn chúng di chuyển theo một đường cong nào đó bạn có thé sử dụng một lớp đặc biệt gọi là lớp dẫn (guide

layer).

* Định thuộc tinh layer:Dé định thuộc tinh của layer, ta chọn player can định

roi vào menu: Modify —> Layer = xuất hiện cửa số ta định các thành phan sau:

¢ Name: Định tên layer

SOUTH: Aguyén (Xgọc Anh Thu rang 10

Khda luận tốt nghiệp GOUMD: TS “tê Trong Fin

—=£ềằ————————————————

® Show: An hiện layer

s® Lock: Khoá / mở layer

se Type:Kiéu Layer ( Normal, Guide, Guided, Mask: Layer, Masked )

* Outline color: Mau của đường viên đối tượng hiển thị khi chọn View as

outline

View as outline: Chế độ hiển thị đường viên của đối tượng

© Layer height: Định chiều cao của Layer

1.1.4.3 Stage

Là khu vực không gian phim được trình chiều hay còn gọi là sân khau Năm

ở giữa các bang điều khiển Stage là nơi đặt các media như đô hoa, nút nhắn, hoạt hình và các tương tác trên biểu mẫu.

Dé đưa các file hình ảnh từ của các phan mém đỗ hoạ khác vảo stage ta vào

menu File ——> Import —> Import to stage => xuất hiện cửa sẻ và chọn file cân

đưa vào

1.1.4.4 Timeline

Là nơi quản ly từng khung hình và định thời gian chuyển động cho hoạt

cảnh Mỗi Timeline bao gồm một loạt các frame nằm trong một hàng, các frame có

thể trong có thé chứa nội dung hoặc có thé là một keyframe (khung hình khóa) Nó

có thể chứa một hoặc nhiều đối tượng như graphic, symbol Bảng tiến trình có thể

có | lớp (layer) hoặc nhiều lớp chồng lên nhau, chứa đựng các phần tử và mã lệnh.

Mỗi lớp có một đòng khung hình Một con trỏ khung hình (playhead) được dùng để

di chuyển qua lại trong bảng tiến trình và chọn khung hình hiện tại khi bạn đang

làm việc.

+ Frame: Là một cột bao gồm một day các 6 theo hàng dọc trong cửa số

+ Playhead: Dùng để hiển thị tất cả nội dung của các player tại một thời

điểm ma playhead lướt qua Playhead chỉ đi theo một chiều từ trái sang phải va có

khả năng tự động lặp lại.

SOTH: Vguytn Wage Anh Thi Cang 11

Xkáa luận tất +gk¿ệp 403/0: TS Lt “Trọng Tin

Eee

+ Keyframe: La một 6 trong Frame trên một layer ma noi đó có chứa đối

tượng và khi ta thay đổi đối tượng trên keyframe thi những đối tượng ở những

keyframe khác không bị ảnh hướng.

+ Blank keyframe: Khung hình rỗng.

- Là nơi chứa tat cả các tai nguyên của phim (Flash Movie) Các đối tượng

này được gọi chung là biểu tượng (symbol), Các symbol này có thé là một hình

ảnh bitmap, âm thanh, đoạn video, văn bản được du nhập vào hay được tạo ra từ các công cụ của flash.

- Đây cũng là nơi dùng dé tô chức, sắp xếp, phân nhóm các đối tượng theo

từng thư mục (forder) để dé dàng quản lý và làm việc Đồng thời có thé loại bỏ

bớt các đối tượng khi không còn đống vai trò tham gia biểu diễn trong phim bằng

cách xóa bỏ đi để giảm bớt kích thước cho phim.

- Chọn thực đơn Window\ library (hoặc F11)

SOTH: (À(guyên Hage Anh Tha rang 12

Khda luận tất +g&iệp 40/0: TS Lé “Trọng Tin

phiên bản (Instance) của các đối tượng chính này mỗi symbol có một Timeline vả

Stage riêng Bạn có thé làm cho các symbol trở nên mạnh hơn băng cách đặt

symbol này trong symbol khác.

* Tao ra symbol mdi.

+ Tạo ra một symbol mới với đổi tượn n.

- Chọn đối tượng

- Chọn thực đơn Modify \ Convert to symbol (hoặc nhắn phím F8)

- Nhập tên trong 6 name và chọn loại hành vi trong Behavior.

+ Tạo ra một symbol mới.

- Chọn thực đơn Insert\ New symbol (hoặt nhắn phim tắt Ctrl+F8)

- Nhập tên và chọn loại hành vi.

- Thiết kế symbol mới.

* Các loại symbol:Trong flash có 3 loại symbol:

+ Movie Clip: Thường gồm những loại chuyên động được gộp chung lại như một đoạn phim nhỏ, diễn hoạt độc lập với Timeline của đoạn phim chính.

SOTH: (À(guyn Agoe Anh Thu Frang 13

Khda luận tất ngkiệp GOWMD: TS £é “Trọng Tin

+ Button: Dùng khi gan các action vào Người sử dung có thé sử dụngchúng đề đều khiển vả tương tác trong phim tạo ra các button cho tương tac

Một Button gồm có bốn trang thái:

- Up: Trạng thái bình thường của một symbol khi con trỏ chuột.

- Over: Trang thái chuột được lăn qua ving Hit.

- Down: Trạng thái chuột được nhắn trên vùng Hit

- Hit: Phạm vi chuột có tác dụng.

+ Graphic: Thường được tạo ra từ các đối tượng đồ họa tĩnh được sử dụnglàm Instance dùng nhiều lần trong đoạn phim

* Hiệu chỉnh 1 Symbol:

- Nhap đúp chuột vào symbol cân hiệu chỉnh

- Chon Symbol cần hiệu chỉnh, vào menu Edit ——> chọn Edit symbol

- Chọn Symbol cần hiệu chỉnh, ấn phải chuột chọn Edit.

- Dé kết thúc việc hiệu chỉnh ta vào Edit ——» chọn Edit Movie (Crtl-E)

trở về hoạt cảnh chính.

l.15.12 Instance

Khi một symbol được ré từ thư viện vào vùng stage, nó sẽ trở

thành một Instance, nghĩa là Instance là một bản sao của symbol Mỗi instance có

một thuộc tính riêng của nó và tách biệt với symbol, có thẻ thay đôi độ sáng, màu

tô, độ trong suốt ngoài ra bạn có thé thay đổi hình dáng, kích thước của đối

tượng mà không ảnh hưởng đến symbol trong cửa số Properties

Ww 4.0 «© 174.0 |

® H 43.0 Y: 110.8

1.1.5.2 Các kĩ thuật biểu diễn hoạt hình trên Flash

1.1.5.2.1 Motion tween: Loại chuyển động.

- Scale: Vừa chuyên động vừa co giãn.

- Ease: Chuyển động nhanh dan điều hoặt chậm dan đều (giá trị dương

tăng giá trị âm giảm).

SOTH: Uguyén Hgoe Ankh That rang 14

Khéa luận tết sgiiệp 42/0: TS Le “Trọng Tin

Cee ee el

Rotate: Vừa chuyển động vừa xoay.

> Auto: Tự động.

>» CW: Cùng chiều kim đông hỗ

> CCW: Ngược chiều kim đồng hd.

> Times: Số vòng xoay qua mỗi khung hinh

-Yêu cầu: Yêu cầu đối tượng dé tạo chuyển động hình này là

> Đối tượng là nhóm (Group: Crtl+G).

> Đối tượng là symbol.

> Đối tượng là Text chưa bị ra.

-Thực hiện:Tại Frame dau tiên tạo đối tượng thoả man yêu cau chuyên

động Motion Sau đó thực hiện 3 bước sau:

> Kích chọn KeyFrame sau đó va Insert ——> Create motion Tween

(hoặc an phải chuột rồi chon Create motion Twee)

> Chọn một vị trí trén Timeline của Layer đang thực hiện để chèn thêm

một khung hinh chủ (Keyframe) roi nhắn F6

> Kích vào Frame cuối rồi ding công cụ Arrow để định lại vị trí cuối

cùng cho đối tượng Một dấu mũi tên xuất hiện đồng thời việc các khung hình

chuyển qua màu tim (mau của hoạt hình dang Motion).

> Nhắn Enter để kiểm tra lại quá trình.

Dé định giá trị các phép biến đôi của chuyển động loại này ta lần lượt chon

và định lại các thuộc tính trên thanh Properties.

» Frame: Đặt tên khung hình.

> Tweenw: Kiểu chuyển động phải là Snape.

» Ease: Chuyển động nhanh hoặt chậm dân đều

+ Blend:

- Distribute: Chuyên động mém mại

SOUTH: Uguyen VWgge Anh “Thuy Trang 15

Xkáa lugn tế? nghiệp GBOMD: TS Li “Trọng Tin

- Angular: Chuyên động gập ghénh.

Với các chuyển động nay cho phép biến đôi về hình dáng, màu sắc của đôi

tượng

-Yêu cầu: Yêu cầu đối tượng tạo ra loại chuyên động này là:

> Đôi tượng đơn lẻ.

> Không phải là nhóm.

> Không là symbol.

» Text phải được convert.

-Thực hiện: Tại frame đầu tiên tạo đối tượng thoả yêu câu chuyên động

> Nhập chọn khung hình chủ vừa tạo rồi định lại thuộc tính chuyển

động là Shape ở muc Tween trên thanh Properties.

> Chọn một vị trí trên Timeline rồi chèn khung hình rỗng - Blank

Keyframe (nhắn F7) Một dau mũi tên xuất hiện dong thời việc các khung hình

chuyên qua xanh nhạt (màu chuyên động dạng Shape).

> Chọn Blank Keyframe vừa tạo rồi tạo nội dung của khung hình chủ

thử 2 (đôi tượng phải đơn lẻ, nêu là Text phải nhắn Ctrl + B hai lần dé ra)

> Nhắn Enter để kiểm tra lại quá trình.

1.1.5.3 Các hiệu ứng b sung cho chuyển động

I.1.5.3.1 Motion Guide

a) Khai niém:

- Áp dung cho chuyển động Motion Tween

- Thực hiện biến đổi trên đường Path cho trước

b) Thao tac:

- Trên layer chuyên động tao đối tượng

- Click phải mouse lên layer chuyển động, chọn Add Motion Guide hoặc

click vào biểu tượng #4 => tạo layer chứa đường Path.

- Trên layer chuyển động, click frame vao của đối tượng chuyên động, bắt

dính vào đầu đường Path Đứng ở frame cuối của layer chuyên động, bắt đính vao cuối đường Path

SOTH: Hguyén Vgge ctnh Thi Trang 16

Khda luận tất sg&kuiệp 4U3/Đ: FS L2 “Trọng Tin

¡1532 Mask layer

a) Khái niệm Ta có thé dùng Mask Layer dé trình dién | phần chuyên động

cho người duyệt xem bằng cách tạo một bang che Bang che cũng có thé là một

hoạt cảnh Những gì nằm ở layer bên dưới chỉ xuất hiện bên trong lòng đối tượng

của Mask layer

b) Thao tác.

- Trên layer | tạo chuyên động

- Tạo thêm layer 2 nằm trên layer | dùng đề làm layer mặt nạ

- Trên layer 2 tạo nội dung cho layer ( có thé chuyển động ) Click phải

mouse lén layer 2, chon Mask.

1.1.5.3.3 Shape hint

a) Khái niệm: Được ứng dụng để diéu khiển chuyển động dang Shape theo

những định hướng nhất định bảng cách đặt chuyển động

b) Thao tác:

- Đầu tiên phải tạo chuyển động Shape.

- Chon frame đầu tiên của chuyên động Shape:

Vào Modify——> Shape —> Add Shape Hint (mỗi lan tạo một nút )

- Bat dính các nút tai vị tri cần thiết

1.1.5.4 Sound

- Một thé mạnh của Flash là có thé đưa âm thanh vào rat dé dàng Hon thé

nữa là ta có thé chỉnh sửa nó để thích hợp với hoạt cảnh đang thực hiện Các FileSound ma Flash có thé dùng la: * Wav hoặt * MP3

- Một File âm thanh muốn đưa vao tiến trình của hoạt cảnh va hiệu chỉnh

theo y riêng thi nó phải được đặt vào thư viện.

- Dé đưa một File âm thanh vào thư viện ta thực hiện bang cách: Vào File

—> Import => xuất hiện cửa số chọn File thích hợp rồi nhắn Open.

- Khi ấy File âm thanh được đưa vảo và quản lý trong thư viện

* Đưa âm thanh vào cửa số Timeline

> Trong cửa số timeline, nhấp chọn biéu tượng Insert Layer để tạo một

Layer mới dùng cho âm thanh

Khoa luận tốt nghiệp GUWD: FS Le Trong Fin

> Nhap phải chuột chon vị tri Frame nơi muốn âm thanh bắt đầu và

chon Insert Keyframe từ thực đơn xổ xuống.

> Rẻ Symbol âm thanh từ Library vào Stage Âm thanh tự cập nhật

trong timeline.

* Định thuộc tinh âm thanh.

> Định thuộc tính âm thanh là định lại cách thể hiện và trường độ của

âm thanh theo thời gian.

> Chon menu Window ——> Panel ——> sound đẻ định các thành phan

sau:

- Sound: Chon File am thanh can dinh.

- Effect: Chita các hiệu img cho âm thanh đã định nghĩa sản dé đều chỉnh

âm lượng ở loa trái và loa phải.

¢ None: Không cỏ hiệu quả đặc biệt.

se Left Chanel và Right Chanel: Tuy chọn này cho phép âm thanh phát

ra chỉ ở loa trái hoặc chỉ ở loa phải.

e Fade Left to Right va Fade Right to Left: Tuy chon nảy cho phép âm

thanh phát ra ở loa nay chuyển dan sang loa kia

© Fade in và Fade out: Tuy chọn này cho phép âm thanh phát ra to dần

lên hay nhỏ dan đi

* Custom: Tuy chọn này cho phép người dùng định cách thẻ hiện theo

ý minh Có ý nghĩa tương tự như mục Edit và nội dung hộp thoại có

các thành phần như bên dưới.

- Syne: Đây là nơi người dùng xác lập cách quản lý âm thanh của Flash.

Bao gồm các tuỳ chọn sau:

« Event: âm thanh độc lập với hoạt cảnh va tuỳ thuộc vào sự đều khiển

theo sự kiện nó phát đến khi hết.

¢ Start: Định điểm bắt đầu cho âm thanh

* Stop: Định điểm kết thúc cho âm thanh

e Stream: Âm thanh lệ thuộc vảo hoạt cảnh

e Loop: Định số lần lập lại của âm thanh

vZ

SOTH: Uguyén (2(gọc Anh Thi Trang 18

Xkháa luận tất? nghiệp 402D: TS Le “Trọng Tin

RA A RE 2

1.1.5.5 Video

- Trong Flash MX bạn có thé dé dang du nhập các tập tin Video đuợc làm từ

các chương trinh khác vào sử dụng Các tập tin Video có thé có kiểu là avi, mpg,

mov,

- Dé dua một đoạn Video vào Flash.

» Chọn thực đơn File\ Import

» Trong hộp thoại Import, chon tập tin.

» Nhap <Open>

» Xuất hiện hộp thoại <Import Video Setting>.

» Nhấp <OK> hoặt hiệu chính các thông số dé chọn lựa các chức nang

vẻ chất lương, thu nhỏ cho tập tin Video để cho phù hợp

1.1.5.6 Action scripts 1.1.5.6.1 Tương tác

Tương tác là một sự giao thông giữa đoạn phim và người dùng Ta có thể sử dụng nó theo những cách đơn giản để người ding kiểm soát sự thực hiện vả sự thé

hiện của đoạn phim,

Để thực hiện sự tương tác trong Flash ta sử dung ActionScript, ma thực chat

chí là một tập hợp lệnh định nghĩa các sự kiện và hành động

1.1362 Sự kiện: Trong Flash có hai loại sự kiện:

a) Các sự kiện xảy ra do chuột:

Các sự kiện xảy ra khi người dùng tương tác với hoạt cảnh bằng chuột đẻ

gây ra một hành động Người dùng có thé ding chuột dé gây ra các sự kiện sau:

- Press: Phím trái chuột được nhắn

- Releas: Một hành động xảy ra khi người dùng di chuyển con trỏ

chuột lên một nút trên hoạt cảnh rồi nhắn và thả chuột.

- Release Outside: Con trỏ chuột lên một nút trên hoạt cảnh rồi nhân và

nhả chuột ở phía ngoài nút.

- Roll Over: Con trỏ chuột vào vùng đôi tượng

Khda luận tốt nghiệp GUD: TS Li Trong Tin

- Drag Over: Con trỏ chuột nhắn lên phía trên một nút, nhắn rồi kéo ra

khỏi phạm vi nút và sau đó kéo trở lại trong phạm vi nút rồi nha

- _ Nhắn một chữ cái (có phân biệt chữ in vả chữ thường).

- _ Nhắn một phim mũi tên

- Nhắn một trong các phim như: Backspace, Insert, Home, End, Page

Up, Page Down.

1 1.5.6.3 Các lệnh action cơ bản

Các Basic Action trong bảng Action cho phép ta đều khiển việc định hướng

vả tương tác của người dùng trong đoạn phim bằng cách chọn các Action vả Flash

sẽ tự động viết các mã code ActionScript Các Basic Action gồm có:

© Go To:Nhảy đến một Frame nào đó trong scence hiện hành

e Play và Stop: Trình chiếu và dừng lại tại vị trí hiện hành.

© Toggle Hight Quality: Hiệu chỉnh chất lượng của đoạn phim

e Stop All Sound: Dừng tắt cả các âm thanh trong đoạn phim.

© Get URL: Dùng để mở hay nạp môt tài liệu từ một URL

e FSCommand: Điêu khiển giao diện trình chiếu của Flash

© Load Movie và Unload Movie: Gọi và gỡ bỏ 1 đoạn phim swf

e If Frame Is Load: Kiểm tra Frame đó có được nạp không.

e On Mouse Event: Gan một sự kiện chuột hay phím để kích hoạt một

hành động.

SOTH: ⁄À(guuẫn Vgoe Ankh Thit Trang 20

Xkáa luận tất ngkiệp (02⁄1): TS Le “Trọng Tin

1.2 CO SO LY LUAN CUA PHAN MEM MACROMEDIA

DREAMWEAVER MX

1.2.1 GIỚI THIẾU MACROMEDIA DREAMWEAVER MX 2004

Macromedia Dreamweaver MX là một công cy thiết kế và quan lý Website chuyên nghiệp Môi trường dé họa của Dreamweaver với các bảng điều

khiến va các cửa số sẽ cho phép những người mới sử dụng tạo được các Website

cao cấp cho dù chưa từng viết mã HTML.

Với Dreamweaver ta có thé bô sung các đối tượng Flash ma chúng ta

tạo trực _~ Gong Dreamweaver nhu: Flash Button, Flash text va Flash Movie.

1.2.2 LAM VIEC CUA MACROMEDIA DREAMWEAVER MX 2004

* Biéu tượng:

* Giao điện:

Thanh Document

Các bảng điều khiên Thanh toolbar

Show code and design views Show code view

SOTH: Uguygen Agee Anh Thi Frang 21

Khéda luận tất gkiệp GOUWD: TS Lé “Trọng Tin

* Vùng làm việc: Dreamweaver có thê hiện thị tai liệu theo 3 cách:

© Show code view: chế độ hiển thị mã code HTML

e Show code and design views: ché độ vừa hiển thị mã Code HTML và nội dung thiết kẻ.

e© Show design view: hiền thị nội dung thiết kẻ

1.2.3 CÁC NỘI DỤNG CO BẢN CUA MACROMEDIA

1.2.3.1 Lập kế hoạch và thiết lập site

123.11 Lập kế hoạch

- Khi lập kết hoạch hãy đặt ra những câu hoi, vi dụ: mục đích của

Website đỏ, đối tượng phục vụ là ai, khách hàng dùng trình duyệt nao để

xem điều chỉnh yếu can xem xét là người dùng có thé dé dang duyệt Website của

ban hay không Từ đó bạn có thé phát triển một mô hình cho Website của minh

- Giai đoạn lập kế hoạch có yếu tố quyết định sống còn đối với sự

thành công của một Website.

1.2 3.12 Thiết kế site

- Để thiết lập một site mới trong Dreamweaver, cần tạo một thư

mục trên 6 đĩa cứng mà trong đó sẽ lưu trữ tất cả các trang web

- Nên ngắt Site thành nhiều hạng mục, đưa các trang quan hệ vào cùng một thư mục giúp cho việc quan lý Site dé dang và dễ định hướng hon.

1.2 3.13 Định nghĩa một Site

~- Việc định nghĩa một site sẽ lam việc sẽ

cho phép Dreamweaver theo dõi các tải

nguyên liên kết.

- Chọn menu Site/ Manage Site.

- Chon New/ Sites

Nhập các tùy chọn sau:

SOTH: Aguyen Ugoe Ankh That Frang 22

Xkáa luận tất ngkiệp 402/0: TS Lé CTrọng Tin

> Site Name: nhập tên dành cho Site.

> Local Root Folder: chi định thư mục tao trên 6 đĩa cứng đẻ lưu trừ Website

> Default Images: tạo thư mục dé chứa hình ảnh.

Nhắp OK cửa số Site sẽ mờ

1.2.3.14 Tạo Folder và các file site

- Tạo Folder: chọn thư mục can tạo thư mục con, vào menu File/

New Folder va nhập tên thư mục.

- Tạo file site: chọn thư mục cần tạo filesite, vào menu File/ New

File và nhập tên file Chú ý: tên file site phải có phần mở rộng: html

- Định trang chủ của site, ta chọn filesite cần định và vào menu

Site/ Set as Home Page.

1.2.3.2 Trình bày thiết kế trang in I.2 3.2.1 Thiết lập thuộc tính trang

~ Vào Menu Modify/Page Properties

> Page font: Chọn các tổ hợp font dé định dạng cho text, xác

định font mặc định, Edit font List: ding dé chỉnh sửa tô hợp Font.

» Site: chọn kích thước cho text.

> Background color: chọn màu nên cho Background.

> Background Image: thiết lập ảnh nền Background.

SOTH: Uguyén Hgge Anh Thi Trang 23

Khda luận tất egkiệp GOW: TS Lé “Trọng Tin

> Margin: canh phan tử theo cạnh của trang (nên nhập 0 cho 4

- Chon mục Links trong hộp Category:

> Link font: chọn tổ hợp font cho van ban liên kết.

> Site: chọn kích thước cho văn bản liên kết.

> Link color: màu của văn bản liên kết trên trang web khi thé

hiện trong trình duyệt

> Vistited links: màu của văn bản liên kết cho người sử dụng

biết đã xem qua liên kết này.

> Rollover links: màu khi lăn chuột qua.

> Active links: màu văn bản khi người sử dụng nhấp chuột qua.

> Underline style: chọn chế độ gạch dưới cho các đoạn văn bản

Xkda luận tất ngkiệp GOWD: TS Lé “Trọng Tin

el

- O chế độ Layout View, chọn công cụ Layout Table ở ché độ Layout trên thanh

Insert, trỏ chuột biển thành dau cộng Dat trỏ chuột nơi can trình bay trên trang sau

đó rê chuột đề tạo bảng trình bày.Các Layout Table có thé về chong lên nhau.

* Dinh dạng Layout lable:

Chon Layout Table bang cách nhấp chuột vao mép của

Layout Table thiết lập các tùy chon trên thanh Property:

Gan ND GHG 222 SG bu ey

Cươn om SS

> With: thay đổi kích thước chiều rộng của Layout Table.

» Height: thay đôi kích thước chiều cao của Layout Table.

> Background color: định mau

» CellPad: định khoảng cách trong 6 và viễn 6.

> Autostretch: tự đặt thiết đặt kích thước cho Layout Table.

b) Layout Cell:

* Vệ Layout Cell:

- Ở chế độ Layout View, chọn công cy Layout Cell ở ché độ

Layout trên thanh Insert, trỏ chuột biến thành dấu cộng Đặt trỏ chuột nơi cần trìnhbay trên trang sau đó rẻ chuột dé tạo bảng trình bảy

- Lưu ý: các Layout Cell không bao giờ năm chồng lên nhau, cách trình bảy của Layout theo | lưới các 6 với nhiều hàng hoặc nhiêu cột.

* Dinh dang Layout Cell; Tương tự như phan định dang

Layout Table.

SOTH: Hguygén Hage Anh Tha “rang 25

“Xháa luận tất nsgkiệp (02/0: TS Lé Trong Tin

——ễ—————Ễ——————————

lại tent | with fied is: MỤC: — su l] Qạw@Ƒ Qejxe | :

; a HT — mie 3

> Horz: cải đặt tính năng gióng hang theo chiêu ngang cho các đổi tượng

-trong layout cell.

> Verz: cài đặt tính năng gióng hang theo chiều doc

> Autostretch: tự động thiết đặt kích thước cho Layoutcell.

> No wrap: nếu 6 này được chọn nó sẽ ngăn việc ngắt tự, không cho ngắt

sang một dong mới.

1.2.3.3 Chèn và định dạng Text

1.23 31 Chén Text vào tài liệu

* Dé dua text vào tai liệu ta có thé thực hiện một trong các cách

sau:- Gõ trực tiếp vào tải liệu.

- Sao chép Text từ một tải liệu khác và dan vào tài liệu Dreamweaver.

Chủ ý:- Dé ngắt dòng : Insert Line Break (Shift + Enter)

- Dé chèn khoảng trang: Insert None- Breaking Space.

* Dinh dang Text:

> Format : áp dụng kiểu khối mặc định cho Text, dùng để định

dang tiêu dé Heading, Paragraph.

» Font: dùng các tổ hợp font dé định dang Text, xác định font

mặc định Edit font list: dùng để chỉnh sửa các tỏ hợp font.

> Size: định kích thước cho Font

mee STI Eel

> Target: xác định Frame hoặc cửa sé trang liên kết tải về

SOTH: (Ä\guuŠn (JÍgọ« Anh Tht rang 26

Khda luận tất aghi¢p 40⁄0: TS kè “Trọng Tin

>Link: dùng để thực hiện liên kết cho Text được chọn có thé

gan liên kết cho Text như sau: nhấp vào biểu tượng Folder đẻ chỉ định liên kết đến

một trang trong Site.

1.2332 Chỉnh sửa 16 hợp Front

- Sử dụng lệnh Edit Font List trong Property, vào Default Font

chon Edit Font List xuất hiện cửa sé:

- Nếu chuyén các font từ Available sang thư myc Chosen Fonts thi

thém font vao Font list.

- Nếu chuyển font từ Chose Fonts sang myc Available fonts thì bỏ

bớt font.

1.2.3.4 Hình ảnh- image

1.2.3.4 1 Chèn hình ảnh

- Khi ta chèn hình ảnh vào trong tải liệu Dreamweaver, thi file

hình ảnh phải được lưu vào trong site nếu hình ảnh chưa có trong site thì Dreamweaver sẽ hỏi bạn có muốn sao chép sang site gốc hay không.

- Đặt điểm chèn tại vị trí muốn chèn, nhấp biểu tượng Image trên

thanh Insert.

®=á¿ÍCS-é-nq|p-z

SOUTH: Uguygéen Ugge Ankh “Thư Trang 27

Xấa luận tất œgkiệp GOWD: TS, kỉ Trang Tin

EEEEEEEEEEEEEEEEEEe!

!L3342 Rollover Image

- Rollover Image lă một hinh anh sĩ được thay đôi khi trỏ chuột di

chuyín qua nó.

- Tạo Rollover lmage:

> Đặt trỏ chuột tại vị trí muốn chĩn Rollover Image.

> Nhắp biíu tượng Rollover Image trín thanh Insert.

Original Image: hình ảnh hiến thị khi trang được tải về.

Rollover Image: hình anh hiín thị khi rí chuột qua.

Preload rollover image: câc hình ảnh được tải trước trong bộ trình duyệt để

chúng tải nhanh hơn.

When Clicked, Go to URL: chỉ định file hoặc trang can liín kết

1.2.3.5 Media

Dreamweaver MX cho phĩp bạn chỉn đm thanh va movie cho

Web site của bạn một câch nhanh chóng va dĩ dăng Bạn có thể kết hợp vă chỉnh

sửa câc tập tin vả câc đối tượng multimedia như câc Java applet, câc movie Quick

Time Flash va Shockwave, câc tập tin MP3 audio, -

Chỉn câc đối tượng media: Dat điểm chỉn ở vị tri muốn chĩn đối

tượng va click vao mũi tín thả của biểu tượng Media trín nhóm Common của

thanh Insert, chọn nút tương tne.

SOUTH: (guu¿n ⁄(qgọ« Anh Thu rang 28

Xkáa luận tất ngk¿ệp GOWD: TS kê Trọng Tin

/,2.3.5.1 Chén Flash Movie

~ Dat điểm chèn ở vị trí muôn chèn Flash Movie.

- Click nút ® Flash trong lớp Media trên thẻ Common của

thanh Insert hay chọn trình don Insert / Media / Flash

- Hộp thoại Select File hiển thị, chọn tập tin Flash Movie cần

chèn, click OK

- Thiết lập thuộc tinh cho Flash Movie trong thanh Properties.

l.2.3.3.2 Chèn Flash Button

- Đặt diém chèn trong cửa sô tải liệu

- Click nút a Flash Button trong lớp Media trên thẻ Common

của thanh Insert hay chọn trinh don Insert / Media/ Flash Button

- Hộp thoại Insert Flash Button hiển thị:

Khéda luận tất nghiệp GOD: TS Lt “Trọng Tin

{1}: Sample: hiển thị mẫu nút cho ban xem trước khi ban chọn kiểu nút từ danh

sách Style.

[2]: Style: hộp hiện thị danh sách các kiêu nút Dreamweaver MX hỗ trợ cho bạn

[3]: Button Text: nơi nhập nội dung cho button.

[4]: Font, Size: chỉ định kiêu chữ và cỡ chữ cho button.

{5}: Link: nhập liên kết tương đổi hoặc tuyệt đối cho nút Nếu bạn sử dụng môi liên

kết tương đối, thi phải đảm bảo là tập tin SWF được lưu trên cing thư mục với tập

tin HTML.

[6]: Target: xác định tên frame đích hoặc cửa số đích cho mối liên kết của nút Flash

sẽ mở.

[7]: Bg Color: đặt màu nên cho movie Flash.

(8|: Save 4s: nhập tên tập tin dé lưu tập tin SWF mới Nếu tập tin chứa mối liên kết

tương đôi, bạn phái lưu tập tin vào cùng thư mục chứa tài liệu HTML hiện thời.

I.2.3.5.3 Chén Flash Text

- Dat điểm chèn trong cửa sé tải liệu

[1]: Font, Size: chọn kiêu chữ và cỡ chữ cho đoạn Flash Text.

SOTH: Haugen Agee Ankh That Trang 30

Khda luận tất “gkiệp GOWMD: TS Lb “Trọng “Tín

(2|: Color Rollover Color: dat mau cho chữ va đặt mau cho chữ khi di chuyền

chuột lên đoạn text.

|3]: Text: nhập nội dung bạn muốn vào trường text, dé thấy kiêu font xuất hiện trên

trường text, bạn chọn Show Font.

[4]: Link: nêu bạn muốn kết hợp một môi liên kết với đối tượng văn bản Flash,nhập vào mỗi liên kết tuyệt đôi hdc tương đối

[5]: Target: nếu bạn đã nhập mối liên kết, thi có thé chí định frame hoặc cửa sốdich cho mối liên kết đó

|6]: Bg Color: đặt màu nên cho văn bản.

[7]: Save As: nhập tên tập tin để lưu tập tin SWF mới Nếu tập tin chứa mối liên kết

tương đối bạn phải lưu tập tin vào cùng thư mục chứa tài liệu HTML hiện thời.

(3354 Chèn một đoạn phim

- Dat điểm chèn ở vị trí muôn chén nội dung Plug-in.

- Click vào nút Plug-in & trong lớp Media trên the Common

của thanh Insert hay chọn trình don Insert / Media /Plugin

- Sau khi chèn nội dung cho Plug-in, ban su dụng bang Properties

dé đặt các tham số cho nội dung đó.

Các trang web sử dụng frame được chia ra làm các phản riêng biệt.Tắt cả các frame kết hợp lại với nhau tạo ra một frameset

Với đặc điểm di chuyền, frame có thé giữ lại một số thông tin nao

đó không đôi trong khi các thông tin khác thay đôi trên cùng một trang.

Tạo Frame - Frameset: Có 2 cách dé tạo Frame; Thiết kế từng

Frame dé xây dựng Frameset va chọn nhiều Frameset được xác định trước.

SOTH: Aguyéen Hage Ank Thit Frang 31

Xkáu luận tất n“gkiệp (02⁄0: TS Le “Trọng “Tín

* Tạo Frame dé xây dựng Frameset:

- Đặt điểm chèn trên tai liệu can tạo.

- Vào Modify/Frameset/chon các loại Frameset

như: Slip Frame Left, Slip Frame Right

- Ré đường viền Frame ra khỏi trang đề xóa một

Frame.

* Tao Frameset được xác định trước.: Đặt điểm chèn trên tài liệu

cẩn tạo có 2 cách tạo:

Panel.

- Chon Frameset được xác định trong hạng mục trong Objects

- Vào Insert/HTML/Frame, chọn kiêu Frameset được xác

định trước

1.2.3.7 Navigation Bar

* Navigation Bar bao gồm một ảnh (hoặc một tập ảnh) hiển thị

những thay đối theo thao tác của người sử dụng Nó giúp di chuyển dé dàng giữacác site và các tập tin trong site Một thành phần của thanh định hướng có thé có 4

trạng thái:

Up: Hình ảnh hiển thị lúc người dùng chưa nhấp hoặc tương tác

Over: Hình ảnh hiển thị khi chuột lăn qua

Down: Hình ảnh hiển thị sau khi được Click chuột Over White Down: Hình ảnh hiện thị khi chuột cuộn qua hình ảnh Down

* Cách tạo Navigation Bar:

- Insert / Image Objects / Navigation Bar

- Chon biéu tượng Navigation Bar =! trong mũi tên tha xuéng

của biéu tugng Image trén the Common cua thanh Insert

SOTH: Aguyen ((gọ« Anh Thi Frang 32