(Tiểu luận) tiểu luận môn học thiết kế web thiết kế website nhà hàng new star

TRƯỜNG ĐẠI HỌC THỦ DẦU MỘT KHOA KỸ THUẬT – CÔNG NGHỆ TIỂU LUẬN MÔN HỌC THIẾT KẾ WEB THIẾT KẾ WEBSITE NHÀ HÀNG NEW STAR SVTH: Nguyễn Văn Phần MSSV:1824801030228 LỚP: D18PM04 GV: THS_Nguyễn Hữu Vĩnh B$NH DƯƠNG – 07/2020 KHOA KỸ THUẬT – CÔNG NGHỆ 0 Tieu luan Tiểu luận môn Thiết kế Web MỤC LỤC LỜI NÓI ĐẦU SƠ ĐỒ THIẾT KẾ TRANG WEB Sơ đồ tổng quát trang CHƯƠNG TỔNG QUAN VỀ ĐỀ TÀI Tên Đề Tài Mục Tiêu Đề Tài Ý Nghĩa Của Đề Tài Đối Tượng Của Đề Tài .8 Một Số Trang Chính Của Website .8 CHƯƠNG GIỚI THIỆU CÔNG NGHỆ Giới Thiệu Về HTML 1.1 HTML gì? 1.2 Công dụng HTML 1.3 Định dạng HTML Giới thiệu Adobe Dreamweaver .9 Ngôn ngữ CSS 10 Ngôn ngữ Javascript 10 CHƯƠNG 3: GIAO DIỆN CHƯƠNG TRÌNH 12 Đặc Tả Giao Diện 12 1.1 Giao diện trang chủ 12 1.2 Giao diện trang giới thiệu 14 1.3 Giao diện Trang Liên Hệ 15 1.4 Giao diện trang đăng ký 16 1.5 Giao diện trang đăng nhập 17 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web 1.6 Giao diện trangĐổi Mật Khẩu 18 1.7 Giao diện trang khuyến 19 1.8 Giao diện trang chi tiết sản phẩm 20 1.8.1 Giao diện trang Các ăn Cua 20 1.8.2 Giao diện trang Các ăn Tôm 22 1.8.3 Giao diện trang Các ăn Mực 23 1.8.4 Giao diện trang ăn Ĩc 24 1.9 Giao diện trang Chi tiết ăn 25 1.9.1 Giao diện trang Bánh kem dâu tây .25 1.9.2 Giao diện trang Cơm Chiên Mai Cua 26 1.9.3 Giao diện trang Lẩu Thập Cẩm 27 - Mục Đích: Cho khách hàng xem chi tiết Lẩu thập cẩm như: ngun liệu, giá, tình trạng,… 27 1.9.4 Giao diện trang Chè Bắp 28 2.0 Giao diện trang Thanh Toán: 29 CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 30 Kết đạt được: 30 Việc chưa làm được: 30 Hướng phát triển đề tài .31 TÀI LIỆU KHAM KHẢO 32 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web DANH MỤC HÌNH Hình 1: Trang Chủ 13 Hình 2: Trang Giới Thiệu .14 Hình 3: Trang Liên Hệ 15 Hình 4: Trang Đăng ký 16 Hình 5: Trang Đăng Nhập 17 Hình 6: Trang Đổi Mật Khẩu 18 Hình 7: Trang khuyến 19 Hình 8: Các ăn Cua 21 Hình 9: Các ăn Tơm 22 Hình 10: Các ăn Mực 23 Hình 11: Các ăn Óc 24 Hình 12: Trang thơng tin Bánh kem dâu tây 25 Hình 13: Trang thơng tin Cơm Chiên Mai Cua 26 Hình 14: Trang thơng tin Lẩu Thập Cẩm 27 Hình 15: Trang thông tin Chè Bắp 28 Hình 16: Trang Thanh Toán 29 NHẬN XÉT VÀ CHẤM ĐIỂM CỦA GIẢNG VIÊN SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web Họ tên giảng viên: Nguyễn Hữu Vĩnh Tên đề tài: THIẾT KẾ WEBSITE NHÀ HÀNG NEW STAR Nội dung nhận xét: Điểm: Bằng số: Bằng chữ: GIẢNG VIÊN CHẤM (Ký, ghi rõ họ tên) NGUYỄN HỮU VĨNH LỜI NÓI ĐẦU SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web Hiện nay, giới công nghệ thông tin thương mại điện tử phát triển mạnh mẽ Kỹ thuật số giúp tiết kiệm đáng kể chi phí nhờ chi phí vận chuyển trung gian, chi phí giao dịch đặc biệt giúp tiết kiệm thời gian để người đầu tư vào hoạt động khác Hơn nữa, thương mại điện tử giúp người tìm kiếm tự động theo nhiều mục đích khác nhau, tự động cung cấp thơng tin theo nhu cầu sở thích người Giờ đây, người ngồi nhà để mua sắm thứ theo ý muốn website bán hàng mạng giúp ta làm điều Chính vậy, cơng nghệ mã nguồn mở trở nên ý tính Giá thành rẻ hỗ trợ nhiều mạng giúp ta nhanh chóng Thiết kế website bán hàng thân thiện dễ sử dụng với người dùng Chính báo cáo tơi chọn đề tài về: “Thiết kế website Nhà Hàng New Star” Đây hệ thống đơn giản đủ mạnh phép nhanh chóng Thiết kế ứng dụng bán hàng Internet Đề tài tiểu luận gồm phần phân chương sau: Chương 1: Tổng quan đề tài Chương 2: Giới thiệu công nghệ Chương 3: Giao diện website Chương 4:Kết luận hướng phát triển SƠ ĐỒ THIẾT KẾ TRANG WEB SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web Sơ đồ tổng quát trang Trang Web Nhà Hàng New Star Trang Chủ Các sắắp mắắt Menu Các Các bán nhiềều Giới Thi ệu Khuyềắn Liền kềắt website Quảng cáo Các vềề Cua Đắng Nhập Thanh Toán Đắng Ký Đắng Ký Tài Khoản Đổi Mật Khẩu Các vềề Tơm Các vềề Mực Các vềề Bị Các vềề Ĩc Các vềề Hào Các vềề Cơm Các vềề Bánh Các vềề Chè Các vềề Lẩu Các vềề Chả SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Liền Hệ Tiểu luận môn Thiết kế Web DANH SÁCH CÁC KÝ TỰ, CHỮ VIẾT TẮT Từ viết tắt Giải thích CSDL Cơ sở liệu ĐVT Đơn vị tính CNTT Công Nghệ thông tin SP Sản phẩm SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web CHƯƠNG TỔNG QUAN VỀ ĐỀ TÀI Tên Đề Tài + THIẾT KẾ WEBSITE NHÀ HÀNG NEW STAR Mục Tiêu Đề Tài + Thiết kế Website bán đồ ăn cho nhà hàng NEW STAR Ý Nghĩa Của Đề Tài + Đưa sản phẩm nhà hàng đến đến gần với người tiêu dùng + Quảng bá thương hiệu Đối Tượng Của Đề Tài SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web + Đối tượng nghiên cứu chủ yếu sản phẩm thức ăn đồ uống Một Số Trang Chính Của Website + Trang chủ: Đây trang giới thiệu sơ lược sản phẩm nhà hàng + Trang giới thiệu: Đây trang giúp cho khách hàng xem biết thêm thông tin nhà hàng NEW STAR + Trang khuyến mãi: Đây trang giúp người dùng xem sản phẩm có khuyến từ nhà hàng + Trang liên hệ: Đây trang mà khách hàng liên hệ với nhà hàng + Trang đăng ký: Người dùng đăng ký tài khoản để trở thành khách hàng trang + Trang đăng nhập: Người dùng đăng nhập tài khoản để đặt mua sản phẩm trang + Trang sản phẩm: Đây trang khách hàng xem tham khảo mặt hàng nhà hàng có sẵn để lựa chọn + Trang thông tin sản phẩm: Đây trang khách hàng nhấn vào sản phẩm để xem chi tiết + Trang toán: giúp người dùng lựa chọn việc toán dễ dàng tiện lợi CHƯƠNG GIỚI THIỆU CÔNG NGHỆ Giới Thiệu Về HTML 1.1 HTML gì? HTML (Hypertext Markup Language-Ngơn ngữ đánh dấu siêu văn bản) ngôn ngữ đánh dấu chuẩn dùng soạn thảo tài liệu World Wide Web, rõ trang Web hiển thị trình duyệt Ngơn ngữ HTML dùng tag đoạn mã lệnh trình duyệt (Web browsers) cách hiển thị thành phần trang text graphics SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web 1.7 Giao diện trang khuyến  Mục đích: Cập nhật sớm chương trình khuyến ưu đãi hấp dẫn với người mua Hình 7: Trang khuyêến 20 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web 1.8 Giao diện trang chi tiết sản phẩm  Website có tất 10 loại ăn bao gồm về: Cua, tơm, bị, mực, hào, có, chè,…  Vì giao diện chi tiết sản phẩm có phần tương tự nên đưa trang làm ví dụ 1.8.1 Giao diện trang Các ăn Cua  Mục đích: Nơi khách hàng có xem chi tiết sản phẩm tiến hành chọn ăn có liên quan Cua mà khách hàng muốn mua tiến hành toán 21 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web Hình 8: Các ăn vêề Cua 22 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web 1.8.2 Giao diện trang Các ăn Tơm  Mục đích: Nơi khách hàng xem chi tiết sản phẩm tiến hành chọn ăn có liên quan Tôm mà khách hàng muốn mua tiến hành tốn Hình 9: Các ăn vêề Tơm 23 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web 1.8.3 Giao diện trang Các ăn Mực  Mục đích: Nơi khách hàng xem chi tiết sản phẩm tiến hành chọn ăn có liên quan mực mà khách hàng muốn mua tiến hành tốn Hình 10: Các ăn vêề Mực 24 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web 1.8.4 Giao diện trang ăn Ĩc  Mục đích: Nơi khách hàng xem chi tiết sản phẩm tiến hành chọn ăn có liên quan Tơm mà khách hàng muốn mua tiến hành tốn Hình 11: Các ăn vêề Ĩc 25 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web 1.9 Giao diện trang Chi tiết ăn - Website có nhiều loại ăn nhiều ăn ví dụ: Cua rang me, tơm hùm Alaska nướng, bị nấu cari, mực nướng, hào hấp xã, chè trôi nước,… - Vì giao diện chi tiết ăn có phần tương tự nên đưa trang làm ví dụ 1.9.1 Giao diện trang Bánh kem dâu tây - Mục đích: Cho khách hàng xem chi tiết bánh kem dâu tây như: nguyên liệu, giá, tình trạng,… 26 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web Hình 12: Trang thơng tin Bánh kem dâu tây 1.9.2 Giao diện trang Cơm Chiên Mai Cua 27 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web - Mục đích: Cho khách hàng xem chi tiết Cơm Chiên Mai Cua như: ngun liệu, giá, tình trạng,… Hình 13: Trang thơng tin C ơm Chiên Mai Cua 1.9.3 Giao diện trang Lẩu Thập Cẩm 28 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web Mục Đích: Cho khách hàng xem chi tiết Lẩu thập cẩm như: nguyên liệu, giá, tình trạng,… Hình 14: Trang thông tin L ẩu Th ập C ẩm 29 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web 1.9.4 Giao diện trang Chè Bắp - M c ụđích: Cho khách hàng xem chi tềắt vềề Chè bắắp : nguyền liệ u, giá, tnh tr ạng,… Hình 15: Trang thơng tin Chè Băếp 30 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web 1.10 Giao diện trang Thanh Tốn: - Mục đích: Giúp cho người dùng lựa chọn phương thức toán cho nhà hàng cung cấp thông tin toán - Để tới giao diện này, người dùng cần nhấp vào nút đặt mua bên sản phẩm người dùng nhấp vào nút tốn giỏ hàng Hình 16: Trang Thanh Toán 31 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN Sự phát triển bùng nổ việc mua sắm online năm gần kéo theo nhiều đổi phát triển Dịch vụ mua bán thức ăn online nhờ mà phát triển rộng rãi internet Nó giúp người dùng mua thức ăn nhà, giao tận nơi liên hệ với nhà hàng để đặt dịch vụ cách nhanh xác Với lượng tiêu thụ khổng lồ ổn định thức ăn nước uống trở thành mặt hàng kinh doanh mang lại lợi nhuận tối ưu cho người kinh doanh Đứng trước nhu cầu người mua lợi kinh doanh mặt hàng Website Nhà hàng New Star tạo nhằm mang đến cho khách hàng tiện lợi, nhanh chóng mua sắm thức ăn online với độ an tồn xác gần tuyệt đối Đồng thời mang lại nơi để thực chiến dịch quản bá sản phẩm, chương trình khuyến nhà hàng đến với khách hàng Website “Nhà Hàng NEW STAR” thứ dùng để quảng bá cho nhà hàng, thứ hai kênh thông tin cho người, thứ ba địa tin cậy để khách hàng có nhu cầu mua thức ăn đặt dịch vụ ghé thăm Qua trình nghiên cứu cố gắng thực hướng dẫn tận tình Giảng viên, giúp đỡ bạn bè khóa học đồ án nghiên cứu thể điều sau: Kết đạt được: - Thiết kế thành công website chuyên bán ăn “Nhà hàng NEW STAR”, đáp ứng yêu cầu người sử dụng - Tìm hiểu nắm công cụ để Thiết kế website như: Adobe Dreamweaver CS6, ngôn ngữ lập trình Website như: HTML, Javascript, CSS - Giao diện website thiết kế đơn giản, thân thiện dễ sử dụng Việc chưa làm được: - Việc biểu diễn thông tin website chưa linh hoạt - Phân tích thiết kế chưa hồn chỉnh - Nhiều phần web thiết kế chưa đủ, cần nhiều thời gian để rèn luyện thêm 32 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web - Nhiều chức thiếu chưa sử dụng Hướng phát triển đề tài Vì thời gian khơng cho phép kiến thức thiết kế web hạn chế nên chúng em chưa tìm hiểu rõ kỹ đề tài Vì đề tài cịn có nhiều thiếu sót, mong thầy giúp đỡ chúng em nhiều em tiếp tục tìm hiểu sâu cơng nghệ này, nhằm mục đích Thiết kế website:  Giao diện đẹp, thân thiện với người dùng, có nhiều chức tương tác tốt với người dùng  Thiết kế, bổ sung tính cịn thiếu hay chưa thật hồn chỉnh q trình sử dụng 33 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan Tiểu luận môn Thiết kế Web TÀI LIỆU KHAM KHẢO - Tài liệu giảng môn “Thiết kế website” thầy Nguyễn Hữu Vĩnh - Website WWW: http://www.hiepsiit.com - Website https://coccoc.com/search#query=Webcoban.vn 34 SVTH: Nguyễn Văn Phần – LỚP: D18PM04 0 Tieu luan ... luan Tiểu luận môn Thiết kế Web CHƯƠNG TỔNG QUAN VỀ ĐỀ TÀI Tên Đề Tài + THIẾT KẾ WEBSITE NHÀ HÀNG NEW STAR Mục Tiêu Đề Tài + Thiết kế Website bán đồ ăn cho nhà. .. luan Tiểu luận môn Thiết kế Web TÀI LIỆU KHAM KHẢO - Tài liệu giảng môn ? ?Thiết kế website? ?? thầy Nguyễn Hữu Vĩnh - Website WWW: http://www.hiepsiit.com - Website. .. bè khóa học đồ án nghiên cứu thể điều sau: Kết đạt được: - Thiết kế thành cơng website chun bán ăn ? ?Nhà hàng NEW STAR? ??, đáp ứng yêu cầu người sử dụng - Tìm hiểu nắm công cụ để Thiết kế website