Tiể ậ u lu n môn học thiết kế website thiết k website ế bán sách cho nhà sách xyz

TRƯỜNG ĐẠI HỌC THỦ DẦU MỘT VIỆN KỸ THUẬT CÔNG NGHỆ TIỂU LUẬN MÔN HỌC THIẾT KẾ WEBSITE THIẾT KẾ WEBSITE BÁN SÁCH CHO NHÀ SÁCH XYZ GVHD: THS NGUYỄN HỮU VĨNH SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH MSSV: 2024801030228 2024801030090 LỚP: D20KTPM02 BÌNH DƯƠNG – 4/2021 Tiểu luậ n thiết kế website LỜI NÓI ĐẦU 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 bán sách cho nhà sách XYZ” Đâ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 i SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH – LỚP D20KTPM02 i Tiểu luậ n thiết kế website MỤC LỤC LỜI NÓI ĐẦU i DANH MỤC HÌNH iii 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 Một Số Trang Chính Của Website 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 2 Giới thiệu Adobe Dreamweaver Ngôn ngữ CSS Ngôn ngữ Javascript CHƯƠNG 3: GIAO DIỆN CHƯƠNG TRÌNH Đặc Tả Giao Diện 1.1 Giao diện trang chủ 1.2 Giao diện trang đăng ký 1.3 Giao diện trang đăng nhập 1.4 Giao diện trang danh mục sách (Thể loại sách) 1.4.1 Giao diện danh mục Sách Kinh Tế - Kỹ Năng 1.4.2 Giao diện danh mục Sách Nghệ Thuật – Tâm Lý 10 1.4.3 Giao diện danh mục Sách Văn Học Việt Nam 11 1.4.4 Giao diện danh mục Sách Văn Học Nước Ngoài 12 1.4.5 Giao diện danh mục Sách Thiếu Nhi 13 1.4.6 Giao diện danh mục Sách Giáo Dục Gia Đình 14 1.4.7 Giao diện danh mục Sách Lịch Sử 15 1.4.8 Giao diện danh mục Sách Văn Hóa Nghệ Thuật 16 1.4.9 Giao diện danh mục Sách Khoa Học – Triết Học 17 1.4.10 Giao diện danh mục Sách Y Học – Thực Dưỡng 18 ii SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH – LỚP D20KTPM02 ii Tiểu luậ n thiết kế website 1.5 Giao diện Sách Kinh Tế - Kỹ Năng Error! Bookmark not defined 1.6 Giao diện trang chi tiết sản phẩm Error! Bookmark not defined 1.6.1 Giao diện sách Ma Bùn Lưu manh câu chuyện khác Nguyễn Trí 19 1.7 Phần giới thiệu sách Error! Bookmark not defined 1.8 Phần đánh giá độc giả Error! Bookmark not defined 1.9 Giao diện giỏ hàng Error! Bookmark not defined 1.9.1 Giao diện khách hàng/đăng nhập Error! Bookmark not defined 1.9.2 Giao diện địa giao hàng 20 1.9.3 Giao diện toán, đặt mua 20 Giao diện tài khoản Error! Bookmark not defined 2.1 Giao diện danh sách đơn hàng Error! Bookmark not defined Sơ đồ giao diện website…………………………… ………….………………….27 CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 27 Kết đạt được: 28 Việc chưa làm được: 28 Hướng phát triển đề tài .28 TÀI LIỆU KHAM KHẢO 30 DANH MỤC HÌNH Hình 1.1 Giao diện trang chủ Hình 1.2 Giao diện trang đăng ký .6 Hình 1.3 Giao diện trang đăng nhập .7 Hình 1.4 Giao diện trang danh mục sản phẩm Hình 1.4.1 Giao diện danh mục Sách Kinh Tế-Kỹ Năng Hình 1.4.3 Giao diện danh mục Sách Văn Học Việt Nam .11 Hình 1.4.4 Giao diện danh mục Sách Văn Học Nước Ngoài 12 Hình 1.4.5 Giao diện danh mục Sách Thiếu Nhi 13 iii SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH – LỚP D20KTPM02 iii Tiểu luậ n thiết kế website Hình 1.4.6 Giao diện danh mục Sách Giáo Dục- Gia Đình 14 Hình 1.4.7 Giao diện danh mục Sách Lịch Sử .15 Hình 1.4.9 Giao diện danh mục Sách Khoa Học – Triết Học 17 Hình 1.4.10 Giao diện danh mục Sách Y Học - Thực Dưỡng 18 Hình 1.6.1 Giao diện Sách Ma Bùn Lưu manh câu chuyện khác Nguyễn Trí 21 Hình 1.7 Giao diện trang giới thiệu sách 22 Hình 1.8 Giao diện trang đánh giá độc giả 23 Hình 1.9 Giao diện giỏ hàng 24 Hình 1.9.1Giao diện khách hàng 24 Hình 1.9.2 Giao diện địa giao hàng .25 Hình 1.9.3 Giao diện tốn, đặt mua 25 Hình 2.0 Giao diện thông tin tài khoản 26 Hình 2.1 Giao diện danh sách đơn hàng 26 iv SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH – LỚP D20KTPM02 iv Tiểu luậ n thiết kế website 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 v SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH – LỚP D20KTPM02 v Tiểu luận thiết kế website CHƯƠNG TỔNG QUAN VỀ ĐỀ TÀI Tên Đề Tài + THIẾT KẾ WEBSITE BÁN SÁCH CHO NHÀ SÁCH XYZ Mục Tiêu Đề Tài + Thiết kế Website bán sách cho nhà sách xyz Ý Nghĩa Của Đề Tài + Đưa sản phẩm công ty đế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 + Đối tượng nghiên cứu chủ yếu loại sách với nhiều thể loại Một Số Trang Chính Của Website + Trang chủ: Đây trang giới thiệu sơ lược sản phẩm cửa 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à sách + Trang liên hệ: Đây trang mà khách hàng liên hệ với Nhà sách + 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 cửa hàng có sẵn để lựa chọn + Trang chi tiết sản phẩm: Đây trang khách hàng nhấn vào sản phẩm để xem chi tiết SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH – LỚP D20KTPM02 Tiểu luận thiết kế website CHƯƠNG GIỚI THIỆU CÔNG NGHỆ 1 Giới Thiệu Về HTML 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 HTML ngôn ngữ xác định cấu trúc thông tin HTML sử dụng loạt thẻ thuộc tính dùng để thị văn thông tin khác, cung cấp siêu liên kết tới tài liệu khác 1.2 Công dụng HTML Thiết kế nội dung hình thức trang web Xuất tài liệu trực tuyến hay truy xuất thông tin trực tuyến cách dùng liên kết chèn vào trang web Tạo biểu mẫu trực tuyến nhằm thu thập thông tin người dùng, quản lý giao dịch… Thêm vào đối tượng hình ảnh video, âm thanh… 1.3 Định dạng HTML Là tập tin có phần mở rộng htm html Là tập tin văn túy, có chứa mã đặc biệt gọi Tag(thẻ), thường đặt xung quanh khối văn Có thể viết nhiều trình soạn thảo: Microsoft Fontpage, notepad…và sử dụng nhiều adobe dreamweaver Giới thiệu Adobe Dreamweaver Macromedia Dreamweaver trình biên soạn HTML chuyên nghiệp dùng để thiết kế, viết mã phát triển website trang web ứng dụng web Cho dù bạn có thích thú với cơng việc viết mã HTML thủ cơng bạn thích làm việc mơi trường biên soạn trực quan, Dreamweaver cung cấp cho bạn cơng cụ hữu ích để nâng cao kinh nghiệm thiết kế web bạn SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH – LỚP D20KTPM02 Tiểu luận thiết kế website Các tính biên soạn trực quan Dreamweaver cho phép bạn tạo nhanh trang web mà khơng cần dịng mã Bạn xem tất thành phần website bạn kéo chúng trực tiếp từ panel dễ sử dụng vào văn Bạn nâng cao sản phẩm bạn cách tạo sửa ảnh Macromedia Fireworks ứng dụng ảnh khác, sau chèn trực tiếp vào Dreamweaver Dreamweaver cung cấp cơng cụ giúp đơn giản hóa việc chèn Flash vào trang web Dreamweaver cho phép bạn Thiết kế ứng dụng web động dựa theo liệu sử dụng công nghệ máy chủ CFML, ASP.NET, ASP, JSP, PHP Nếu sở thích bạn làm việc với liệu XML, Dreamweaver cung cấp công cụ cho phép bạn dễ dàng tạo trang XSLT, chèn file XML hiển thị liệu XML trang web bạn Dreamweaver tùy biến hồn tồn Bạn tạo cho riêng đối tượng yêu cầu, chỉnh sửa shortcut bàn phím chí viết mã JavaScript để mở rộng khả Dreamweaver với hành vi mới, chuyên gia giám định Property báo cáo site Ngôn ngữ CSS CSS (Cascading Style Sheets) ngơn ngữ quy định cách trình bày cho tài liệu viết HTML, XHTML, XML, SVG, hay UML,… CSS cung cấp nhiều thuộc tính trình bày dành cho đối tượng với sáng tạo việc kết hợp thuộc tính giúp mang lại hiệu cao CSS hỗ trợ tất trình duyệt hiển thị “như nhau” hệ điều hành CSS đưa phương thức áp dụng từ file CSS ngồi Có hiệu đồng tạo website có hàng trăm trang hay muốn thay đổi thuộc tính trình bày CSS cập nhật liên tục mang lại trình bày phức tạp tinh vi Ngôn ngữ Javascript Với HTML biểu diễn thông tin chưa phải trang Web động có khả đáp ứng kiện từ phía người dùng SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH – LỚP D20KTPM02 Tiểu luận thiết kế website Hãng Netscape đưa ngơn ngữ script có tên LiveScript để thực chức Sau đổi tên thành JavaScript để tận dụng tính đại chúng ngơn ngữ lập trình Java JavaScript ngơn ngữ dạng script gắn với file HTML Được trình duyệt diễn dịch, trình duyệt đọc JavaScript dạng mã nguồn JavaScript ngôn ngữ dựa đối tượng, nghĩa bao gồm nhiều kiểu đối tượng, ví dụ đối tượng Math với tất chức toán học Nhưng JavaScript không ngôn ngữ hướng đối tượng C++/Java SVTH: LÊ NGUYỄN ĐÌNH NAM NGUYỄN TRỌNG TUẤN ANH – LỚP D20KTPM02 ... bi? ?n so? ?n trực quan, Dreamweaver cung cấp cho b? ?n cơng cụ h? ?u ích để n? ?ng cao kinh nghiệm thiết k? ?? web b? ?n SVTH: LÊ NGUY? ?N ĐÌNH NAM NGUY? ?N TRỌNG TU? ?N ANH – LỚP D20KTPM02 Ti? ?u lu? ? ?n thiết k? ?? website. .. THIẾT K? ?? WEBSITE B? ?N SÁCH CHO NHÀ SÁCH XYZ Mục Ti? ?u Đề Tài + Thiết k? ?? Website b? ?n sách cho nhà sách xyz Ý Nghĩa Của Đề Tài + Đưa s? ?n phẩm công ty đ? ?n đ? ?n g? ?n với người ti? ?u dùng + Quảng bá thương... mục Sách Kinh Tế -K? ?? N? ?ng SVTH: LÊ NGUY? ?N ĐÌNH NAM NGUY? ?N TRỌNG TU? ?N ANH – LỚP D20KTPM02 Ti? ?u lu? ? ?n thiết k? ?? website 1.4.2 Giao di? ?n danh mục Sách Nghệ Thuật Sống – Tâm Lý Hình 1.4.2 Giao di? ?n danh