CHƯƠNG 1: TỔNG QUAN 1.1 Tổng quan về World Wide Web 1.1 Khái niệm World Wide Web (WWW) hay còn gọi là web là một dịch vụ phổ biến nhất hiện nay trên Internet, 85% các giao dịch trên Internet ước lượng thuộc về WWW. Ngày nay số website trên thế giới đã đạt tới con số khổng lồ. WWW cho phép truy xuất thông tin văn bản, hình ảnh, âm thanh, video trên toàn thế giới. Thông qua website, các quý công ty có thể giảm thiểu tối đa chi phí in ấn và phân phát tài liệu cho khách hàng ở nhiều nơi.2 Lợi ích của WWW mang lại World Wide Web có mối liên hệ mật thiết với mạng internet, vì vậy nó cũng mang lại cho con người rất nhiều lợi ích như: - World Wide Web giúp con người có thể dễ dàng kết nối với nhau dù ở bất kỳ thời điểm nào, ở bất kỳ nơi đâu trên thế giới.
WWW sẽ truyền tải những trang web, hình ảnh, thông tin… đến người dùng trong vòng vài giây. - WWW sẽ giúp cho các trang Blog, mạng xã hội chia sẻ thông tin đến hàng triệu người sử dụng một lúc chỉ bằng một cái click chuột. - Hiện nay World Wide Web cũng được các lập trình viên, chú trọng phát triển ứng dụng trên nền tảng điện thoại thông minh, giúp hỗ trợ rất nhiều cho con người trong công việc và cuộc sống. NGUYỄN THÀNH DƯƠNG - CT2001C 16 Luan van 1.3 Nguyên tắc hoạt động World Wide Web là một hệ thống các tài liệu siêu văn bản được liên kết với nhau qua mạng internet.
WWW cho phép hiển thị và truy xuất các văn bản, trên máy tính của người dùng. World Wide Web cho phép cá nhân người dùng liên kết các tài liệu và văn bản của họ với nhau để tạo thành mạng lưới các tài liệu.4 Các chức năng chính Chức năng chính của WWW đó là cung cấp thông tin cho người dùng, có nhu cầu tìm kiếm những thông tin cụ thể thông qua mạng internet. Như vậy World Wide Web được tạo ra để cung cấp thông tin cần thiết và những thông tin giải trí cho tất cả những người sử dụng mạng internet.5 Sự phát triển của WWW trong thời đại ngày nay Hiện nay mọi nội dung website, kế hoạch SEO, Marketing đều hướng tới các thiết bị di động bởi sự phát triển không ngừng của nó. - Thiết bị di động: Trước tiên phải kể đến sự bùng nổ chiều hướng lướt web trên các thiết bị di động.
Trong vài năm trở lại đây, thay vì dùng máy tính thông thường, người dùng có chiều hướng dùng điện thoại nhiều hơn. vì thế, toàn bộ các Website lớn, nhỏ đều thực hiện điều chỉnh các phương thức thiết kế giao diện, nội dung. Tiêu biểu đó là phương pháp đánh giá Mobile-friendly(là yếu tố để Google đánh giá thứ hạng của website) của Google. Mục đích cuối cũng vẫn là đem lại trải nghiệm tốt nhất cho người dùng.
- Tính bảo mật: Bên cạnh đó, quyền riêng tư và bảo mật thông tin trên Internet là một vấn đề đang ngày càng được lưu tâm. Khác với trước đây, lượng thông tin cá nhân khổng lồ, bao gồm: Lịch sử tìm kiếm, duyệt web, vị trí địa lý của người dùng tập tính tìm kiếm của người dùng.Những thông tin này nhiều được thu thập để đáp ứng cho mục đích nhắm mục tiêu quảng cáo. Vì thế, các dịch vụ Web proxy sẽ cung cấp cho người dùng trực tuyến mức độ riêng tư cao hơn nhờ định tuyến lại hành vi duyệt web thông qua các máy chủ Web của bên thứ ba. - Tên miền: NGUYỄN THÀNH DƯƠNG - CT2001C 17 Luan van Các website hiện nay vẫn dùng tên miền và miền mở rộng.com” vẫn thường nhật và thông dụng nhất.
mặc khác, cũng có nhiều tên miền mới hiện có sẵn để đăng ký như “. - Trình duyệt: IE và Firefox trước kia là các trình duyệt Web thông dụng nhất, nhưng hiện nay Chrome do Google quản lý vẫn đang thống lĩnh thị trường, mặt khác, mới đây nhất là sự xuất hiện của safari – trình duyệt thường nhật trên danh mục của Apple. - Công nghệ lập trình: HTML5 đã tái thiết lập HTML trở thành công nghệ Web hiện đại sau khi bị đình trệ trong nhiều năm. Tương tự như vậy, các cải tiến hiệu suất trong HTTP 2.0 cũng đảm bảo cho sự tồn tại của giao thức trong tương lai gần.6 Tầm quan trọng của WWW Tầm quan trọng của WWW được thể hiện qua các yếu tố sau: - Mang Internet, thông tin đến tất cả mọi người, không những dành cho các nhà khoa học như mục đích thống kê ban đầu.
- Kết nối thế giới theo cách không thể thực hiện được trước đây và giúp mọi người đơn giản nhận thông tin, chia sẻ thông tin và giao tiếp với nhau. - Cho phép mọi người chia sẻ công việc, suy nghĩ của họ thông qua các trang mạng xã hội, blog và video như hiện nay. - Đem lại tiện ích cùng trải nghiệm tốt nhất cho người dùng.2 Tổng quan về HTML – CSS 1.1 Tổng quan về HTML HTML là chữ viết tắt của HyperText Markup Language, dịch ra tiếng Việt có nghĩa là ngôn ngữ đánh dấu siêu văn bản. Nó dùng để định dạng bố cục, các thuộc tính liên quan đến cách hiển thị của một đoạn text và được hiển thị trên một chương trình đặc biệt, ta gọi là trình duyệt browser.
Hiện nay có khá nhiều browser như Firefox, Chrome, Cốc Cốc, .Tất cả browser đều có điểm chung là giúp người dùng thao tác với website và nó đều có khả năng biên dịch những đoạn mã HTML. NGUYỄN THÀNH DƯƠNG - CT2001C 18 Luan van HTML có rất nhiều thẻ khác nhau, và mỗi thẻ sẽ có những nhiệm vụ nhất định.1: Cấu trúc của file HTML Trong đó: • <!DOCTYPE html> là phần khai báo kiểu dữ liệu hiển thị là html để trình duyệt (Browser) biết. • <html> và </html> là cặp thẻ nằm ngoài cùng và nó có nhiệm vụ là bao hết nội dung của trang web lại. Thẻ này là bát buộc.
• <head> và </head> là phần khai báo thông tin của trang web • <title> và </title> nằm bên trong thẻ <head> và đây chính là khai báo tiêu đề cho trang web. • <body> và </body> là thành phần quan trọng nhất, nó chứa nhưng đoạn mã HTML dùng để hiển thị trên website • Các thẻ còn lại nằm trong thẻ <body> chính là các thẻ định dạng dữ liệu. Như vậy trong một website chúng ta chia làm 2 phần chính: • Phần 1: Là những khai báo thông tin cho trang web và ta đặt nó trong thẻ head. NGUYỄN THÀNH DƯƠNG - CT2001C 19 Luan van • Phần 2: Là phần hiển thị định dạng nội dung của trang web và ta đặt trong thẻ body.
Và được diễn tả như hình sau: Ngoài ra trong thẻ <body> của HTML còn có rất rất nhiều thẻ phục vụ các mục đích khác nhau như: • Thẻ <div>…</div> định nghĩa một nội dung. </p> tạo một đoạn mới. </font> thay đổi phông chữ, kích cỡ và màu kí tự. </table> đây là thẻ định dạng bảng trên website.
Sau khi khai báo thẻ này, phải khai báo các thẻ hàng <tr> và thẻ cột <td> cùng với các thuộc tính của nó. • Thẻ <img /> cho phép chèn hình ảnh vào website. Thẻ này thuộc loại thẻ không có thẻ đóng. </a> là loại thẻ dùng để liên kết giữa các website hoặc liên kết đến địa chỉ Internet, Mail hay Intranet (URL) và địa chỉ trong tập tin trong mạng cục bộ (UNC).
NGUYỄN THÀNH DƯƠNG - CT2001C 20 Luan van • Thẻ <input /> cho phép người dùng nhập dữ liệu hay chỉ thị thực thi một hành động nào đó, thẻ Input bao gồm các loại thẻ như: text, password, submit, button, reset, checkbox, radio, hidden, image. < \textarea> cho phép người dùng nhập liệu với rất nhiều dòng. Với thẻ này không thể giới hạn chiều dài lớn nhất trên website. • Thẻ <select> … </select> cho phép người dùng chọn phần tử trong tập phương thức đã được định nghĩa trước.
Nếu thẻ <select> cho phép người dùng chọn một phần tử trong danh sách phần tử thì thẻ <select> sẽ giống như combobox. Nếu thẻ <select> cho phép người dùng chọn nhiều phần tử cùng một lần trong danh sách phần tử, thẻ <select> đó là dạng listbox. • Thẻ <form> … </form> khi muốn submit dữ liệu người dùng nhập từ website phía Client lên phía Server, có hai cách để làm điều nàu ứng với hai phương thức POST và GET trong thẻ form. Trong một website có thể có nhiều thẻ <form> khác nhau, nhưng các thẻ <form> này không được lồng nhau, mỗi thẻ form sẽ được khai báo hành động (action) chỉ đến một trang khác.
Tổng quan về CSS CSS là chữ viết tắt của Cascading Style Sheets, nó là một ngôn ngữ được sử dụng để tìm và định dạng lại các phần tử được tạo ra bởi các ngôn ngữ đánh dấu (HTML). Nói ngắn gọn hơn là ngôn ngữ tạo phong cách cho trang web. Bạn có thể hiểu đơn giản rằng, nếu HTML đóng vai trò định dạng các phần tử trên website như việc tạo ra các đoạn văn bản, các tiêu đề, bảng…thì CSS sẽ giúp chúng ta có thể thêm style vào các phần tử HTML đó như đổi bố cục, màu sắc trang, đổi màu chữ, font chữ, thay đổi cấu trúc… CSS được phát triển bởi W3C (World Wide Web Consortium) vào năm 1996. Nó 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 dạng của nhiều trang web cùng 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ữ…. NGUYỄN THÀNH DƯƠNG - CT2001C 21 Luan van Mối tương quan giữa HTML và CSS rất mật thiết. HTML là ngôn ngữ markup (nền tảng của site) và CSS định hình phong cách (tất cả những gì tạo nên giao diện website), chúng là không thể tách rời.
Các stylesheet ngoài được lưu trữ dưới dạng các tập tin “. Bố cục CSS thường chủ yếu dựa vào hình hộp và mỗi hộp đều chiếm những khoảng trống trên trang của bạn với các thuộc tính như: • Padding: Gồm không gian xung quanh nội dung (ví dụ: xung quanh đoạn văn bản). • Border: Là đường liền nằm ngay bên ngoài phần đệm. • Margin: Là khoảng cách xung quanh bên ngoài của phần tử.
Mỗi đoạn CSS gồm các phần sau: vùng chọn { thuộc tính: giá trị; thuộc tính: giá trị;. } Điều này có nghĩa, CSS được khai báo trong vùng chọn, các thuộc tính cùng giá trị nằm ở cặp dấu “{}” và không giới hạn số lượng các thuộc tính. Từng thuộc tính có một giá trị riêng, tồn tại ở dạng số, hoặc tên giá trị được liệt kê trong danh sách của CSS.