BÀI BÁO CÁO-THIẾT KẾ WEB VỚI MICROSOFT FRONTPAGE 2013 VÀ HTML
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (34.67 MB, 147 trang )
1
THIẾT KẾ WEB VỚI
MICROSOFT FRONTPAGE 2003
VÀ
HTML (Hypertext Markup
Language)
2
NỘI DUNG
Chương I: Một số khái niệm cơ bản
Chương V: Multimedia hóa trang web
Chương II: Ngôn ngữ HTML
Chương III: Tạo trang web với
FrontPage 2003
Chương IV: Xử lý văn bản & một số
đối tượng khác
3
Mạng Internet là gì?
Tiền thân của internet là ARPANET, đƣợc
xây dựng bởi Bộ quốc phòng Mỹ (năm
1969).
Góc độ kỹ thuật: Internet là mạng đƣợc
hợp thành bởi việc kết nối các mạng trên
toàn thế giới thông qua các phƣơng tiện
viễn thông, cáp quang, điện thoại,…
Góc độ thông tin và ứng dụng: Internet
là tên của một nhóm tài nguyên thông
tin trên khắp thế giới
Chương I: CÁC KHÁI NIỆM CƠ BẢN
4
Giao thức?
• Giao thức: là tập hợp nhiều qui tắc để
điều khiển phƣơng thức truyền thông
tin giữa các máy tính.
• Trên internet, việc định vị nguồn tài
nguyên thông tin đƣợc thực hiện bằng
cách chỉ ra địa chỉ của máy tính, nơi
chứa nguồn tài nguyên. Địa chỉ này
gọi là IP.
IP Address là một số duy nhất đƣợc
gán cho một máy tính trong một
mạng.
5
World Wide Web?
• Dịch vụ World Wide Web (WWW)
thƣờng đƣợc gọi là dịch vụ web, cho
phép ngƣời dùng tìm kiếm và truy
xuất tài nguyên thông tin dƣới dạng
các siêu văn bản
Siêu văn bản?
• Siêu văn bản (Hypertext): là tập các
thông tin có thể xem nhờ vào các liên
kết (Hyperlink).
Các thông tin trong siêu văn bản:
text, âm thanh, hình ảnh,…đƣợc định
dạng trong tập tin HTML (tập tin có
phần mở rộng *.htm, *.html)
6
• Siêu liên kết (Hyperlink): là mối nối
thông tin giữa hai thông tin trong một
siêu văn bản
• Trang Web (web page): là những
trang thông tin hiển thị dƣới dạng
siêu văn bản đƣợc tạo ra từ ngôn ngữ
HTML
• Website là tập hợp những trang web
đƣợc liên kết với nhau theo một cấu
trúc nào đó của một tổ chức hay cá
nhân.
• Trang chủ (Home page) là trang đầu
tiên của một website, cung cấp cái
nhìn tổng quát về website
7
Dịch vụ web tổ chức theo mô hình
client/server
•Client đƣợc gọi là Web Browser: gửi
yêu cầu tra cứu thông tin đến Web
Server và nhận thông tin kết quả trả về
từ Web Server.
•Server đƣợc gọi là Web Server: lắng
nghe yêu cầu từ web, phân tích yêu
cầu, tạo ra thông tin kết quả và trả về
cho trình duyệt web.
8
URL (Uniform Resource Location):
Là địa chỉ để định vị các nguồn tài
nguyên trên Web.
Cấu trúc của một URL:
<Giao
thức>://<tênmiền>[/Path][/Document]
Ví dụ:
/>php
9
Mô hình hoạt động của dịch vụ Web:
Internet
HTML…
……………
……………
………
Xử lý yêu cầu
Web Server
10
Chương II
NGÔN NGỮ HTML
(Hypertext Markup Language)
11
Giới thiệu HTML:
Là ngôn ngữ dùng để lập trình tạo ra các
trang web (ở dạng tập tin văn bản đơn
giản)
HTML dùng các thẻ (tag) để thông báo cho
các web browser hiển thị.
Hầu hết các web browser đều hiểu đƣợc
ngôn ngữ HTML
• Cú pháp các thẻ (tag) trong HTML: Cc thẻ
dng để bo cho trình duyệt cch thức trình
bày văn bản trên màn hình hoc dng đê
chn một mối liên kết đến cc trang khc,
một đoạn chƣơng trình khc
12
• Mi th gm mt từ kho -
KEYWORD - bao bc bi hai du "b
hơn" (<) v "ln hơn" (>).
• Hu ht cc lnh th hin bng mt
cp hai th: th m (<KEYWORD>)
v th đng (</KEYWORD>). Du
gch chéo ("/") k hiu th đng.
Lnh s tc đng vo đon văn bn
nm gia hai th.
13
Một số điều cần lƣu khi soạn thảo siêu
văn bản bằng HTML:
Nhiều dấu cch liền nhau cng chỉ có
tc dụng nhƣ một dấu cách. Bạn phải
sử dụng thẻ để thể hiện nhiều dấu
gin cch liền nhau.
G Enter để xuống dng đƣợc xem
nhƣ một dấu cch, để xuống hàng thì
chng ta phải sử dụng thẻ tƣơng ứng
Có thể viết tên thẻ không phân biệt
chữ in thƣờng và in hoa.
Vì cc k tự dấu lớn hơn ">", dấu nh
hơn "<" đ đƣợc dng làm thẻ đnh
dấu, do đó để hiển thị cc k tự này
HTML quy định cch viết: > <
14
Cấu trc của một tài liệu HTML
Mi ti liu HTML đu c khung cu trc
như sau:
<HTML>
<HEAD><TITLE></TITLE></HEAD>
<BODY>
<! Nội dung trang web >
</BODY>
</HTML>
15
Một số thẻ HTML thông dụng:
1. Thẻ <HTML>: Trang web tĩnh đƣợc bắt
đầu bằng :<HTML> và kết thc bằng:
</HTML>
2. Thẻ <HEAD>: Phần đầu của trang web
3. Thẻ <TITLE>: Đt tiêu đề cho trang web
(thẻ này nằm trong <HEADER>) Nu b
trng th trình duyt s cho hin tên tp
thay vo đ
16
Ví dụ: Đt tiêu đề của trang web là: “Chào
các bạn học viên”
<HEAD>
<TITLE> Chào các bạn học viên
</TITLE>
</HEAD>
17
4. Th <BODY>: Chứa ni dung trang
web.
Ton b ni dung ca ti liu nm
gia hai th xc đnh thân ca
trang <BODY> </BODY>. Cc
dng văn bn, hnh nh, âm thanh,
video, cc mi liên kt to nên
trang Web đu phi nm đây.
Chú thích trong HTML: dùng du
<! và du >
<! Ni dung chú thch >
18
Thẻ tạo tiêu đề
5. Tiêu đ mức 1
• Th đnh nghĩa c dng:
<H1> </H1>
V dụ:
<H1>Tiêu đ 1</H1> cho ta tiêu đ
tương ứng Tiêu đề 1
19
5. Tiêu đ mức 2
• Th đnh nghĩa c dng:
<H2> </H2>
V dụ:
<H2>Tiêu đ 2</H2> cho ta tiêu đ
tương ứng Tiêu đề 2
Thẻ tạo tiêu đề
20
6. Tiêu đ mức 3
• Th đnh nghĩa c dng:
<H3> </H3>
V dụ:
<H3>Tiêu đ 3</H3> cho ta tiêu đ
tương ứng Tiêu đề 3
Thẻ tạo tiêu đề
21
7. Tiêu đ mức 4
• Th đnh nghĩa c dng:
<H4> </H4>
V dụ:
<H4>Tiêu đ 4</H4> cho ta tiêu đ
tương ứng Tiêu đề 4
Thẻ tạo tiêu đề
22
8. Tiêu đ mức 5
• Th đnh nghĩa c dng:
<H5> </H5>
V dụ:
<H5>Tiêu đ 5</H5> cho ta tiêu đ
tương ứng Tiêu đề 5
Thẻ tạo tiêu đề
23
9. Tiêu đ mức 6
• Th đnh nghĩa c dng:
<H6> </H6>
V dụ:
<H6>Tiêu đ 6</H6> cho ta tiêu đ
tương ứng Tiêu đề 6
Thẻ tạo tiêu đề
24
Thẻ trình bày trang
10. Định dạng phần địa chỉ: Cho bit
thông tin như địa chỉ, danh thip và tác
giả, thường đặt ở đầu hay cui tài liu.
Thẻ định dạng:
<ADDRESS>…</ADDRESS>
25
V dụ:
<ADDRESS>
Bai giang Thiet ke Web <BR>
Mr Son<BR>
97 – Tran Phu - Hue<BR>
Tel 0949 369 444 <BR>
012 789 85 999
</ADDRESS>
