Thông tin tài liệu
Công cụ web 1 1 Công Cụ Web Cách hoạt động của World Wide Web 2 Công cụ Web Tổng quan <HTML> <BODY> <P>Hello<BR> <IMG SRC=‘file.gif’></ P> </HTML> Hello Page to Browser Display User Client Body { font-family: …; font-weight: …; } Servers CSS Style Sheet <HTML> <asp: label…> <asp: TextBox…> </HTML> ASPX: Template/Layout Imports System.Data Public Class MyStart … End Class ASPX.vb: Code Database P a g e r e q u e s t Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. Công cụ web 2 3 Công cụ Web Tổng quan Cách hoạt động của các trang web Cách hoạt động của các trình duyệt web Cách hoạt động của các ngôn ngữ Markup Cách hoạt động của HyperText Cách hoạt động của URL Cách hoạt động của các imagemap (bản đồ ảnh) và các Form tương tác Cách hoạt động của Web Host Server Cách hoạt động của Website với các cơ sở dữ liệu 4 Công cụ Web Cách hoạt động của các trang web World Wide Web (WWW) là phần phát triển và cải tiến nhất của Internet. WWW cho phép chúng ta thể hiện các văn bản dưới dạng đa phương tiện gồm có các văn bản (text), hình ảnh đồ họa (image), âm thanh (audio), phim ảnh (video) và các liên kết đến các trang web hay tài nguyên web khác. Ngôn ngữ dùng để tạo web được gọi là HyperText Markup Language (HTML) Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. Công cụ web 3 5 Công cụ Web Cách hoạt động của các trang web HTML Codes <html> … </html> Program / Scripts Client Web Server Request Response 6 Công cụ Web Cách hoạt động của các trang web (tiếp theo) WWW hoạt động dựa trên mô hình client/server trong đó: phần mềm client là các trình duyệt web (Internet Explorer, Nestcape Communicator, Firefox, Opera…) chạy trên các máy đơn. phần mềm server (IIS, Apache…) chạy trên máy chủ web. Để sử dụng web trước tiên máy bạn phải có kết nối Internet và sau đó khởi động trình duyệt web (web browser) Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. Công cụ web 4 7 Công cụ Web i. Để mở một trang web, user phải gõ nhập địa chỉ URL tương ứng của trang web hay tài nguyên web vào ô địa chỉ của trình duyệt. ii. Trình duyệt web gửi yêu cầu URL bằng cách sử dụng giao thức HTTP, giao thức này ấn định cách mà trình duyệt web và web server giao tiếp với nhau. iii. Địa chỉ URL sẽ cho biết chính xác trang web hay tài nguyên web nào được yêu cầu protocol://host.domain:port/path/filename Cách hoạt động của các trang web (tiếp theo) 8 Công cụ Web Cách hoạt động của các trang web (tiếp theo) iv. Yêu cầu được gửi đến Internet. Các Internet Router kiểm tra yêu cầu để xác định web server nào phù hợp dựa trên địa chỉ URL (host.domain:port/path/filename) và gửi đi. v. Web server nhận yêu cầu bằng cách sử dụng giao thức HTTP để biết được trang web hay tài nguyên web nào được yêu cầu vi. Khi web server tìm thấy trang web hay tài nguyên web được yêu cầu nó gửi trang web hay tài nguyên web đó trở về trình duyệt web trên máy con để hiển thị cho user thấy. Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. Công cụ web 5 9 Công cụ Web Trình duyệt web (Web browser) 10 Công cụ Web Cách hoạt động của trình duyệt web Các trình duyệt web là các phần mềm client (Internet Explorer, Nestcape Communicator, Firefox, Opera…) chạy trên các máy đơn. Trình duyệt web hiển thị thông tin bằng cách thông dịch ngôn ngữ HTML. Việc tạo mã bằng ngôn ngữ HTML cho trình duyệt web biết cách hiển thị các văn bản dưới dạng đa phương tiện gồm có các văn bản (text), hình ảnh đồ họa (image), âm thanh (audio), phim ảnh (video) và các liên kết đến các trang web hay tài nguyên web khác. Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. Công cụ web 6 11 Công cụ Web Các thông báo lỗi thông thường của trình duyệt web i. Server Does Not Have a DNS Entry ii. 503 Service Unavailable iii. 4039 Access Forbidden, Too Many User Are Connected iv. 404 Not Found v. 401 Unauthorized vi. 403 Forbidden 12 Công cụ Web Các ngôn ngữ Markup Descriptive Markup Descriptive Markup Procedural Markup Procedural Markup Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. Công cụ web 7 13 Công cụ Web Cách hoạt động của các ngôn ngữ Markup Ngôn ngữ Markup là tập hợp các thẻ lệnh (tag) để thể hiện các các văn bản. HTML là ngôn ngữ markup của web. HTML dùng để định dạng các loại văn bản trên web và các liên kết đến các trang web hay tài nguyên web khác. Chúng ta có thể sử dụng bất kỳ chương trình soạn thảo văn bản nào để tạo trang web bằng ngôn ngữ HTML. Web được phát triển từng ngày và HTML cũng mở rộng và thay đổi thành Dynamic HTML (DHTML). 14 Công cụ Web Cách hoạt động của HyperText Clicking on the “Deitel” link will open up the Deitel homepage in a new browser window. Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. Công cụ web 8 15 Công cụ Web Cách hoạt động của HyperText HyperText gồm có một siêu liên kết (Hyperlink) xuất hiện trên màn hình dưới dạng một dòng văn bản được bật sáng, một biểu tượng hay một hình ảnh. Khi kích vào các hyperlink, trang web sẽ chuyển đến trang web hay tài nguyên web tương ứng được khai báo trong liên kết. 16 Công cụ Web Cách hoạt động của URL i. Trình duyệt web trên máy con gửi địa chỉ URL của tài nguyên web đến máy chủ thông qua kết nối bằng giao thức TCP/IP ii. Sau khi nhận địa chỉ URL, máy chủ sẽ thực hiện việc tìm kiếm tài nguyên web tương ứng. Nếu tìm thấy, máy chủ sẽ kiểm tra kiểu file của tài nguyên đó và gửi thông tin này đến máy con. Ngược lại, máy chủ sẽ thông báo không tìm thấy iii. Trình duyệt web trên máy con sẽ đọc kiểu file và hiển thị thông tin nếu kiểu file đó trình duyệt đọc được. Ngược lại trình duyệt sẽ hiển thị hộp thoại cho phép lưu file để có thể mở bằng phần mềm thích hợp Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. Công cụ web 9 17 Công cụ Web Cách hoạt động của các imagemap và các Form Imagemap là các hình ảnh đồ họa trên trang web. Các Imagemap có thể chứa các hyperlink để liên kết đến các tài nguyên web khác bằng địa chỉ URL Các chức năng trên web thường được gọi là các Form tương tác. Các Form tương tác là nơi để bạn cung cấp thông tin cho trang web như: họ tên, địa chỉ, email… 18 Công cụ Web Cách hoạt động của các imagemap Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. Công cụ web 10 19 Công cụ Web Cách hoạt động của các imagemap i. Khi user nhấn chuột kích hoạt vào vùng liên kết được chỉ định trên Imagemap, trình duyệt sẽ gửi tọa độ (x,y) tại vị trí đó đến mày chủ ii. Máy chủ sẽ dò tìm và gửi tài nguyên web tương ứng về cho máy con iii. Trình duyệt trên máy con sẽ hiển thị tài nguyên web được trả về cho user thấy 20 Công cụ Web Form tương tác Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only. [...]... 51 Công cụ Web Which Color Palette? Black (0,0,0) Blue (0,0,255) Why 00,33,66, 99,CC,FF? Green (0,255,0) Which one is (99,FF,CC), (153,255,204)? Red (255,0,0) White (FF,FF,FF) (255,255,255) 52 Công cụ Web 26 Công cụ web Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only 6x6x6 Color Palette 53 Công cụ Web True Color (RGB) “Palette” 54 Công cụ Web 27 Công cụ. .. transparent GIF 57 Công cụ Web Transparency GIF Not a transparent GIF a transparent GIF 58 Công cụ Web 29 Công cụ web Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only Animated GIF 59 Công cụ Web Câu hỏi ? ? ? 60 Công cụ Web 30 Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only Công Cụ Web Ngôn ngữ HTML 1... kết quả về cho web server, web server sẽ đính kèm theo một header vào kết quả và gởi nó đến trình duyệt 22 Công cụ Web 11 Công cụ web Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only Cách hoạt động của Website với các cơ sở dữ liệu Server Component Request Database Client Reply Web Page Web Server Web Page 23 Công cụ Web Cách hoạt động của Website với các... bày website 26 Công cụ Web 13 Công cụ web Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only 1 Giới thiệu về WWW (World Wide Web) Internet là mạng máy tính lớn nhất trên thế giới hay còn gọi là mạng của các mạng máy tính (network of networks) World Wide Web (WWW) là một tập con của Internet WWW bao gồm các web server (máy chủ web) trên thế giới Web. .. cơ sở dữ liệu hoặc một trang web khác tùy theo yêu cầu nghiệp vụ 21 Công cụ Web Cách hoạt động của Web Host Server Trình duyệt web trên máy con gửi yêu cầu về dữ liệu đến Web server Nếu yêu cầu là một tài nguyên web, web server sẽ tìm file tương ứng, đính kèm theo một header và gởi nó đến trình duyệt Nếu yêu cầu là một thông tin lưu trữ tại một cơ sở dữ liệu cụ thể, web server sẽ chuyển yêu cầu... mới 41 Công cụ Web Thẻ Định nghĩa một anchor trong văn bản Anchor được dùng để liên kết với các trang khác Nó có thể được dùng để gán nhãn cho 1 phần trong văn bản (còn được gọi là named anchor) Attributes href=url xác định địa chỉ URL của nơi cần liên kết name=text định danh cho một phần văn bản trên trang web (Dùng trong liên kết nội trong trangweb) 42 Công cụ Web 21 Công cụ web Generated... hoạt động Màu mặc định là blue 45 Công cụ Web 7 Hình ảnh Dùng để chèn hình ảnh vào trang web Attributes align=top|middle|bottom|left|right canh lề cho hình ảnh và văn bản xung quanh alt=text Chuỗi văn bản hiển thị để thay thế khi hình ảnh không hiển thị border=number Chỉ ra độ dày (theo pixel) của đường viền Giá trị mặc định là 0 46 Công cụ Web 23 Công cụ web Generated by Foxit PDF Creator... 24-bits 16,777,215 colors 2^24 = 16.7 million 49 Công cụ Web Bitmaps, Pixels & Colors Các điểm màu tạo thành một hình bitmap được gọi là "pixels" Web pages được tính theo đơn vị Pixels Màu sắc (Color) thể hiện trên máy tính là tập hợp từ ba màu chính: red, green, blue (RGB) Các màu khác để thể hiện dựa vào ba màu kể trên 50 Công cụ Web 25 Công cụ web Generated by Foxit PDF Creator © Foxit Software... một đầu đáp ứng HTTP như sau: Expires: Mon, 11 Sep 2006 19:15:30 GMT 36 Công cụ Web 18 Công cụ web Generated by Foxit PDF Creator © Foxit Software http://www.foxitsoftware.com For evaluation only Ký tự đặc biệt trong tài liệu HTML Ký tự đặc biệt Mã HTML Lớn hơn (>) > Nhỏ hơn ( . only. Công cụ web 12 23 Công cụ Web Cách hoạt động của Website với các cơ sở dữ liệu Database Client Web Server Request Reply Web Page Server Component Web Page 24 Công cụ Web Cách hoạt động của Website. Software http://www.foxitsoftware.com For evaluation only. Công cụ web 5 9 Công cụ Web Trình duyệt web (Web browser) 10 Công cụ Web Cách hoạt động của trình duyệt web Các trình duyệt web là các phần mềm client (Internet. web 3 5 Công cụ Web Cách hoạt động của các trang web HTML Codes <html> … </html> Program / Scripts Client Web Server Request Response 6 Công cụ Web Cách hoạt động của các trang web
Ngày đăng: 25/10/2014, 19:18
Xem thêm: BÀI GIẢNG MÔN CÔNG CỤ WEB, BÀI GIẢNG MÔN CÔNG CỤ WEB
