Giới thiệu ngôn ngữ HTML

n 
 Insert/Component/Marquee. Sau khi hộp thoại hiện ra, bạn gừ vào dũng chữ 
 cần chuyển động và đặt cỏc thuộc tớnh khỏc như màu sắc, font chữ, … 
 • Thờm hiệu ứng font chữ cho cỏc hyperlink: Chọn Format/Background, check 
 vào Enable hyperlink rollover effects. Sau đú bạn cú thể chọn cỏc màu theo ý 
 muốn. 
2.6. Chốn ảnh 
 • Chọn chức năng Insert/Picture/From File. 
 • Đặt thuộc tớnh và kớch thước của ảnh, click phải chuột lờn ảnh, rồi chọn Picture 
 Properties. 
 • Để tạo cỏc hotspot hyperlink, ta chọn hỡnh vẽ tương ứng (hỡnh chữ nhật, 
 ellipse, …) trờn thanh toolbar pictures. Chọn vựng trờn ảnh, rồi điền thụng tin 
 của hyperlink vào 
2.7. Chốn hyperlink 
 • Chọn chức năng Insert/Hyperlink. 
 • Sau khi hộp thoại hiện ra, gừ vào hyperlink tương ứng. Cú 3 dạng: 
 o Địa chỉ Internet, cú dạng: http://… Vớ dụ: http:// www.yahoo.com 
 o Liờn kết tới một trang trong site, cú dạng: /thư mục/tờn tập tin. Vớ dụ: 
 ../images/shopping.htm 
 o Liờn kết ngay chớnh trong trang, đặt bằng bookmark. 
3. Định dạng trang 
Giáo trình thiết kế Web 20
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
 • Click phải chuột lờn trang, chọn Page Properties. 
 • Để đặt màu nền cho trang, chọn Background/Colors/Background 
 • Để đăt ảnh nền cho trang, chọn Background/Formatting/Background picture. 
 • Để đặt cỏc thụng số về màu sắc cho hyperlink, chọn 
 Background/Colors/Hyperlink 
 • Để đặt tiờu đề cho trang chọn General/Title. 
Giáo trình thiết kế Web 21
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
II. THỰC HÀNH 
1. Tạo trang web cho nhúm. 
 • Khởi động Microsoft Front Page 2000. 
 • Soạn trang web cỏ nhõn của nhúm đặt tờn là InfoGroup.htm (vớ dụ 
 nhúm 1 sẽ lấy tờn là InfoGroup1.htm). Cỏc thụng tin chớnh của cỏc thành 
 viờn trong nhúm bao gồm: Họ và tờn, Cụng việc và chức vụ hiện nay, Địa chỉ 
 liờn lạc, Điện thoại, Fax, Email, Mobile Phone, ... Ngoài ra cỏc nhúm cú thể bổ 
 sung cỏc thụng tin khỏc. 
 • Upload trang web đó soạn lờn website. 
 • Thử truy cập trang web đó tải lờn. 
2. Tham khảo cỏc site thụng tin của Việt Nam 
 •  
 •  
 •  
3. Tham khảo cỏc site bỏn hàng nổi tiếng 
 •  
 •  
4. Tham khảo cỏc site giải trớ 
 •  
 •  
 •  
 •  
 •  
5. Tham khảo cỏc site về lao động việc làm tại VN 
 •  
 •  
 •  
6. Tạo trang web chứa cỏc hyperlink dựng để truy cập nhanh 
 • Tạo trang web đặt tờn là Links.htm chứa cỏc hyperlink đó đề cập ở trờn. Bổ 
 sung thờm cỏc hyperlink và cỏc phõn loại khỏc mà cỏc anh chị đó biết. 
 • Upload lờn website và kiểm tra lại. 
7. Tạo trang HomePage 
 • Tạo trang web HomePage đặt tờn là Default.htm giới thiệu về nhúm và cỏc 
 cụng việc mà nhúm đang triển khai. 
 • Kết nối hai trang đó tạo vào HomePage. 
 • Upload lờn website và kiểm tra lại. 
8. Chọn chủ đề để thiết kế website 
 • Website về dịch vụ việc làm. 
 • Website về dịch vụ nhà đất ( 
Giáo trình thiết kế Web 22
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
 • Website bỏo điện tử ( ) 
 • Website trường học. 
 • Website bỏn hàng (cửa hàng, siờu thị ảo trờn Internet) 
 • Website dịch vụ giải trớ như ECards, Điện hoa, ... 
 • Cỏc chủ đề khỏc... 
Giáo trình thiết kế Web 23
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
III. ĐĂNG KÍ WEBSITE MIỄN PHÍ TRấN INTERNET 
 1. Vào địa chỉ  để đăng kớ website miễn phớ với địa chỉ 
truy cập cú dạng  
2. Gừ vào địa chỉ mà bạn dự định đăng kớ tại ụ yourname. Sau đú click Go. Màn hỡnh 
tiếp theo sẽ hiện ra, bạn chọn mục cuối cựng 100% Free Hosting Option và click 
vào SignUp 
Giáo trình thiết kế Web 24
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
3. Sau đú bạn hóy điền vào cỏc thụng tin liờn quan cần thiết như Họ tờn, mật khẩu, 
email, … Cuối cựng gừ vào ARTK để chắc rằng bạn đó đồng ý với cỏc qui định của 
FreeServers khi cung cấp dịch vụ miễn phớ này. 
4. Nếu đăng kớ thành cụng, màn hỡnh sau sẽ hiện ra để cung cấp cho bạn một số lựa 
chọn khi xõy dựng website của mỡnh. 
Giáo trình thiết kế Web 25
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
Giáo trình thiết kế Web 26
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
IV.THIẾT KẾ MỘT SỐ WEBSITE MẪU 
1. Thiết kế website theo mẫu sau ( 
2. Thiết kế website theo mẫu sau ( 
Giáo trình thiết kế Web 27
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
3. Thiết kế website theo mẫu sau ( 
Giáo trình thiết kế Web 28
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
4. Thiết kế website theo mẫu sau ( 
Giáo trình thiết kế Web 29
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
5. Thiết kế website theo mẫu sau ( 
6. Thiết kế website theo mẫu sau ( 
Giáo trình thiết kế Web 30
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
Giáo trình thiết kế Web 31
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
7. Thiết kế website theo mẫu sau ( ) 
Để tham khảo cỏch thiết kế cỏc trang web trờn, hóy: 
 - Tải về mỏy bằng cỏch chọn chức năng Save của IE. 
 - Dựng MS Front Page để mở tập tin đó lưu lờn 
 - Chuyển qua lại giữa cỏc màn hỡnh Normal View và HMTL View để biết cỏch thiết 
 kế 
Với mỗi trang web đó xem hóy chỳ ý cỏc vấn đề sau: 
 - Cỏch bố trớ cỏc bảng (table) 
 - Cỏch sử dụng font chữ 
 - Cỏch chốn vào cỏc hỡnh ảnh để trang trớ 
 - Cỏch định nghĩa cỏc thuộc tớnh như màu chữ, màu nền, ... 
 - Phần tĩnh (khụng thay đổi) mỗi khi click vào cỏc hyperlink chuyển qua một nội 
 dung mới 
Từ cỏc trang web trờn, hóy tự thiết kế cỏc trang cho website của nhúm. 
Giáo trình thiết kế Web 32
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
 Phần I 
 Giới thiệu ngôn ngữ Html ........................................................................1 
 I. Các thẻ định cấu trúc tμi liệu............................................................1 
 1.1 HTML....................................................................................................................1 
 1.2 HEAD.....................................................................................................................1 
 1.3 TITLE....................................................................................................................1 
 1.4 BODY.....................................................................................................................2 
 II. Các thẻ định dạng khối.........................................................................3 
 2.1. thẻ P ......................................................................................................................3 
 2.2. Các thẻ định dạng đề mục H1/H2/H3/H4/H5/H6 .............................................3 
 2.3 Thẻ xuống dòng BR..............................................................................................3 
 2.4 Thẻ PRE ................................................................................................................3 
 III. Các thẻ định dạng danh sách ...........................................................4 
 3.1. Danh sách thông th−ờng .....................................................................................4 
 IV. Các thẻ định dạng ký tự......................................................................5 
 4.1. Các thẻ định dạng in ký tự..................................................................................5 
 4.2. Căn lề văn bản trong trang Web........................................................................6 
 4.3. Các ký tự đặc biệt ................................................................................................6 
 4.4. Sử dụng mμu sắc trong thiết kế các trang Web ................................................6 
 4.5. Chọn kiểu chữ cho văn bản.................................................................................8 
 4.6. Khái niệm văn bản siêu liên kết .........................................................................9 
 4.7. Địa chỉ t−ơng đối................................................................................................10 
 4.8. Kết nối mailto.....................................................................................................11 
 4.9. Vẽ một đ−ờng thẳng nằm ngang ......................................................................11 
 V. Các thẻ chèn âm thanh, hình ảnh ...................................................12 
 5.1. Giới thiệu ............................................................................................................12 
 5.2. Đ−a âm thanh vμo một tμi liệu HTML ............................................................13 
 5.3. Chèn một hình ảnh, một đoạn video vμo tμi liệu HTML...............................14 
 VI. Các thẻ định dạng bảng biểu .........................................................15 
Giáo trình thiết kế Web 33
Giáo trình Thiết kế Web : Nguyễn Hữu Tuấn Email: prohuutuan@yahoo.com -
0912378211 
 VII. FORM.........................................................................................................17 
 7.1. HTML Forms.....................................................................................................17 
 7.2. Tạo Form............................................................................................................17 
 7.3. Tạo một danh sách lựa chọn.............................................................................18 
 7.4. Tạo hộp soạn thảo văn bản...............................................................................18 
 Phần II 
 thiết kế web sử dụng ms frontpage .................................................19 
Giáo trình thiết kế Web 34