Bài thảo luận học phần thiết kế và triển khai website Đại học Thương Mại

Bài thảo luận học phần thiết kế và triển khai website Đại học Thương Mại Bài thảo luận học phần thiết kế và triển khai website Đại học Thương Mại Bài thảo luận học phần thiết kế và triển khai website Đại học Thương Mại Bài thảo luận học phần thiết kế và triển khai website Đại học Thương Mại Bài thảo luận học phần thiết kế và triển khai website Đại học Thương Mại Bài thảo luận học phần thiết kế và triển khai website Đại học Thương Mại Bài thảo luận học phần thiết kế và triển khai website Đại học Thương Mại Bài thảo luận học phần thiết kế và triển khai website Đại học Thương Mại

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC THƯƠNG MẠI

-0 -BÀI THẢO LUẬN Học phần: Thiết kế và triển khai website

Lớp học phần: 2121ECIT0731

Giảng viên: Trần Thị Nhung

Môn học: Thiết kế và triển khai Website

Hà Nội – 2021

Mục lục

A Lý thuyết

I Tìm hiểu và làm rõ những điểm giống và khác nhau của 2 mô hình TCP/IP và

OSI 3

II Nghiên cứu tìm hiểu các giao thức mạng phổ biến 4

III. Các nguyên tắc thiết kế và triển khai website 8

B Thực hành I. Tạo một trang web theo chủ đề yêu thích 10

II. Nêu mục đích của trang web 21

III. Các công cụ tạo lập web 22

IV. Kiến trúc của web 23

C Đánh giá đánh viên

Mô hình OSI chia giao tiếp mạng thành 7 tầng Từ tầng 1 đến tầng 4 là là nhữnglớp thuộc cấp thấp, nó thực hiện nhiệm vụ di chuyển dữ liệu Từ tầng 5 đến tầng 7 làlớp thuộc cấp cao, thực hiện nhiệm vụ đặc thù và chuyển tiếp dữ liệu.

Mô hình TCP/IP có sự kết hợp giữa các giao thức riêng biệt Nhiệm vụ của mỗigiao thức là giúp máy tính có thể kết nối, truyền thông tin qua lại với nhau TCP làgiao thức điều khiển truyền nhận còn Internet Protoco (IP) là giao thức liên mạng.TCP/IP gồm 4 tầng đó là tầng ứng dụng, tầng mạng, tầng giao vận và tầng vật lý.FTP, HTTP, HTTPS ba giao thức được dùng nhiều nhất của TCP/IP FTP là giaothức giúp cho máy tính có thể gửi dữ liệu không giới hạn đến một hay nhiều máy tínhkhác HTTP có chức năng truyền dữ liệu không an toàn giữa người dùng web và máychủ web HTTPS là giao thức được dùng để truyền dữ liệu an toàn giữa người dùngweb và máy chủ web

 Giống nhau: Mô hình OSI và TCP/IP có một số điểm chung như sau:

- OSI và TCP/IP đều có kiến trúc phân lớp

- OSI và TCP/IP đều có lớp Network và lớp Transport

- OSI và TCP/IP cùng sử dụng kỹ thuật chuyển Packet

- Đều có lớp Application, mặc dù các dịch vụ ở mỗi lớp khác nhau

- Các nhà quản trị mạng chuyên nghiệp cần thiết biết rõ hai mô hình trên

 Khác nhau:

TCP/IP là một giao thức truyền thông cho phép kết nối máy chủ với internet.

Ngược lại, OSI là một cổng kết nối giữa mạng và người dùng cuối TCP/IP đề cập đếnGiao thức điều khiển truyền vận Transmission Control Protocol được sử dụng trêninternet và các ứng dụng trên internet Giao thức này ban đầu được xây dựng theo hợpđồng tại Bộ Quốc phòng Mỹ và đã phát triển để cho phép các thiết bị khác nhau kếtnối được với internet

OSI là Open Systems Interconnection , một cổng kết nối được phát triển bởi

Tổ chức Quốc tế về Tiêu chuẩn hóa (ISO)

Điểm khác giữa OSI và TCP IP Model là gì? Đầu tiên là mô hình thực hiệntrên OSI và TCP IP Model được phát triển TCP/IP bắt nguồn từ việc thực hiện môhình OSI, dẫn đến sự đổi mới này OSI được phát triển như một mô hình tham khảo cóthể được sử dụng online Mô hình dựa trên TCP/IP được phát triển, hướng tới một môhình xoay quanh internet Mô hình mà OSI được phát triển là một mô hình lý thuyếtchứ không phải là internet

Độ tin cậy và phổ

biến

Nhiều người cho rằng đây

là mô hình cũ, chỉ để tham khảo, số người sử dụng hạn chế hơn so với TCP/IP

Được chuẩn hóa, nhiều người tin cậy và sử dụng phổbiến trên toàn cầu

Phương pháp tiếp Tiếp cận theo chiều dọc Tiếp cận theo chiều

cận ngang

Sự kết hợp giữa

các tầng

Mỗi tầng khác nhau sẽ thực hiện một nhiệm vụ khác nhau, không có sự kết hợp giữa bất cứ tầng nào

Trong tầng ứng dụng có tầng trình diễn và tầng phiên được kết hợp với nhau

Thiết kế sau đó sẽ phát triển giao thứcPhát triển mô hình trước

Các giao thức được phát triển trước sau đó phát triển

mô hình

Truyền thông Hỗ trợ cả kết nối định

tuyến và không dây

Hỗ trợ truyền thông không kết nối từ tầng mạngTính phụ thuộc Giao thức độc lập Phụ thuộc vào giao thức

II Nghiên cứu tìm hiểu các giao thức mạng phổ biến

Giao thức mạng là một tập hợp các quy tắc mà mạng phải tuân theo Giao thứcmạng là những tiêu chuẩn và chính sách chính thức được tạo thành từ các quy tắc, quytrình và định dạng xác định giao tiếp giữa hai hoặc nhiều thiết bị qua mạng Các giaothức mạng thực hiện những hành động, chính sách và giải quyết vấn đề từ đầu đếncuối, để quá trình giao tiếp mạng hoặc dữ liệu diễn ra kịp thời, được bảo mật và quản

lý Giao thức mạng xác định các quy tắc và quy ước giao tiếp

Các giao thức mạng phổ biến hiện nay:

1.Giao thức truyền tải siêu văn bản (HTTP – HyperText Transfer Protocol)

1.1.Khái niệm

HTTP là nền tảng giao tiếp dữ liệu cho World Wide Web Siêu văn bản (hypertext)

là văn bản có cấu trúc sử dụng các siêu liên kết giữa các node chứa văn bản HTTP làgiao thức ứng dụng cho hệ thống thông tin hypermedia (siêu phương tiện) phân tán vàkết hợp

1.2.Chức năng của HTTP

Các chức năng HTTP cung cấp giao thức truyền thông mô hình máy chủ-khách.Một trình duyệt web có thể là khách và một máy tính lưu trữ trang web có thể là máychủ Máy khách gửi một thông báo yêu cầu HTTP đến máy chủ Máy chủ cung cấp cáctài nguyên như tệp HTML và nội dung khác hoặc thực hiện các chức năng khác thaycho máy khách, trả về thông báo phản hồi cho khách Phản hồi chứa thông tin trangthái hoàn thành về yêu cầu và cung có thể chứa nội dung được yêu cầu

HTTP cho phép các thành phần mạng liên lạc giữ máy khách và máy chủ Các trang web lưu lượng truy cập cao thường được sử dụng các bộ đệm web cung cấp nội dung thay cho các áy chủ thật để cải thiện thời gian phản hồi Các trình duyệt web lưu trữ tài nguyên web được truy cập trước đó và sử dụng lại chúng khi có thể, để giảm lưu lượng mạng Các máy chủ proxy HTTP tại các mạng riêng có thể tạo kết nối cho máy khách bằng cách chuyển gói tin với các máy chủ bên ngoài

HTTP được xác định bằng các Uniform Resourse Locators (URL)

Cổng mặc định của HTTP là 80 và 443 Hai cổng này đều được bảo mật

2.Giao thức truyền tập tin (FTP-File Transfer Protocol)

+Sử dụng để tải xuống máy tính các file từ máy chủ

*Tại sao nên dùng FTP: Mặc dù việc truyền file từ hệ thống này sang hệ thốngkhác rất đơn giản và dễ hiểu, nhưng đôi khi xảy ra những vấn đề khác nhau Ví dụ, 2

hệ thống có thể có các quy ước tập tin khác nhau, 2 hệ thống có các cách khác nhau đểthể hiện văn bản và dữ liệu hay 2 hệ thống có cấu trúc thư mục khác nhau, … Giaothức FTP khắc phục những vấn đề này bằng cách thiết lập 2 kết nối giữa các máy chủ.Một kết nối để sử dụng truyền dữ liệu, 1 kết nối còn lại được sử dụng để điều khiển kếtnối

2.2.Chức năng của FTP

*Phía Server

-Server Protocol Interpreter (Server-PI) : Chịu trách nhiệm quản lí ControlConnection trên Server Nó lắng nghe yêu cầu kết nối hướng từ User trên cổng 21 Khikết nối được thiết lập, nó nhận lệnh từ User-PI, gửi phản hồi và quản lí tiến trìnhtruyền dữ liệu trên Server

-Server Data Transfer Process (Server-DTP) : chịu trách nhiệm nhận và gửi file từUser-DTP Server-DTP vừa làm nhiệm vụ thiết lập Data Connection và lắng ngheData Connection của User thông qua cổng 20 Nó tương tác với Server File Systemtrên hệ thống cục bộ để đọc và chép file

*Phía Client

-User Interface: Đây là chương trình được chạy trên máy tính, nó cung cấp giaodiện xử lí cho người dùng, chỉ có trên phía Client Nó cho phép người dùng sử dụngnhững lệnh đơn giản để điều khiển các session FTP, từ đó có thể theo dõi được cácthông tin và kết quả xảy ra trong quá trình

-User Protocol Interpreter (User-PI): Chịu trách nhiệm quản lí Control Connectionphía Client Nó khởi tạo phiên kết nối FTP bằng việc phát hiện ra Request tới Server-

PI Sau khi kết nối được thiết lập, nó xử lí các lệnh nhận được trên User Interface, gửichúng tới Server-PI rồi đợi nhận Response trở lại Nó cũng quản lí các tiến trình trênClient

User Data Transfer Process (User-DTP): Có nhiệm vụ gửi hoặc nhận dữ liệu từServer-DTP User-DTP có thể thiết lập hoặc lắng nghe DataConnection từ Serverthông qua cổng 20 Nó tương tác với Client File System trên Client để lưu trữ file.

2.3 Nguyên lí hoạt động của FTP

Cần có 2 kết nối TCP trong phiên làm việc của FTP: TCP Data connection trêncổng 20, TCP Control connection trên cổng 21

Control connection : luôn được mở ở mọi thời điểm khi dữ liệu hoặc lệnh được gửi.Data connection : chỉ được mở khi có trao đổi dữ liệu thực

Cổng thức mặc định của FTP là 20/21

3.Bộ giao thức TCP/IP (Transmission Control Protocol/ Internet Protocol)

Bộ giao thức TCP/IP – Giao thức điều khiển đường truyền hay giao thức kiểm soátđường truyền được phát triển từ mạng ARPANET và Internet được dùng như giaothức mạng và vận chuyển trên mạng TCP là giao thức thuộc tầng giao vận và IP hiệnnay là giao thức được sử dụng rộng rãi nhất để liên kết các máy tính và các mạng

3.1.Cách thức hoạt động

TCP/IP sử dụng mô hình giao tiếp máy khách/máy chủ, trong đó người dùng hoặcthiết bị (máy khách) được một máy tính khác (máy chủ) cung cấp một dịch vụ (giốngnhư gửi một trang web) trong mạng

Nói chung, bộ giao thức TCP/IP được phân loại là không có trạng thái, có nghĩa làmỗi yêu cầu của máy khách được xem là mới bởi vì nó không liên quan đến yêu cầutrước Việc không có trạng thái này giúp giải phóng đường mạng, do đó chúng có thểđược sử dụng liên tục

3.2.Cấu trúc

TCP/IP được chia thành bốn tầng, mỗi tầng bao gồm các giao thức cụ thể

Tầng ứng dụng cung cấp các ứng dụng với trao đổi dữ liệu được chuẩn hóa Cácgiao thức của nó bao gồm Giao thức truyền tải siêu văn bản (HTTP), Giao thức truyềntập tin (File Transfer Protocol - FTP), Giao thức POP3, Giao thức truyền tải thư tínđơn giản (Simple Mail Transfer Protocol - SMTP) và Giao thức quản lý mạng đơngiản (Simple Network Management Protocol - SNMP)

Tầng giao vận chịu trách nhiệm duy trì liên lạc đầu cuối trên toàn mạng TCP xử

lý thông tin liên lạc giữa các máy chủ và cung cấp điều khiển luồng, ghép kênh và độtin cậy Các giao thức giao vận gồm giao thức TCP và giao thức UDP (User DatagramProtocol), đôi khi được sử dụng thay thế cho TCP với mục đích đặc biệt

Tầng mạng, còn được gọi là tầng Internet, có nhiệm vụ xử lý các gói và kết nối các mạng độc lập để vận chuyển các gói dữ liệu qua các ranh giới mạng Các giao thứctầng mạng gồm IP và ICMP (Internet Control Message Protocol), được sử dụng để báocáo lỗi

Tầng vật lý bao gồm các giao thức chỉ hoạt động trên một liên kết - thành phầnmạng kết nối các nút hoặc các máy chủ trong mạng Các giao thức trong lớp này baogồm Ethernet cho mạng cục bộ (LAN) và Giao thức phân giải địa chỉ (AddressResolution Protocol - ARP).

4.Hệ thống quản lý tên miền (DNS- Domain Name System)

Cổng mặc định của DNS là 53

5.Giao thức truyền tải thư tín (SMTP)

5.1.Phân loại: có 2 loại Mail Sever chính, đó là

-Mail Server gửi đi (Outgoing Mail Servers) hay còn được gòi là SMTP (SimpleMail Transfer Protocol) – Giao thức dịch chuyển Mail đơn giản

-Mail Server đến (Incoming Mail Servers) hay còn được biết đến dưới 2 loại giaothức:

+POP3 (Post Office Protocol phiên bản 3)

+IMAP (Internet Message Access Protocol

Trong cuộc hội thoại dưới đây, những gì trình khách gửi được đánh dấu bằng chữC: đứng trước, còn những gì trình chủ gửi được đánh dấu bằng S:

Các hệ thống máy tính đều có thể thiết lập một kết nối, bằng cách dùng nhữngdòng lệnh của phần mềm telnet, trên một máy khách

Cổng mặc định của SMTP là 25 và cổng SMTP được bảo mật (SMTPS) là 465(Không phải tiêu chuẩn)

III Các nguyên tắc thiết kế và triển khai website

1.Các nguyên tắc trong thiết kế website

-Tổ chức website chặt chẽ và dễ sử dụng

-Sử dụng từ ngữ dễ hiểu

-Dễ dàng khám phá các đường link

-Thời gian tải về nhanh

-Tương thích với đa số trình duyệt web

1.1.Các nguyên tắc tổ chức website

-Tổ chức website chặt chẽ và dễ sử dụng: website cần có cấu trúc logic, rõ ràng,thống nhất và dễ hiểu Quan trong là website phải làm cho độc giả thấy ngay đượcthông tin họ hy vọng có thể thu thập được từ website

-Sử dụng ngôn từ thông dụng, dễ hiểu để tạo sự thân thiện với độc giả: dùng lời lẽhoa mỹ để tán dương sản phẩm dịch vụ và quan trọng là cần phải thu hút độc giả truycập vào website, từ đó hiểu được nhu cầu của khách hàng

-Chú trọng đến thời gian tải về của các trang web: thời gian mà độc giả dành chomột website là yếu tố quan trọng góp phần vào sự thành công của website Bởi vậyđừng để độc giả phải đợi quá lâu để tải được một trang web Vì thế cần chú trọng đếnvấn đề thời gian để giữ chân độc giả với trang web của mình

-Chú trọng đến các phần nội dung thông tin không có hình ảnh: không chỉ các hìnhảnh đồ họa mới gây được sự chú ý cho độc giả mà các đoạn nội dung văn bản cũngđược quan tâm nếu chất lượng bài viết tốt Nội dung (content) cũng là một yếu tố đánhgiá website tốt hay không Vì vậy cần đầu tư phần nội dung một cách cẩn thận, đồngthời tạo các điểm nhấn như tiêu đề, hiệu ứng các chữ, từ khóa để bài content được sinhđộng hơn

-Theo dõi chặt chẽ “quá trình bán hàng” đối với website thương mại: yêu cầu củawebsite là cần phải tạo điều kiện để khách hàng thấy được rõ các sản phẩm và dịch vụ

mà người bán cung cấp tới mình, đặc biệt là cách thức đặt hàng và phương thức thanhtoán sao cho thuận tiện nhất

-Một số vấn đề khác: cần kiểm tra kĩ cả về nội dung và hình thức của website.Trước khi đưa vào hoạt động cần kiểm tra toàn bộ ( đương liên kết, thời gian tải, fformbán hàng ) và cố gắng kiểm tra bằng nhiều phương pháp khác nhau để có kết quảkhách quan nhất

1.2.Nguyên tắc tổ chức thông tin trên website

-Quy trình tổ chức thông tin trên website: tuân theo quy trình gồm 4 bước

+Phân chia thông tin thành các đơn vị logic

+Thiết lập hệ thống phân cấp thông tin

+Tạo mối quan hệ giữa các hệ thống phân cấp thông tin

+Phân tích sự thành công về chức năng và thẩm mỹ của các hệ thống thông tin-Các kiểu cấu trúc thiết kế:

+Cấu trúc nối tiếp (Sequence)

+Cấu trúc phân cấp (Hierarchy)

+Cấu trúc ô lưới (Grid)

+Phá vỡ các quy tắc thiết kế-sự cân bằng

+Cung cấp một tiêu điểm: sử dụng sự tương phản

-Các nguyên tắc sử dụng hình ảnh, đồ họa, text

+Nên kết hợp giữa đồ họa và văn bản

+Điều chỉnh kích cỡ sao cho hợp lý

2.Các nguyên tắc trong triển khai website

-Kiểm tra thật kỹ website trước khi triển khai

-Thuê không gian lưu trữ web đủ lớn và nên mua ở các tổ chức đáng tin cậy-Nên có quá trình thử nghiệm trước khi đưa trang web hoạt động chính thức-Nâng cấp và bảo trì trang web thường xuyên

B Thực hành

I Thiết kế website

/* Style the top navigation bar */

<form action="search.php" method="get">

Bạn muốn đi đâu?: <input type="text" name="Tìm kiếm" />

<input type="submit" name="ok" value="Tìm kiếm" />

<div class="topnav">

<a href=" # ">Trang chủ</a>

<a href=" # ">Khách sạn</a>

<a href=" # ">Tours</a>

<a href=" # ">Vé máy bay</a>

<a href=" # ">Ăn uống</a>

<a href=" # " style="float:right">Hotline: 68686868</a>

</div>

<div class="row">

<div class="leftcolumn">

<div class="card">

<h2>DU LỊCH TRONG NƯỚC</h2>

<h4>Lên rừng xuống biển - Trọn vẹn Việt Nam</h4>

<a href=" SAN-5-SAO " target="_blank"><img src=" https://thesinhtouristhanoi.vn/wp- content/uploads/2020/05/pq01-tour-du-lich-phu-quoc-Newstartour-25.jpg " width="340" height="250"> </a>

https://transviet.com.vn/1818.TOUR-PHU-QUOC-LE-1-5-KHACH-<a href=" NOI " target="_blank"><img src="

https://transviet.com.vn/2394.TOUR-HA-LONG-NINH-BINH-HA- chuan.jpg " width="340" height="250"> </a>

https://www.halongwave.vn/images/Hinh_Anh/tpthao/avatar-Ha-Long-Bay-<a href=" HA-LONG-YEN-TU "target="_blank"><img src="

https://transviet.com.vn/2471.TOUR-SAPA-HA-NOI-NINH-BINH-https://fansipanlegend.sunworld.vn/wp-content/uploads/2020/06/Logo.jpg " width="340" height="250"> </a>

<a href=" https://www.ivivu.com/khach-san-da-nang "target="_blank"><img src=" http://laodaidanang.com/uploads/images/11.jpg " width="340"