Giới thiệu về HTML Session 1
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 (1.46 MB, 34 trang )
Session 1
•
World Wide Web (www) là một dịch vụ cho phép người
sử dụng truy cập thông tin thông qua Internet.
•
Một trang Web là một file chứa thông tin và các chỉ thị
(instructions) hiển thị thông tin cho người dùng.
•
Sự phát triển của Web được chia thành các giai đoạn:
–
Web 1.0
–
Web 2.0
–
Semantic Web (Web có ngữ nghĩa).
•
Web 1.0
–
Các trang web ở dạng tĩnh (read-only format) với người
đọc.
–
Không có sự tương tác với người đọc
•
Web 2.0
–
Khả năng tương tác và tính năng phong phú.
–
Sử dụng công nghệ AJAX, CSS cho phép tạo ra các trang
web động, có thể hiển thị đa dạng thông tin hơn. Nhờ vậy
mà người đọc không những xem nội dung trang Web mà
còn tương với tác giả trang Web qua comment (lời bình,
nhận xét), blog, rating (đánh giá)…vv.
•
Semantic Web
–
Web có ngữ nghĩa là khái niệm mở rộng Web hiện tại và là
thế hệ Web trong tương lai.
–
Mục tiêu ban đầu của Semantic Web là để hỗ trợ người
dùng tìm kiếm thông tin trên mạng một cách nhanh chóng,
chuẩn xác và thông minh hơn so với các công cụ tìm kiếm
truyền thống.
–
Semantic Web cung cấp một tập các tiêu chuẩn Web site
để thông tin được xuất bản theo một khuôn dạng (format),
nhờ đó giúp các phần mềm máy tính có thể hiểu được
thông tin và tự động xử lý được những thông tin đó.
• HTML viết tắt của Hyper Text Markup Language, là một
ngôn ngữ đánh dấu được dùng chủ yếu để tạo và hiển thị
các trang Web siêu văn bản trong bất kỳ trình duyệt nào.
• Sử dụng các thẻ (tag) và các phần tử (element) HTML, ta
có thể:
–
Điều khiển hiển thị và hình thức trình bày nội dung của trang.
– Xuất bản các tài liệu trực tuyến và truy xuất thông tin trực tuyến
bằng cách chèn các liên kết vào tài liệu HTML
–
Tạo các biểu mẫu trực tuyến để thu thập thông tin về người
dùng, quản lý các giao dịch
• Một trang HTML được lưu trữ với phần mở rộng .html.
• Cấu trúc cơ bản của tài liệu HTML gồm có bốn phần tử cơ bản
là:
– HTML: Phần tử gốc đánh dấu sự bắt đầu và kết thúc tài liệu HTML
–
HEAD: phần tử cung cấp thông tin về trang Web như ngôn ngữ sử
dụng, từ khóa cho các bộ máy tìm kiếm.
–
TITLE: phần tử cho phép đặt tiêu đề của trang Web.
–
BODY: toàn bộ nội dung trang Web hiển thị trên trình duyệt được đặt
trong cặp thẻ <BODY></BODY>. Nội dung bao gồm văn bản, siêu
liên kết, hình ảnh
Giới thiệu
7
Các trang Web tĩnh
8
Các trang
Web tĩnh
Bao gồm văn bản,
hình ảnh, video …
Mục đích là trình bày
nội dung
Thiết kế đơn giản và
không cung cấp sự tương
tác động
Nội dung không thể
chỉnh sửa
Các trang Web động
9
Các trang
Web động
Dữ liệu luôn được cập
nhật và đáng tin cậy
Sinh ra nội dung dựa
trên nhu câu khi người
dụng cung cấp đầu vào
Cho phép người dùng
tương tác
Cho phép sửa nội dung
và sự xuất hiện của
chúng trên trình duyệt
Các công nghệ
10
Một số công nghệ sử dụng để tạo và các web sites động:
Lịch sử phát triển 1-2
11
HTML đã được phát triển qua nhiều năm với nhiều sự cải tiến thông qua các phiên bản.
•
Phần tử gồm có các thẻ, thuộc tính và nội dung. Các thẻ gồm có thẻ
bắt đầu và kết thúc một phần tử HTML.
•
Có hai loại phân tử:
–
Phần tử chứa
–
Phần tử rỗng
•
Mỗi thẻ của phần tử được đặt trong cặp ngoặc <>
• Thẻ kết thúc có thêm kí tự /
• Cung cấp các giá trị thích hợp tới thuộc tính.
• Các phần tử phải nằm lồng nhau
• Khai báo kiểu tài liệu (DOCTYPE)
được đặt trên cùng của trang HTML,
nó cho biết phiên bản HTML và định
nghĩa kiểu tài liệu (DTD-Document
Type Definition).
– DTD là một tài liệu mà tất cả các
phần tử và các giá trị cho mỗi thuộc
tính phải hợp lệ.
– DTD chỉ cho cho trình duyệt cách
xử lý trang HTML.
•
Một siêu liên kết được xem
như là một link, nó liên kết
đến các trang Web khác
hoặc liên kêt đến một vùng
(section) trong cùng tài liệu
•
Phần tử A (anchor) được sử dụng để tạo một siêu liên kết
•
Các dạng liên kết
–
Liên kết trong là liên kết đến các phần trong cùng
tài liệu hoặc cùng một web site
–
Liên kết ngoài là liên kết đến các trang trên các web
site khác hoặc máy chủ khác.
- - - - - - -
- - - - - - -
- - - - - - -
- - - - - - -
- - - - - - -
- - - - - - -
- - - - - - -
- - - - - - -
- - - - - - - - - - - - - -
•
Để tạo siêu liên kết, chúng ta cần phải xác định hai thành phần :
–
Địa chỉ đầy đủ hoặc URL của file được kết nối
–
Điểm nóng cung cấp cho liên kết. Điểm nóng này có thể là một dòng văn bản hoặc thậm
chí là một ảnh.
•
Các kiểu URL
–
URL tuyệt đối
–
URL tương đối
•
Cú pháp của HREF là :
<A HREF = protocol://host.domain:port/path/filename>
Hypertext </A>
• Protocol xác định loại giao thức
• Host.domain là địa chỉ Internet của máy chủ
• Port là cổng phục vụ của máy chủ đích
•
HyperText là văn bản hay hình ảnh mà user cần nhấp vào để
kích hoạt liên kết
•
Liên kết đến tài liệu khác
– Đường dẫn tuyệt đối
–
Đường dẫn tương đối
• Liên kết đến các phần trong cùng một tài liệu
•
Liên kết đến một điểm xác định ở một tài liệu khác
• Sử dụng e-mail
•
Có 5 phần tử text cơ bản
–
P
–
BR
–
H1, H2, H3, H4, H5, H6
– HR
– PRE
•
Phần tử Heading định nghĩa các tiêu đề cho văn bản và
hình ảnh.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
" /><HTML>
<HEAD>
<TITLE>Introduction to HTML</TITLE>
</HEAD>
<BODY>
<H1>H1 Heading</H1>
<H2>H2 Heading</H2>
<H3>H3 Heading</H3>
<H4>H4 Heading</H4>
<H5>H5 Heading</H5>
<H6>H6 Heading</H6>
</BODY>
</HTML>
•
Phần tử định dạng cho phép điều khiển nội dung trang
Web được hiển thị trên trình duyệt theo nhiều kiểu dạng
khác nhau.
•
Gồm các phần tử sau:
– B
–
Big
–
I
–
SMALL
– U
– DEL
– INS
– STRONG
–
SUB
–
SUP
•
Phần tử <ADDRESS> được dùng khi cần hiển thị các
thông tin như tác giả, địa chỉ, chữ ký trong tài liệu
HTML.Phần tử này thường đặt ở cuối trang và có thể
chứa một hoặc một số phần sau:
– Liên kết đến trang chủ
– Đặc tính chuỗi tìm kiếm
–
Thông tin bản quyền
