Tiểu luận học phần thiết kế web thiết kế website hãng hàng không và Đặt vé

Với các thuộc tính về giao điện được quy định sẵn như kích thước, màu sắc, độ cao, độ rộng..., các designer có thé sang tao nhiéu san phâm mới mẻ nhưng vẫn tiết kiệm thời gian khi làm vi

TRƯỜNG ĐẠI HỌC NGUYÊN TÁT THÀNH

NGUYEN TAT THANH

TIỂU LUẬN HỌC PHẢN THIẾT KE WEB

THIET KE WEBSITE HANG HANG KHONG VA DAT VE

Giảng viên hướng dan: ThS DANG DUC TRUNG

Sinh viên thực hiện: LÂM TRIẾT LÃM

TRƯỜNG ĐẠI HỌC NGUYÊN TÁT THÀNH

NGUYEN TAT THANH

TIỂU LUẬN HỌC PHẢN THIẾT KE WEB

THIET KE WEBSITE HANG HANG KHONG VA DAT VE

Giảng viên hướng dan: ThS DANG DUC TRUNG

Sinh viên thực hiện: LÂM TRIẾT LÃM

TRUONG DAI HOC NGUYEN TAT KY THI KET THUC HQC PHAN

TRUNG TÂM KHẢO THÍ

PHIẾU CHAM THI TIEU LUẬN/ĐỎ ÁN

Môn thi: Thiết kế web 0 ngư Lớp học phần: 22DMK4B

Sinh viên thực hiện : LÂM TRIẾT LẦM

Sinh viên thực hiện : 2200000588

Đề tài tiểu luận/báo cáo của sinh viên :Thiết kế website hãng hàng không và dat vé Phân đánh giá của giảng viên (căn cứ trên thang rubrics của môn học):

MỤC LỤC

1.2.1 Microsoft Visual Studio CCO(e - œ5 vn H xin min ng 2

1.2.1.2 Ưu nhược điểm của Visual Studio Code 5- 5s sec ceceessesessreesscse 2 d2 L2 Q.4 Họ Họ HT 0 0 0 4 1919 90000405908 08 Bootstrap Feamework

3

1.2.2.1.Lich str phat tridme cccccscsscssssscsssssssscsssssssssssssssssssssscssssscssssessssessescsssesnsseeseaes 4

hàn lì 0S 7

1.3.1.4 Cầu trúc của HTMI s-+seSvv+tErxtetErtettsrtstttrksrksrrrsrrrsrrrseee 9

1.3.1.7 Các loại HTÌML hiện nay, << Họ TH HH gi 11 1.3.2, CS (Cascading Style She€fS): dc cá HH gọn TÀ g n g HH nà t1, 12

CHUONG 2 PHAN TÍCH THIẾT KE

2.1 Giới thiệu đề tài

2.2.3.1 Wireframe trang Ch <5 ọ HH ng mm

2.2.3.2 Wireframe trang đẶẾT VỀ - Gì HỌC H TH TH TH TH ngự 2.2.3.3 Wireframe trang đăng nhập

3.1 Trang chủ (DOAN.HTTMLL) - Gì Họ HH nh Hy sự 21 3.1.1 Giao điện s0 TT c cà TH 4 04 90 09 ng 21 3.1.2 NMô (Ả nọ HH TH g HH Họ TH TH TH TH 000700 23 3.1.3 KỸ thuật - co họ HH HH HH TH cọ Hi HH HT 00000 23

3.2.2 NMÔ (Ả HH HH ng HH HT TH TH TH TH 0 00 0000 26 3.2.3 KỸ thuật Ăn HH TH HH HH cọ Họ HH HT 000900 26 3.3 Trang đặt vé(DAÁ TVE.HTTMLL) - - < cọ nh pH mm 26 3.3.1 TMô (Á HH Họ HH HH HT Họ 0 000.080.700 27 3.3.2 Kỹ thuậT «HT HH HH HH TY HH HH HH HH H0 0 0 27 3.4 Trang liên hệ (LIENHE.HTTML) 0 5-5 HH nh Hư vớ 27 3.4.1 TMô (Á HH Họ HH HH HH Họ Họ 0 0 81.000.080.780 28 3.3.2 Kỹ thuậT «HT HH HH HH TY HH HH HH HH H0 0 0 28 3.5 Trang đăng nhập (DANGNHAP.HTÌMLL) - Ăn HH, 28 3.5.1 NMô Á HH TH HH HH HT TH 0 0 T100 080.700 29 3.5.2 Kỹ thuẬT «HH TY HH HH HH TH HO HH HH HH HH 0 04 29 3.6 Trang quên mật khẩu (QUENMA TKHAU.HTML) .s s5 5° s52 29 3.6.1 NMô (Ả nọ HH ng HH THỌ TH TH TH TH 00000 30 3.6.2 KỸ thuậT - chì TH HH HH cọ Hi HH HT 00900 30 3.7 Trang đăng ký (DANGKY.HTTML)) G HY ung g 30 3.7.1 MO VÁ HH Họ TH HH HH HH Họ 00.81.000.080 00 31 3.7.2 KY thuậT «HH HH HH HH TY HO HH HH HH HH 0 0 0 31

3.8.1 NMô (Á HH Họ HÀ HH KH HH HT Họ 0 0 81.000.080.700 32 3.8.2 Kỹ thuậT «HH TY HH HH HH HO HH HH HH H0 0 33 3.9 Trang Hà Lan (halan.]fTHÌÌ) 5 5 55 << mm sim 33 3.9.1 MO Á HH Họ TH HH HH cọ Họ 04.8100 0.080.700 34 3.9.2 KY thuậT «HH HH TH HH TH HO HH HH HH 00 th 0 35 3.10 Trang Hàn Quốc (hanquoc.hfimlÌ) o- «se s3 1 100 Y1 3 1 1Ý Y vay 35

3.10.1 Mô TẢ HT HH HH TH HH HH HO HH HH HH HH 0 106 100904 36 3.10.2 Kỹ thuật «Ăn TẾ TH HO TH HO HH HH HH 0 0909 36

3.11.1 TMỗ tả «óc HH TH HH HO HC HO HH HH HH I0 106 00 37 3.11.2 Kỹ thuật << TẾ THỂ HO TH HO HH HH HH 0 009 9 37

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

CHƯƠNG I1 GIỚI THIỆU CHUNG

1.1 Quy trình thiết kế website

Quy trình thiết kế website là một quá trình phức tạp, bao gồm nhiều bước cần thiết dé

tạo ra một trang web hoạt động và hiệu quá Quy trình này có thé duoc chia thành các

bước sau:

Bước l1: Thu thập thông tin, tiếp nhận yêu cầu của khách hàng

Bước đầu tiên trong quy trình thiết kế website la thu thap thong tin va tiép nhan yêu cầu của khách hàng Điều mày bao gồm việc tìm hiểu về mục tiêu của website, đối tượng mục tiêu, nội đung cần thiết và các tính năng mong muốn

Bước 2: Lập kế hoạch

Sau khi đã thu thập đủ thông tin, cần lập một kế hoạch thiết kế website chỉ tiết Kế hoạch này nên bao gồm các yếu tố sau:

« - Mục tiêu của website

« Đối tượng mục tiêu

« Nội dung cần thiết

« - Các tính năng mong muốn

» _ Phân tích đối thủ cạnh tranh

« - Khung thời gian và ngân sách

Bước 3: Lựa chọn tên miền website và hosting

Tên miện là địa chỉ web của bạn, còn hosting là nơi lưu trữ các tệp của website Bạn

cân lựa chọn tên miền và hosting phù hợp với mục tiêu và ngân sách của mình

Bước 4: Thiết kế giao điện

Giao diện là yếu tô đầu tiên mà người dùng nhìn thấy, do đó, nó cần được thiết kế một

cach hap dan va dé sử dụng Thiết kê giao diện bao gôm việc lựa chọn màu sắc, font

chữ, bô cục và hình ảnh phù hợp

Bước 5: Xây dựng tính năng website

Các tính năng là những chức năng của website Một website có thể có nhiều tính năng khác nhau, tùy thuộc vào mục đích của nó Các tính năng thường gặp bao gôm:

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

Bước 6: Kiểm tra và chỉnh sửa

Sau khi đã xây dựng xong website, cần tiến hành kiêm tra và chỉnh sửa để đảm bảo website hoạt động bình thường và đáp ứng được các yêu câu của khách hàng

1.2 Các công cụ thiết kế website

1.2.1 Microsoft Visual Studio Code

1.2.1.1 Visual Studio Code la gi?

Visual Studio Code chính là ứng dụng cho phép biện tập, soạn thảo các đoạn code đề

hỗ trợ trong quá trình thực hiện xây dựng, thiết kế website một cách nhanh chóng Visual Studio Code hay còn được viết tắt là VS Code Trình soạn thảo này vận hành mượt mà trên các nền tảng như Windows, macOS, Linux Hon thé nữa, VỀ Code còn cho khả năng tương thích với những thiết bị máy tính có cau hình tầm trung vẫn có thể

sử dụng dễ dàng

1.2.1.2 Ưu nhược điểm của Visual Studio Code

Visual Studio Code là gì được rất nhiều người tìm hiểu Đây cũng là một trong các

ung dung duoc dan IT “săn đón” và tải vé va str dung rat nhiéu Visual Studio Code

cũng luôn có những cải tiến và tạo ra đa dạng các tiện ích đi kèm từ đó giúp cho các lập trình viên sử đụng đễ dàng hơn Trong đó có thê kế đến những ưu điểm sau:

- Đa dạng ngôn ngữ lập trình giúp người dùng thỏa sức sáng tạo và sử dụng như HTML, CSS, JavaScript, C++,

- Ngôn ngữ, giao diện tối giản, thân thiện, giúp các lập trình viên dễ dàng định

hình nội dung

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

- Các tiện ích mở rộng rất đa dạng và phong phủ

- Tích hợp các tính năng quan trọng như tính nang bao mat (Git), kha nang tang toc xử lý vòng lặp (Debug),

- Đơn giản hóa việc tìm quản lý hết tất cả các Code có trên hệ thống

Visual Studio Code là một trong những trình biên tập Code rất phô biến nhất hiện nay Ứng dụng này cũng ngày càng chứng tỏ ưu thế vượt trội của mình khi so sánh với những phần mềm khác Tuy bản miễn phí không có nhiều các tính năng nâng cao

nhưng Visual Studio Code thực sự có thé đáp ứng được hầu hết nhu cầu cơ bản của lập

trình viên [2]1.3 Ngôn ngữ thiết kế website

ra những cái cơ bản cé san nhu: typography, forms, buttons, tables, navigation,

modals, image carousels va nhiéu thir khac Trong bootstrap có thêm các plugin

Javascript trong nó Giúp cho việc thiết kế reponsive của bạn đễ dàng hơn và nhanh chóng hơn

Bootstrap là một bộ sưu tập miễn phí của các mã nguồn mở và công cụ dùng đề tạo

ra một mẫu webiste hoàn chỉnh Với các thuộc tính về giao điện được quy định sẵn

như kích thước, màu sắc, độ cao, độ rộng , các designer có thé sang tao nhiéu san

phâm mới mẻ nhưng vẫn tiết kiệm thời gian khi làm việc với framework nay trong quá trình thiết kế giao diện website

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

Đến ngày 31/1/2012, Bootstrap phiên bản 2 đã được phát hành Bootstrap 2 được bố sung bồ cục lưới 12 cột với thiết kế tùy chỉnh đáp ứng cho nhiều màn hình kích thước Tiếp nối sự thành công của phiên bản 2, Bootstrap 3 ra đời vào ngày 19/8/2013 với giao diện tương thích với smartphone

Chi 3 năm sau ngay ra mat, Bootstrap da tré thanh No.1 project trên GitHub Vào tháng 10/2014, Mark Otto công bố phiên bản Bootstrap 4 đang được phát triển Phiên bản alpha đầu tiên của Bootstrap 4 đã được triển khai vào tháng 8/2015 Phiên bản mới nhất của Bootstrap được giới thiệu đến người dùng là Bootstrap 4.3 l

Tại sao nên str dung Bootstrap?

Những điểm thuận lợi khi sử dung Bootstrap:

Rất đễ để sử dụng: Nó don gian vi no duge base trén HTML, CSS va Javascript chi cần có kiến thức cơ bản về 3 cái dé 1a co thé str dung bootstrap tốt

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

Tính nang Responsive: Bootstrap’s xay dyng sẵn reponsive css trên các thiết bị phones, tablets, và desktops

Mobile: Trong Bootstrap 3 mobile-first styles là một phần của core #amework

Tương thích với trình duyệt: Nó tương thích với tất cả các trình duyệt (Chrome, Firefox, Internet Explorer, Safari, and Opera) nhưng lưu ý việc [E9 hay IE§ đồ xuống không support là chuyện bình thường Các bạn có dùng nên luy ý điểm này, đùng làm

dự án thì nó support tuyệt vời trên IE10 đồ lên nhé, thấp nhất có lẽ là IE9, còn IE8 thi

không nên xài

Chất lượng sản phẩm đầu ra hoàn hảo: Bootstrap đã được nghiên cứu và thử nghiệm

trên các thiết bị Được kiểm tra nhiều lần trước khi đưa vào sử dụng Do đó, khi

chon Bootstrap, ban co thể tin rằng mình sẽ tạo nên những sản phẩm với chất lượng

a aE css JavaScript

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung Glyphicon Examples

Envelope icon: X Envelope icon as a link: % Search icon: Q

Search icon on a button: Q Search

Search icon on a styled button:

Print icon: es

Print icon on a styled link button: | my Ìgì(

Hình 1.2.2.1 c:Minh hoa viéc sue dung bootstrap glyphyicon

Success! This alert box indicates a successful or positive action

Info! This alert box indicates a neutral informative change or action

Warning! This alert box indicates a warning that might need attention

Danger! This alert box indicates a dangerous or potentially negative action

Hinh 1.2.2.1d:Minh hoa viéc ste dung bootstrap alert

Email:

Enter email Password:

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

It's simple, responsive and fast

Flinh 1.2.2.le: Minh hoa viéc ste dung bootstrap carousel

1.3.1 Hyper Text Markup Language - HTML

1.3.1.1 HTML

LAM TRIET LAM

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

C0pE_ C55

HTML là viết tắt của Hypertext Markup Language hay ngôn ngữ đánh dấu siêu văn

bản là một ngôn ngữ đánh dau được thiết kế đề tạo ra các trang web trên World Wide

Web Nó có thể được trợ giúp bởi các công nghệ như CSS và các ngôn ngữ kịch bản nhu Javascript

- Cac trình duyệt web nhận tài liệu HTML từ một web server hoặc một kho lưu

trữ cục bộ và các render tài liệu đó thành các trang web đa phương tiện HTML mô tả cầu trúc của một trang web về mặt ngữ nghĩa và các dấu hiệu ban đầu được bao gồm

cho sự xuât hiện của tài liệu

- Các phần tử HTML là các khối xây dựng của trang HTML Với cấu trúc

HTML, hình ảnh và các đối tượng khác như biều mẫu tương tác có thê được nhúng vào trang hiển thị HTML cung cấp một phương tiện để tạo tài liệu có cầu trúc bằng cách biểu thị ngữ nghĩa cấu trúc cho văn bản như headings, paragraphs, lists, links, quotes và các mục khác Các phần tử HTML được phân định bằng các tags, được viết

bằng dau ngoặc nhọn

- HTML có thê nhúng các chương trình được viết bằng scripting như JavaScript, điều này ảnh hưởng đến hành vi và nội dung của các trang web Việc bao gồm CSS xác định giao điện và bố cục của nội dung World Wide Web Consortium (W3C),

trước đây là đơn vị bảo trì HTML và là người duy trì hiện tại của các tiêu chuẩn CSS,

đã khuyến khích việc sử dụng CSS trên HTML trình bày rõ ràng kể từ năm 1997,

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

1.2.2 Lịch sử phát triển HTML

- HTML được tạo ra bởi Tìm Berners-Lee, một nhà vật lý học của trung tâm nghiên cứu CERN ở Thụy Sĩ Hiện nay, HTML đã trở thành một chuẩn Internet được

tô chức W3C (World Wide Web Consortium) vận hành và phát triển Bạn có thé tự tìm

kiếm tình trạng mới nhất của HTML tại bất kỳ thời điểm nào trên Website của W3C

- Phiên bản đầu tiên của HTML xuất hiện năm 1991, gồm 18 tag HTML Phiên bản HTML 4.01 được xuất bản năm 1999 Sau đó, các nhà phát triển đã thay thế

HTML bằng XHTML vào năm 2000

- Đến năm 2014, HTML được nâng cấp lên chuân HTML5 với nhiều tag được

thêm vào markup, mục đích là để xác định rõ nội dung thuộc loại là gì (ví dụ như:

<article>, <header>, <footer>, )

- Theo Mozilla Developer Network thi HTML Element Reference hién nay co

khoảng hơn 140 tag Tuy nhiên một vài tag trong số đó đã bị tạm ngưng (do không

được hỗ trợ bởi các trình duyệt hiện hành)

1.3.1.2 HTML hoạt động như thế nào?

- HTML documents là ñles kết thúc với đuôi html hay htm Bạn có thé xem chúng bằng cách sử dụng bất kỳ trình duyệt web nào (như Google Chrome, Safari, hay Mozilla Firefox) Trinh duyét doc cac files HTML nay và xuất bản nội dung lên

Internet sao cho người đọc có thê xem được nó

- Thông thường, trung bình một web chứa nhiều trang web HTML, ví dụ như: trang chủ, trang about, trang liên hệ, tất cả đều cần các trang HTML riêng Mỗi trang HTML chứa một bộ các tag (cũng được gọi là elements), bạn có thê xem như là việc xây dựng từng khối của một trang web Nó tạo thành cấu trúc cây thư mục bao gồm section, parapraph, heading, và những khối nội dung khác

1.3.1.4 Cấu trúc của HTML

- HTML sẽ được khai báo bằng các phần tử bởi các từ khóa Nội dung nằm bên

trong cặp từ khóa sẽ là nội dung bạn cần định đạng với HTML Ví dụ dưới đây là một đoạn HTML khai báo một đoạn văn bản

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

Đại học Nguyễn Tất Thành

Hình 1.3.1.4a: Vĩ dụ cách khai bảo một đoạn văn bản

- Ngoài ra, trong các thẻ còn có các thuộc tính, thuộc tính sẽ đặt bên trong thẻ

mở đầu, mỗi thuộc tính sẽ có giá trị được đặt trong dau ngoặc kép và cách nhau bởi

dâu bằng (=) với tên thuộc tính Ví đụ đưới đây là một thẻ có sử dụng thuộc tính

Trang chủ - Đại học Nguyên Tất Thành

Hinh 1.3.1.4b: Khai bảo mội thẻ có sử dụng thuộc tinh

Cấu trúc của một tài liệu HTML:

- Luôn tồn tại một “cặp thé” <html> va </html>

- Thuong gồm có 2 phần: Head và Body

> Head: là sử dụng cho mục đích khai báo thông tin về trang HTML:

s* Tiêu đề, loại đữ liệu đề hiện thị trong trang, các thành phần hỗ trợ cho định dạng, cac script (kich bản),

> Body: là phần thể hiện nội dung của trang HTML (người dùng có thể thấy được thông tin của phần này) Thường bao gồm:

“+ Van ban s* Hình anh s* Video

s* Âm thanh

s* Các thành phần phục vụ cho thu thập dữ liệu

~_ Minh họa một tài liệu HTML đơn giản:

> Cac <!DOCTYPE html> tuyên bố xác định rằng tài liệu này là một tài liệu HTML5

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

> Phần tử <tile> chỉ định tiêu đề cho trang HTML (được hiển thị trong

thanh tiêu đề của trình duyệt hoặc trong tab cua trang)

> Phần tử <body> xác định nội dung của tài liệu và là vùng chứa tất cả nội

dung hiển thị, chăng hạn như tiêu đề, đoạn văn, hình ảnh, siêu liên kết, bảng, danh sách,

Hlinh 1.3.1.4c: Mot tai liéu HTML don gian

1.3.1.5 Ưu điểm của HTML

- Ngôn ngữ được sử dụng rộng lớn này có rất nhiều nguồn tài nguyên hỗ trợ và

cộng đồng sử dụng cực lớn

- Sử dụng mượt mà trên hầu hết mọi trình duyệt

- Có quá trình học đơn giản và trực tiếp

- Chuẩn chính của web được vận hành bới World Wide Web Consortium (W3C)

- Dễ dảng tích hợp các ngôn ngữ backend như PHP và Node.js

- Mã nguồn mở và hoàn toàn miễn phí

- Markup gọn gàng và đồng nhất

1.3.1.6 Nhược điểm của HTML

- Khó kiểm soát cảnh thực thi của trình duyệt (ví dụ: những trình duyệt cũ không renđer được tag mới)

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

- Được dùng chủ yếu cho web tĩnh Đối với các tính năng động phải sử dụng ngôn ngữ kịch bản như Javascnipt hoặc ngôn ngữ backend như PHP

- Hâu hết các trang đêu được tạo riêng biệt, kê cả khi nó sử dụng các yêu tô, như

la headers hay footers

- Một số trình duyệt chậm hỗ trợ tính năng mới

1.3.1.7, Các loại HTML hiện nay

- HTML4: ra đời vào năm 1997 là phiên bản thứ 4 của ngôn ngữ đánh dấu siêu văn bản Phiên bản HTML này được xuất bản dưới dạng như một W3C Recommendation HTML 4 áp đụng cho nhiều phần tử và thuộc tính khác nhau cho

trỉnh duyệt web

- XHTML: có tên đầy đủ là Extensible HyperText Markup Language, nghĩa là ngôn ngữ đánh dấu siêu văn bản mở rộng Đây là một ngôn ngữ thay thế của HTML với củ pháp chặt chẽ hơn Cụ thể, XHTML yêu cầu mọi phần tử được đóng bằng thẻ đóng hoặc cú pháp tự đóng riêng và phân biệt được chữ m hoa hoặc chữ 1n thường, trong khi đó HTML không có điều này

- HTMLS: phiên bản thứ 5 của HTML được công bố bởi World Wide Web

Consortium (W3C) HTML5 là sự kết hợp giữa HTML 4, XHTML, DOM cấp 2 và

JavaScript HTMLS hé tro chay trén moi trinh duyét

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

đánh dấu, như là HTML Nó có thẻ điều khiển định dang cua nhiéu trang web cung

lúc đề tiết kiệm công sức cho người viết web Nó phân biệt cách hiển thị của trang web với nội dung chính của trang băng cách điêu khiên bô cục, màu sắc, và font chữ

CSS là ngôn ngữ tạo phong cách cho trang web — Cascading Style Sheet language No dùng đề tạo phong cách và định kiêu cho những yếu tố được viết dưới dạng ngôn ngữ

đánh dấu, như là HTML Nó có thẻ điều khiển định dang cua nhiéu trang web cung

lúc đề tiết kiệm công sức cho người viết web Nó phân biệt cách hiển thị của trang web với nội dung chính của trang băng cách điêu khiên bô cục, màu sắc, và font chữ

ID dung dé đặt tên cho phân tử, tên này phải là duy nhat, không có trường hợp tên id của các phần tử bị trùng nhau (nêu so sánh một phần tử trong trang web giống như một người công đân Việt Nam thì tên ¡d cũng giống như số CMND, nó dùng đề xác định

danh tính của phần tử)

Chức năng của thuộc tính Class cũng gần giống với thuộc tính ID, đó chính là đùng đề

đặt tên cho phân tử Tuy nhiên, việc đặt tên Class khác với tên ID ở chỗ là với cùng

một tên Class thì chúng ta có thể dùng để đặt cho nhiều phần tử khác nhau (nếu so sánh một phân tử trong trang web giống như một người công dân Việt Nam thì tên

Class cũng giống như một cái biệt danh, mà biệt danh thi co thé ding dé dat cho nhiều

người khác nhau)

1.3.2.3 Unit — Color — Attributes:

Unit trong CSS la don vi do cua thuéc tin trong CSS nhu margin, padding, width, height, Giá trị có thể mang giá trị âm, không có khoảng trắng giữa giá trị và đơn vị

đo Trong CSS có 2 loại đơn vị đó là đơn vị tuyệt đối (absolute) và đơn vị tương đối (relative)

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

CSS sử dụng các giá trị màu để xác định màu sắc hiển thị Có thể thiết lập màu nền

(background-color) hoặc màu cần cảnh (foreground) của một phân tử, hoặc màu của đường viền hay đường bao của một khung hay một bảng Màu được hiển thị kết hợp bởi 3 màu đỏ, xanh lục, xanh đương

Mỗi thẻ HTML ta có thê ví như một đối tượng, lúc này đối tượng sẽ có tác dụng thuộc tính mô tả cho nó

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

1.3.3 Giới thiệu Javascripf Javascnpt là một ngôn ngữ kịch bản từ Netscape Nó tương tự như khả năng Visual Basic cua Microsoft , Sun’s Tcl , Perl cua UNIX va REXX cia IBM Noi chung, ng6n ngữ kịch bản được đễ dàng hơn và nhanh hơn để mã trong hơn các ngôn ngữ có cấu

trúc và biên soạn hơn như C và C + + Ngôn ngữ kịch bản nói chung mắt nhiều thời

gian hơn quá trình biên soạn ngôn ngữ, nhưng rất hữu ích cho các chương trình ngắn hơn

JavaScript là ngôn ngữ lập trình mang đến sự sinh động của website Nó khác với HTML (thường chuyên cho nội dung) và CSS (thường chuyên dùng cho phong cách),

và khác hãn với PHP (chạy trên server chứ không chạy đưới máy client)

JavaScript có thể học nhanh và đễ dàng áp dụng cho nhiều mục đích khác nhau, từ việc cải thiện tính năng của website đên việc chạy game và tạo phần mềm nên web

1.3.3.2 Ưu điểm:

JavaScript có rất nhiều ưu điểm khiến nó vượt trội hơn so với các đối thủ, đặc biệt

trong các trường hợp thực tế Sau đây chỉ là một số lợi ích của JavaScript:

* Bạn không cần một compiler vì web browser có thể biên dịch nó bằng HTML;

* Nó dễ học hơn các ngôn ngữ lập trình khác;

` Lỗi dễ phát hiện hơn và vì vậy dễ sửa hơn;

Nó có thể được gan trên một số element của trang web hoặc event của

trang web như là thông qua click chuột hoặc di chuột tới;

Thiết kế website Hãng hàng không và đặt vé GVHD: Đặng Đức Trung

*⁄_ ]S hoạt động trên nhiều trình duyệt, nền tảng, vâng vâng:

* Bạn có thể sử dụng JavaScript để kiểm tra input và giảm thiểu việc kiểm tra thủ công khi truy xuat qua database:

Y No giup website tương tác tốt hơn với khách truy cập:

Nó nhanh hơn và nhẹ hơn các ngôn ngữ lập trình khác

1.3.3.3 Nhược điểm:

Các vấn đề bảo mật các đoạn mã J avascript, một khi đã được nỗi vào các trang web

thực hiện trên các máy chủ khách hàng ngay lập tức và do đó cũng có thể được sử

dụng để khai thác hệ thông của người dùng Mặc dù một số hạn chế nhất định được thiết lập bởi các tiêu chuẩn web hiện đại trên các trình duyệt, mã độc hại van có thể được thực hiện tuân thủ các quy định hạn chế

JavaScript có thể thay đối nội dung HTML Một trong những phương pháp HTML Javascript la getElementByld() Vi dụ bên dưới "tìm" một phần tử HTML (với id =

"đemo") và thay đổi nội dung phần tử (innerHTML) thành "Hello JavaScript"

VD: Javascript chấp nhận cả dâu ngoặc kép và đầu nháy đơn

document getE1ementBy1d( ).innerHTML = A

document getElementBy1d( ).innerHTML =