BÀI 2 NGÀY 20.10.2007 JACKIE ĐÔ GỢI Ý . TRƯỚC KHI TẠO WEB , BẠN NÊN TẠO 1 FOLDER WEB Ở DESKTOP . ĐÂY LÀ FOLDER CHỦ YẾU CHỨA CÁC FOLDER CON . TRONG CÁC FOLDER CON CHỨA CÁC DỮ LỆU CẦN THIẾT CHO VIỆC TẠO THÀNH TRANG WEB . TRONG BÀI VIẾT SỐ 1 CÓ THIẾU SÓT LÀ KHÔNG TẠO FOLDER WEB VÀ CÁC FOLDER CON NÊN KHI UPLOAD FILE HTML LÊN MẠNG NÓ KHÔNG ĐỦ DỮ LIỆU CẤU THÀNH TRANG WEB , DO ĐÓ KHÔNG HIỆN RA HÌNH KÈM THEO . NGOÀI RA HIỆN NAY UTBINH CŨNG CHƯA TÌM RA ĐƯỢC TẠI SAO LẤY 100% CODE SAU KHI ĐÃ TẠO TRANG WEB THÀNH CÔNG , DÁN VÀO NOTEPAD UPLOAD LÊN MẠNG VẪN CHƯA CÓ HÌNH HIỆN RA MÀ PHẢI DÁN VÀO FOLDER WEB NÓ MỚI CHỊU LẤY DỮ LIỆU TRONG FOLDER IMAGES ĐỂ HIỆN HÌNH RA.ĐÚNG RA LÀ CHỈ CẦN VIẾT CODE TRONG NOTEPAD LÀ ĐỦ DIỀU KIỆN TẠO WEB . DO RẤT DỄ THỰC HIỆN NÊN TÁC GIẢ ÍT NÊU HÌNH MINH HỌA . CHỈ KHI NÀO CẦN THIẾT THÌ MỚI DẪN CHỨNG CỤ THỂ . HY VỌNG LÀ CÁC BẠN ĐÃ QUEN VỚI CÁC DANH TỪ TẠO WEB TRONG CÁC BÀI TRƯỚC ĐÃ NÊU. BÁO LÀM BẠN VỚI MÁY VI TÍNH SỐ 224 CÓ BÀI YPOPS TRUY CẬP YAHOO MAIL BẰNG TRÌNH DUYỆT MAIL POP3 CỦA NGUYỄN VĂN ĐÔ ([email protected]) CÓ NGHĨA LÀ BẠN MỞ THƯ VÀ GỞI THƯ YAHOO MAIL BẰNG OULLOOK EXPRESS .

I.GIAO DIỆN THIẾT KẾ WEB : Nhấp Menu Task Panes. 1. Hiện ra các Thẻ > Bạn cần dùng Thẻ nào thì nhấp lên Thẻ đó > Không muốn Thẻ nào hiện diện thì nhấp lên tên Thẻ đó. 2. Muốn trở về giao diện chuẩn lúc ban đầu : Nhấp Reset WorkSpace Layout . Mặc định đã có đánh dấu chọn 4 Thẻ thường dùng . (H1). 1

3. Muốn giao diện vùng làm việc là Trang Trắng lớn rộng rải dễ làm việc không có hiện diện của Thẻ nào chiếm chổ : Nhấp lên tên của 4 Thẻ nầy để xóa bớt không gian cho rộng . (H2).

2

II.TẠO CÁC FOLDERS : Tạo Folder Web ở Desktop 1. Folder Cha : Khi tạo bất cứ Trang Web nào , trước tiên bạn phải tạo 1 Folder chủ yếu đó là Folder Web thường đặt ở Desktop . Đây là Folder Cha ( Chữ Cha do utbinh đặt , không có sách vở nào đặt tên như vậy ), nó có ít dung lượng càng dễ Upload và đọc giả Download nhanh . Nhấp Phải lên Desktop > New > Folder > Nhập : web2 ( Tên Folder nầy phải viết chữ thường và dính lại , nếu trên 2 từ thì phải có gạch nối dưới để tránh bị thêm 20% rất rối mắt , khó đọc , ví dụ : web_2 ) . 2. Folder Con : Nhấp đúp lên Folder Cha là web2 > Nhấp Phải > New > Folder > Nhập : images. Bạn vừa tạo xong Folder images nằm trong Folder web2.Tiếp tục tạo các Folders khác có tên : lessoons – musics – favorite_webs – photo_gallery.v.v… 3

III.BỔ SUNG CÁC DỮ LIỆU TRONG CÁC FOLDERS VỪA TẠO : 3. Folder images : Bạn Copy các hình cần dùng cần Insert vào Trang Web > Paste vào Folder nầy . 4. Folder lessons : Bạn chọn các bài viết cần xuất hiện trên trang Web > Paste vào Folder nầy hoặc tạo 1 Trang .doc chứa các Links URL của các lessons. 5. Folder musics : Tạo 1 Trang.doc chứa các Links URL của các bản nhạc ưa thích để đọc giả nhấp lên Download về . Có thể Copy > Paste các bản nhạc Midi vì dung lượng ít hoặc dùng Chương trình Total Audio Converter 2.1 để làm giảm dung lượng các Files MP3 convert thành File wma thì PC nào cũng đọc được do chương trình Window Media Player rất phổ thông. 6. Folder favorite_webs : Tạo 1 File.doc chứa các Links URL các trang Web mà bạn ưa thích muốn giới thiệu với đọc giả . 7. Folder photo_gallery : Chọn các hình cần tạo Gallery , dùng Chương Trình Photoshop tạo rồi Paste vào Folder nầy. 8. Các Folders khác : Bạn có thể tạo thêm các Folder khác nếu muốn như : about_me , contact , links , resume , styles và file master.dwt.

IV.NHẬP NỘI DUNG THIẾT KẾ TRANG WEB HTML : web 2 1. Nhập TEXT : • File > New > HTML. • Nút Style chọn Heading 1

> Gỏ : Thiết kế Trang Web HTML Đơn Giản 2 > Bôi đen câu nầy. • Nút Font chọn : Arial, helvetica , sans-serif > Chọn Bold > Center > Nút Font Color chọn Red . • Copy 1 bài Text : Phím Window+E > Đến bài cần chọn > Mở bài nầy ra > Copy > Edit > Paste . • Nhấp Phím F12 để xem thử kết quả trên Trình Duyệt Web > ra bảng Microsoft Exp[ression Web yêu cầu bạn lưu File nầy > Yes > Chọn Desktop > Nhấp lên Folder web2 mà bạn đã tạo lúc ban đầu trước khi thiết kế Web > File Name nhập : indext > save . • Hiện ra trên Trình duyệt Trang Web mà bạn vừa tạo. 2. Nhập HÌNH : • Chọn Hình : Chọn Ví dụ 4 hình > Paste vào Folder images > Mở Chương trình ACD See > Đến 4 hình nầy ( Có tổng cộng 288 KB ) > Ctrl+A > Batch Resize Images > Chọn Percentage Of Original > Percentage chọn 40% > Start Resize > Còn tổng cộng 4 hình là 50 KB > Batch Rename là 1,2,3,4. 4

•

• •

• •

Nhấp con trỏ chỉ định nơi đặt hình > Insert > Picture > From File > Desktop > Folder web2 > Folder images > Nhấp lên Hình 1 > Ra bảng Accessibility Properties > Hàng Alternate Text nhập 1 > hàng Long Description nhập : 500 đồng > Ok > Đã có hình 1 trên Trang Web > Nhấp Nút Align Text Left để dời hình sát bên trái . Tiếp tục giống trên cho các hình 2 , 3, 4. Menu View > Toolbars > Chọn Tab Pictures > Hiện ra Bộ Công cụ của Tab Pictures > Chọn hình cần dời > Nút Bring Forward > Để con trỏ lên rìa hình > Có mủi tên 4 đầu > Rê hình đến vị trí mong muốn > Nhấp ngoài hình bỏ các nút. F12 > Yes > Ok > Trình duyệt hiện ra Trang Web có 4 hình vừa Insert vào . Xem thử trên Các Trình Duyệt : Khi trong máy bạn có cài các trình duyệt , Expression Web tự động nhận diện và liệt kê . Nhấp File > Preview in Browser > Chọn Window Internet Exploer 7.0 > Hiện ra Trang Web trên IE 7.0. > Nhấp File > Preview In Browser > Chọn Mozilla FireFox 2.0 > Hiện ra Trang Web trên Trình Duyệt FireFox 2.0.

V.UPLOAD TRANG WEB HTML WEB2 LÊN HOST SERVER : 3. Mở Chương Trình Cute FTP ( Đã có viết bài Hướng dẫn sử dụng chương trình nầy ) > Cột Trái mở Desktop > Rê Folder web2 qua Cột Phải là Host Server có sẵn của bạn ( Tạo Host bằng Host Free : www.freewebtown.com . utbinh đã có bài viết hướng dẫn tạo Account trong Host Free nầy , rất mạnh cho 2 GB Dung lượng lưu trữ và 2 GB băng thông , Upload cả Folder cũng được , tạo Account nhanh . utbinh tạo Trang Web đến nay vẫn tồn tại sau 3 năm ) > Khi Upload xong 100% Ô giữa hiện chữ DIRECTORY LISTING COMPLETED . 4. Nhập lên Folder web2 ở Cột Phải > Hiện ra các Folders và các Files nằm trong Folder web2 > Nhấp Phải lên 1 File hay Folder > Properties > Bạn sẽ thấy chi tiết của Link URL file nầy. 5. Kết quả Link URL của Trang Web HTML web2 : http://utbinh.com/OCT/web2/index.htm Giải thích : • http://utbinh.com/ : Host của utbinh • OCT : Folder utbinh tạo để phân biệt từng tháng. • web2 : Folder Web Cha. • index.htm : Trang Chủ hay Home Page , đây là Trang đầu tiên khi mở Trang Web mà bạn vừa thiết kế.(H3). 5

VI . TẠO FILE WEB2 .HTML TRONG NOTEPAD : 1. Nhấp Nút Code > Ctrl+A > Copy toàn bộ Code của Trang web2 vừa tạo > Paste vào NotePad. 2. File > Save As > Desktop > > Folder web2 > File Name nhập : web2.html > save as Type chọn : All Files > Encoding chọn UTF-8 > Save. 3. Nhấp Folder web2 ở Desktop > Nhấp lên File web2.html > Hiện ra Trang Web trong Trình Duyệt.

NGÀY 19.10.2007 : 1.EXPRESSION WEB : Thiết kế Web HTML Đơn Giản 1. [img]http://utbinh.com/OCT/19107B/expressionweb1.jpg[/img] http://utbinh.com/OCT/19107B/expressionweb1.jpg http://utbinh.com/OCT/19107B/expressionweb1.doc 6

DOC 1080 KB – JPG 1110 KB Kết quả thực tập : http://utbinh.com/OCT/19107B/ExpressionWeb1.htm http://utbinh.com/OCT/19107B/web1.html http://utbinh.com/OCT/19107B/CodeWeb1.doc Bài đọc thêm : http://utbinh.com/OCT/19107B/MicrosoftExpression.docx(355K B) http://utbinh.com/OCT/19107B/MicrosoftExpression.doc(396K B) NGÀY 20.10.2007 : 2.EXPRESSION WEB 2007 : TK WEB HTML ĐƠN GIẢN 2. [img]http://utbinh.com/OCT/20107/web2.jpg[/img] http://utbinh.com/OCT/20107/web2.jpg http://utbinh.com/OCT/20107/web2.doc DOC 508 KB – JPG 1160 KB Kết Quả Thực Tập : http://utbinh.com/OCT/20107/web2/index.htm http://utbinh.com/OCT/20107/web2/web2.html Bài Đọc thêm : http://utbinh.com/OCT/20107/web2/Save.dot(50KB) http://utbinh.com/OCT/20107/web2/SAVE.doc(35KB) Download Hình về Thực tập : http://utbinh.com/OCT/20107/web2/images/1.jpg http://utbinh.com/OCT/20107/web2/images/2.jpg http://utbinh.com/OCT/20107/web2/images/3.jpg http://utbinh.com/OCT/20107/web2/images/4.jpg HOST FREE : WWW.FREEWEBTOWN.COM Hướng dẫn sử dụng HOST Fre : www.freewebtown.com http://www.freewebtown.com/utbinh60/SEPTEMBER/freewebto wn/freewebtown.doc NGÀY 16.9.2006 : 8.Cute FTP 8 Pro http://utbinh.com/SEPTEMBER/bai8/cuteftp8pro.doc DOC 1202 KB – JPG 1151 KB Download Software : http://utbinh.com/SEPTEMBER/CuteFTP8Professional.rar NGÀY 19.10.2007 : 1.EXPRESSION WEB : Thiết kế Web HTML Đơn Giản 1. http://utbinh.com/OCT/19107B/expressionweb1.doc DOC 1080 KB – JPG 1110 KB Kết quả thực tập : http://utbinh.com/OCT/19107B/ExpressionWeb1.htm http://utbinh.com/OCT/19107B/web1.html http://utbinh.com/OCT/19107B/CodeWeb1.doc Bài đọc thêm : 7

http://utbinh.com/OCT/19107B/MicrosoftExpression.docx(355K B) http://utbinh.com/OCT/19107B/MicrosoftExpression.doc(396K B)

8