Html cơ bản

Lập trình Web
Mục tiêu môn học
 Cung cấp các kiến thức cơ bản về thiết kế web
 HTML, CSS, JavaScript
 Tìm hiểu các thành phần cơ bản của trang web
 Các bước xây dựng trang web tĩnh
 Xây dựng & triển khai trang web tĩnh.
 Sử dụng công cụ thiết kế web phổ biến như
Dreamweaver, và các công cụ hỗ trợ khác như
photoshop, flash…
2
Nội dung môn học
 Phần 1: kiến thức cơ bản
 HTML (HyperText Markup Language)
 CSS (Cascading Style Sheets)
 Ngôn ngữ JavaScript.
 Phần 2: công cụ thiết kế web
 Dreamweaver
 Photoshop
 Flash
 Một số công cụ hỗ trợ thiết kế web khác.
3
Giới thiệu môn học
 Giảng viên:
 ThS. Nguyễn Hà Giang
 Các môn dạy:
 Kỹ thuật lập trình, CTDL & GT, OOP, Lập trình Visual C++ &
MFC, Lập trình C# Desktop Application, LT Web Application
ASP.NET, Mã nguồn mở (PHP & MySQL), CC&MT PTPM.
 Hướng nghiên cứu:
 Data Mining, Fuzzy Data Mining, Fuzzy Association Rule
Mining
 Semantic Web Mining,
 Email: [email protected]
4
Chương 0
Các kiến thức cơ bản
5
Mục tiêu
 Giới thiệu mô hình 3 lớp trong thiết kế web
 Các khái niệm và thuật ngữ cơ bản về mạng và
môi trường web
 Cấu trúc và cú pháp của ngôn ngữ HTML
 Cú pháp và thuộc tính của CSS (chuẩn định
dạng cách trình bày của trang web)
 Tổng quan về ngôn ngữ script, cú pháp, cách xử
lý sự kiện và thao tác trên đối tượng HTML của
ngôn ngữ JavaScript.
6
Mô hình 3 lớp trong TK Web
 Lớp nội dung
 Cung cấp nội dung thông tin cho
người truy cập.
 Bao gồm các văn bản, hình ảnh,
các liên kết…
 Nội dung này sẽ được tổ chức
theo cấu trúc của ngôn ngữ đánh
dấu siêu văn bản như HTML,
XHTML…
7
Mô hình 3 lớp trong TK Web
 Lớp trình bày
 Quy định cách trình bày trang
web. Lớp này định nghĩa các
định dạng hay kiểu mẫu cho các
thành phần trong trang web.
 Các định nghĩa này được lưu
trong một file riêng theo cú
pháp của chuẩn định dạng CSS
 Lớp hành vi
 Cho phép thực hiện một số hành
vi/thao tác trên các thành phần
của trang web thông qua ngôn
ngữ script (JavaScript, VBScript)
8
Mô hình 3 lớp trong TK Web
 Một số ưu điểm của mô hình
 Share resources
 Dùng chung toàn bộ file CSS hay JS cho toàn bộ các
trang web trong website.
 Khi thay đổi trên tập tin này thì toàn bộ site sẽ được đổi
 Faster downloads
 Khi user truy cập trang web, các CSS và JS chỉ tải ở lần
truy cập đầu tiên, trình duyệt sẽ cache lại cho lần sau.
 Multi-person teams
 Thuận tiện cho việc phân chia công việc.
 Các thành viên trong nhóm sẽ được phân công theo từng
lớp mô hình. Do đó công việc ở các lớp có thể làm đồng
thời.
9
Các khái niệm & thuật ngữ cơ bản
 WWW (World Wide Web): mạng toàn cầu các
máy tính sử dụng Internet để trao đổi tài liệu
web.
 Protocol: là tập hợp các quy tắc được thống nhất
giữa hai máy tính nhằm thực hiện trao đổi dữ
liệu được chính xác.
 Các giao thức thông dụng: TCP, HTTP, FTP, SMTP…
 Web page: một tài liệu (thường là HTML) được
thiết kế để phân phối trên môi trường web.
 Web site: là tập hợp các web page có liên quan
đến 1 công ty hay cá nhân
10
Các khái niệm & thuật ngữ cơ bản
 Home page: là web page có mức cao nhất, gọi là
trang chủ của website.
 IP Address: một con số xác định duy nhất cho
mỗi máy tính trên Internet
 VD: 192.168.10.1
 Domain name: tên xác định website
 VD: www.huflit.edu.vn
 DNS (Domain name service): một chương trình
chạy trên server, chuyển tên miền sang IP và
ngược lại.
11
Các khái niệm & thuật ngữ cơ bản
 ISP (Internet Service Provider):
 Nhà cung cấp dịch vụ Internet (cung cấp các dịch vụ
truy cập Internet và nơi lưu trữ web).
 Web host:
 Một web server cung cấp dịch vụ lưu trữ cho web site
của các công ty, tổ chức hay cá nhân.

12
Các khái niệm & thuật ngữ cơ bản
 URL (Uniform Resource Locator): Một địa chỉ web, là
một chuẩn để xác định các tài liệu (trang) web trên
Internet.
http://www.huflit.edu.vn:8080/khoacntt/news.php?id=216&p=1#Phan1
Giao thức cổng Tập tin Tên vị trí trong
trang web
Tên miền Thư mục Tham số
13
Các khái niệm & thuật ngữ cơ bản
 Port: là con số xác định kênh nhập/xuất được sử
dụng bởi một ứng dụng Internet.
 Một máy server có thể cung cấp nhiều dịch vụ,
do đó cần có cơ chế để phân biệt, giúp client
khai thác đúng dịch vụ cần thiết.
 Hai dịch vụ khác nhau phải chạy trên hai cổng
khác nhau.
 VD: web server thường dùng cổng 80, ftp server
dùng cổng 21, smtp server dùng cổng 25…
14
Các khái niệm & thuật ngữ cơ bản
 Web client (Web Browser): là phần mềm dùng để
truy cập và hiển thị nội dung trang web.
 Một số web browser thông dụng như: IE, Firefox,
Opera, Safari, Chrome…
 Web server: một máy tính phân phối dịch vụ và
thông tin cho máy tính khác.
 Một số web server thông dụng: IIS, Apache,
Tomcat…
15
Các khái niệm & thuật ngữ cơ bản
 Server: chứa dữ liệu, tài nguyên và dịch vụ cho
phép máy khác có thể khai thác và truy cập.
 Một máy chủ có thể dùng cho một hay nhiều mục
đích.
 Tên máy chủ thường được gắn với mục đích sử dụng
 VD: Web server, File server, Mail server…
 Client: là máy tính dùng để kết nối và khai thác
các tài nguyên trên máy chủ
 Việc kết nối client với server và việc khai thác dịch
vụ của server tạo nên mô hình Client/Server
 Một máy tính vừa có thể là server vừa là client.
16
Các khái niệm & thuật ngữ cơ bản
 Trang web tĩnh:
 Chứa nội dung cố định (thường là HTML, để cập nhật
nội dung phải cập nhật trực tiếp trên HTML).
 Không cho phép sử dụng tương tác, cập nhật dữ liệu
trên trang web.
 Một trang web chứa các hình ảnh chuyển động cũng
có thể là trang web tĩnh!
 Trang web động:
 Kết hợp HTML và mã lệnh.
 Mã được thực thi trực tiếp trên server, gửi kết quả là
HTML về người sử dụng.
 Có khả năng tương tác với người sử dụng!
17
Xử lý yêu cầu với web tĩnh
18
Xử lý yêu cầu với web động
19
Chương 1
Ngôn ngữ HTML
20