Bài giảng Dreamweaver mmx

DREAMWEAVER MMXI. GIỚI THIỆU Tự sinh mã HTMLMôi trường thiết kế WYSIWYG (What You See Is What You Get)Cung cấp nhiều khả năng thiết kế Hỗ trợ các tính năng JavascriptHỗ trợ nhiều tính năng đồ hoạ GIAO DIỆN CHƯƠNG TRÌNH Các thành phần:Vùng làm việc chính: là nơi cho phép thao tác, thiết kế trangBảng điều khiển đối tượng (Insert): Nơi cung cấp tất cả các đối tượng trên trang web (image, button, table, ...)Bảng thuộc tính (Properties): chứa tất cả các thuộc tính của đối tượng hiện hành Thanh Menu: nơi cung cấp mọi tính năng của chương trình GIỚI THIỆU Bảng điều khiển InsertBảng điều khiển PropertiesLưu ý:Gọi các bảng điều khiển trên bằng cách chọn Menu Window/tên bảng điều khiểnNhấn tổ hợp phím Ctrl+F2: Bật/tắt ĐK InsertNhấn tổ hợp phím Ctrl+F3: Bật/tắt ĐK 	PropertiesNhấn F4: Bật/tắt nhanh tất cả các bảng điều khiển đang có trên màn hìnhNhấn F12: Xem nhanh trang web trong cửa sổ trình duyệt Mở và lưu file (Chọn Menu File):Open: Mở một trang đã tồn tạiNew: Tạo trang mớiSave: Lưu trang hiện tại Save as: Lưu trang hiện tại với một tên khác Dòng tiêu đềẢnh nềnMàu nềnMàu chữIII. LÀM VIỆC VỚI VĂN BẢNSử dụng tổ hợp phím Shift + Enter để tạo ngắt dòng (), Enter để tạo ngắt đoạn ()a. Chọn font cho văn bản: Thiết lập font: Chọn Edit font List (bảng Properties)/Tìm font/nhấp Add/OkThiết lập font mặc định: Chọn Menu Edit/Preferences/Font/Chỉ định font/OkCác định dạng khác:Size: Kích thước văn bảnColor: Màu văn bảnĐậm, nghiêng, gạch chânCanh trái, phi, giữaTạo bullet, Index, ...Định dạngFont chữCở chữCanh lềTạo liên kếtTạo danh sáchb. Định nghĩa kiểu: Cho phép định nghĩa một kiểu cho trước để sử dụng lại nhiều lần khi cần.Thực hiện: Chọn Menu Text/HTML Style/định nghĩa & đặt tên cho kiểu/OkÁp dụng: Quét chọn đoạn văn bản cần định dạng/right click/HTML Style/Chọn tên kiểu đã định nghĩa IV. BỔ SUNG ĐỒ HOẠ Một số lưu ý khi sử dụng đồ hoạ:Chỉ nên sử dụng ảnh dạng nén (*.gif, *.jpg, *.jpeg), Cắt nhỏ các ảnh lớn, Dung lượng của ảnh < 25KbTổng dung lượng của trang < 150KbMột website được đánh giá tốt và cuốn hút người dùng chỉ khi trang web được thiết kế đẹp mắt và thời gian tải nhanh chóng a. Chèn ảnh vào trang: Chọn Menu Insert/ImageChọn Insert Image trực tiếp từ bảng Insertb. Các thuộc tính:W(Width): Độ rộng hình ảnhH(Height): Chiều cao ảnhBorder: Xác định độ dày viền ảnhLink: Thiết lập liên kết cho hình ảnhAlt: Tạo ghi chú cho ảnh Các thuộc tính:-Vspace: Thiết lập khoảng trống phía trên & phía dưới ảnh-Hspace: Thiết lập khoảng trống phía trái & phía phải ảnh-Map: Công cụ cho phép tạo các điểm liên kết nóng trên hình ảnh (bản đồ ảnh)Reset Size: Trở lại kích thước ban đầu của ảnh V.THÊM CÁC HIỆU ỨNG CHO TRANG WEB Chèn văn bản Flash: Chọn Menu Insert/Interactive Image/Flash TextCác thuộc tính:- Color: Màu cho văn bảnBg Color: Thiết lập màu nền văn bản RollOver Color: Màu thể hiện khi rê chuột trên văn bản Link: Thiết lập liên kếtTarget: Xác định cách thức mở trang liên kếtSave As: Lưu thành tập tin flash (*.swf)V.THÊM CÁC HIỆU ỨNG CHO TRANG WEB 2. Chèn nút lệnh Flash: Chọn Menu Insert/Interactive Image/Flash Button Style: Kiểu nút lệnh flash 3. Chèn một file Flash: Chức năng nhúng 1 file Flash đã có vào trang webChọn Menu Insert/Media/Flash/chỉ định file Flash/Ok 4. Tạo hiệu ứng hoán chuyển hình ảnh(SwapImage): thay đổi ảnh hiện tại bằng một hình ảnh khác khi rê chuột trên ảnhChọn Menu Insert/Interactive Images/RollOver ImagesCác thuộc tính:Original Image: Chọn ảnh nguồnRollOver Image: Chọn ảnh thay thế khi người dùng rê chuột trên đối tượngLink: Thiết lập liên kết cho ảnh