Tiểu luận môn học thiết kế web thiết kế website shop linh kiện máy tính zackbutcher

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 SHOP LINH KIỆN MÁY TÍNH ZACKBUTCHER GVHD: THS NGUYỄN HỮU VĨNH SVTH: VÕ MINH TẤN MSSV: 1824801030199 LỚP: D18PM03 B8NH DƯƠNG – 06/2020 0 KHOA KỸ THUẬT – CÔNG NGHỆ NHẬN XÉT VÀ CHẤM ĐIỂM CỦA GIẢNG VIÊN Họ tên giảng viên: Nguyễn Hữu Vĩnh Tên đề tài: THIẾT KẾ WEBSITE SHOP LINH KIỆN MÁY TÍNH ZACKBUTCHER 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 0 Đồ án mơn thiết kế web 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 shop linh kiện máy tính ZackButcher” Đâ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 SVTH:Võ Minh Tấn– LỚP: D18PM03 i Đồ án mơn thiết kế web MỤC LỤC LỜI NĨI ĐẦU i DANH MỤC HÌNH .v CHƯƠNG TỔNG QUAN VỀ ĐỀ TÀI 1 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 .1 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 .2 1.3 Định dạng HTML 2 Giới thiệu Adobe Dreamweaver .2 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ủ .5 1.2 Giao diện trang giới thiệu 1.3 Giao diện trang liên hệ 1.4 Giao diện trang đăng ký 1.5 Giao diện trang đăng nhập 1.6 Giao diện trang danh mục linh kiện .9 1.6.1 Giao diện danh mục hình 10 1.6.2 Giao diện danh mục card hình 10 1.6.3 Giao diện danh mục chuột 11 1.6.4 Giao diện danh mục bàn phím 11 1.6.5 Giao diện danh mục nguồn 12 1.6.6 Giao diện danh mục CPU .12 1.6.7 Giao diện danh mục MainBoard 13 SVTH:Võ Minh Tấn– LỚP: D18PM03 ii Đồ án môn thiết kế web 1.6.8 Giao diện danh mục Ram,ổ cứng 13 1.6.9 Giao diện danh mục loa,tai nghe 14 1.6.10 Giao diện danh mục case(thùng máy) 14 1.7 Giao diện danh mục linh kiện cũ .15 1.7.1 Giao diện danh mục hình cũ 15 1.7.2 Giao diện danh mục card hình cũ BH hãng 16 1.7.3 Giao diện danh mục card hinh cũ BH tiệm 17 1.7.4 Giao diện danh mục chuột, bàn phím cũ .17 1.7.5 Giao diện danh mục Ram cũ 18 1.7.6 Giao diện danh mục MainBoard cũ 19 1.7.7 Giao diện danh mục CPU cũ 19 1.7.8 Giao diện danh mục linh kiện khác cũ 20 1.8 Giao diện trang chi tiết linh kiện .20 1.8.1 Chi tiết hình 21 1.8.2 Chi tiết card hình 21 1.8.3 Chi tiết chuột 22 1.8.4 Chi tiết bàn phím 22 1.8.5 Chi tiết nguồn .23 1.8.6 Chi tiết CPU 24 1.8.7 Chi tiết MainBoard 24 1.8.8 Chi tiêt Ram,Ổ cứng 25 1.8.9 Chi tiết loa,tai nghe .25 1.8.10 Chi tiết case(thùng máy) .26 1.8.11 Chi tiết hình cũ .26 1.8.12 Chi tiết card hình cũ BH hãng 27 1.8.13 Chi tiết card hình cũ BH tiệm .27 1.8.14 Chi tiết chuột,bàn phím cũ 28 1.8.15 Chi tiết Ram cũ .28 1.8.16 Chi tiết MainBoard cũ 29 1.8.17 Chi tiết CPU cũ 29 1.8.18 Chi tiết linh kiện khác cũ 30 SVTH:Võ Minh Tấn– LỚP: D18PM03 iii Đồ án môn thiết kế web CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 31 Kết đạt được: 31 Việc chưa làm được: 31 Hướng phát triển đề tài .31 TÀI LIỆU KHAM KHẢO 33 SVTH:Võ Minh Tấn– LỚP: D18PM03 iv Đồ án môn thiết kế web DANH MỤC H8NH Hình 1.1 Giao diện trang chủ Hình 1.2 Giao diện trang giới thiệu Hình 1.3 Giao diện trang liên hệ Hình 1.4 Giao diện trang đăng ký Hình 1.5 Giao diện trang đăng nhập Hình 1.6 Giao diện trang danh mục linh kiện Hình 1.6.1 Giao diện danh mục hình 10 Hình 1.6.2 Giao diện danh mục card hình 10 Hình 1.6.3 Giao diện danh mục chuột 11 Hình 1.6.4 Giao diện danh mục bàn phím 11 Hình 1.6.5 Giao diện danh mục nguồn 12 Hình 1.6.6 Giao diện danh mục CPU .12 Hình 1.6.7 Giao diện danh mục MainBoard 13 Hình 1.6.8 Giao diện danh mục Ram,ổ cứng 14 Hình 1.6.9 Giao diện danh mục loa,tai nghe 14 Hình 1.6.10 Giao diện danh mục case(thùng máy) 15 Hình 1.7.Giao diện danh mục linh kiện cũ .15 Hình 1.7.1 Giao diện danh mục hình cũ 16 Hình 1.7.2 Giao diện danh mục card hình cũ BH hãng 16 Hình 1.7.3 Giao diện danh mục card hình cũ BH tiệm 17 Hình 1.7.4 Giao diện danh mục chuột,bàn phím cũ 17 Hình 1.7.5 Giao diện danh mục Ram cũ 18 Hình 1.7.6 Giao diện danh mục MainBoard cũ 19 Hình 1.7.7 Giao diện danh mục CPU cũ 19 Hình 1.7.8 Giao diện danh mục linh kiện cũ khác 20 SVTH:Võ Minh Tấn– LỚP: D18PM03 v Đồ án mơn thiết kế web Hình 1.8.1 Giao diện trang chi tiết hình 21 Hình 1.8.2 Giao diện trang chi tiết card hình 21 Hình 1.8.3 Giao diện trang chi tiết chuột 22 Hình 1.8.4 Giao diện trang chi tiết bàn phím 22 Hình 1.8.5 Giao diện trang chi tiết nguồn 23 Hình 1.8.6 Giao diện trang chi tiết CPU 24 Hình 1.8.7 Giao diện trang chi tiết MainBoard 24 Hình 1.8.8 Giao diện trang chi tiết Ram,ổ cứng .25 Hình 1.8.9 Giao diện trang chi tiết loa,tai nghe 25 Hình 1.8.10 Giao diện trang chi tiết case(thùng máy) 26 Hình 1.8.11 Giao diện trang chi tiết hình cũ 26 Hình 1.8.12 Giao diện trang chi tiết card hình cũ BH hãng 27 Hình 1.8.13 Giao diện trang chi tiết card hình cũ BH tiệm .27 Hình 1.8.14 Giao diện trang chi tiết chuột,bàn phím cũ 28 Hình 1.8.15 Giao diện trang chi tiết Ram cũ 28 Hình 1.8.16 Giao diện trang chi tiết Mainboard cũ 29 Hình 1.8.17 Giao diện trang chi tiết CPU cũ 29 Hình 1.8.18 Giao diện trang chi tiết linh kiện khác cũ 30 SVTH:Võ Minh Tấn– LỚP: D18PM03 vi Đồ á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:Võ Minh Tấn– LỚP: D18PM03 vii 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 SHOP LINH KIỆN MÁY TÍNH ZACKBUTCHER Mục Tiêu Đề Tài + Thiết kế Website bán linh kiện máy tính Ý 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 sản phẩm linh kiện thiết bị máy tính 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 Shop + Trang liên hệ: Đây trang mà khách hàng liên hệ với shop + 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:Võ Minh Tấn– LỚP: D18PM03 Tiểu luận mơn thiết kế web Hình 1.7.7 Giao diện danh mục CPU cũ 1.7.8 Giao diện danh mục linh kiện khác cũ Hình 1.7.8 Giao diện danh mục linh kiện cũ khác 1.8 Giao diện trang chi tiết linh kiện  Mục đích: Chức cho phép người dùng xem Tên sản phẩm, giá, thông tin chi tiết sản phẩm SVTH:Võ Minh Tấn– LỚP: D18PM03 21 Tiểu luận môn thiết kế web  Trong giao diện cho người dùng, chọn hiển thị theo Sản Phẩm kích chọn trang chủ SVTH:Võ Minh Tấn– LỚP: D18PM03 22 Tiểu luận mơn thiết kế web 1.8.1 Chi tiết hình Hình 1.8.1 Giao diện trang chi tiết hình 1.8.2 Chi tiết card hình Hình 1.8.2 Giao diện trang chi tiết card hình SVTH:Võ Minh Tấn– LỚP: D18PM03 23 Tiểu luận môn thiết kế web 1.8.3 Chi tiết chuột Hình 1.8.3 Giao diện trang chi tiết chuột 1.8.4 Chi tiết bàn phím Hình 1.8.4 Giao diện trang chi tiết bàn phím SVTH:Võ Minh Tấn– LỚP: D18PM03 24 Tiểu luận môn thiết kế web 1.8.5 Chi tiết nguồn Hình 1.8.5 Giao diện trang chi tiết nguồn SVTH:Võ Minh Tấn– LỚP: D18PM03 25 Tiểu luận mơn thiết kế web 1.8.6 Chi tiết CPU Hình 1.8.6 Giao diện trang chi tiết CPU 1.8.7 Chi tiết MainBoard Hình 1.8.7 Giao diện trang chi tiết MainBoard SVTH:Võ Minh Tấn– LỚP: D18PM03 26 Tiểu luận môn thiết kế web 1.8.8 Chi tiết Ram,ổ cứng Hình 1.8.8 Giao diện trang chi tiết Ram, ổ cứng 1.8.9 Chi tiết loa,tai nghe Hình 1.8.9 Giao diện trang chi tiết loa,tai nghe SVTH:Võ Minh Tấn– LỚP: D18PM03 27 Tiểu luận môn thiết kế web 1.8.10 Chi tiết case(thùng máy) Hình 1.8.10 Giao diện trang chi tiết case(thùng máy) 1.8.11 Chi tiết hình cũ Hình 1.8.11 Giao diện trang chi tiết hình cũ SVTH:Võ Minh Tấn– LỚP: D18PM03 28 Tiểu luận môn thiết kế web 1.8.12 Chi tiết card hình cũ BH hãng Hình 1.8.12 Giao diện trang chi tiết card hình cũ BH hãng 1.8.13 Chi tiết card hình cũ BH tiệm Hình 1.8.13 Giao diện trang chi tiết card hình cũ BH tiệm SVTH:Võ Minh Tấn– LỚP: D18PM03 29 Tiểu luận môn thiết kế web 1.8.14 Chi tiết chuột, bàn phím cũ Hình 1.8.14 Giao diện trang chi tiết chuột,bàn phím cũ 1.8.15 Chi tiết Ram cũ Hình 1.8.15 Giao diện trang chi tiết Ram cũ SVTH:Võ Minh Tấn– LỚP: D18PM03 30 Tiểu luận môn thiết kế web 1.8.16 Chi tiết MainBoard cũ Hình 1.8.16 Giao diện trang chi tiết MainBoard cũ 1.8.17 Chi tiết CPU cũ Hình 1.8.17 Giao diện trang chi tiết CPU cũ SVTH:Võ Minh Tấn– LỚP: D18PM03 31 Tiểu luận môn thiết kế web 1.8.18 Chi tiết linh kiện khác cũ Hình 1.8.18 Giao diện trang chi tiết linh kiện khác cũ SVTH:Võ Minh Tấn– LỚP: D18PM03 32 Tiểu luận môn thiết kế web CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN Trong thời buổi cơng nghiệp hóa nay, việc buôn bán qua mạng trở nên phổ biến với hầu hết người Đây xu hướng xã hội người với cú nhấp chuột dễ dàng đặt mua sản phầm mà ưng ý cách dễ dàng thời gian đến tận nơi để mua Việc mua bán giúp tiết kiệm thời gian tiền bạc người lựa chọn sản phẩm với giá đa dạng nhu cầu cá nhân người Vì thế, sau tiến hành khảo sát em định Thiết kế trang web bán linh kiện máy tính mà cụ thể “Thiết kế website shop linh kiện máy tính ZackButcher”với chức cần thiết cho trang web bn bán cần có em thấy nhu cầu mua sắm thị trường tiềm khai thác buôn bán Website “shop linh kiện máy tinh ZackButcher” thứ dùng để quảng bá mặt hàng máy linh kiện thiết bị máy tính, thứ hai kênh thơng tin cho người, thứ ba địa tin cậy để khách hàng u thích thời trang tìm mua cho sản phẩm chất lượng 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 buôn bán linh kiện ZackButcher, đá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 chức cịn 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, SVTH:Võ Minh Tấn– LỚP: D18PM03 33 Tiểu luận môn thiết kế web 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 trình sử dụng SVTH:Võ Minh Tấn– LỚP: D18PM03 34 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 SVTH:Võ Minh Tấn– LỚP: D18PM03 35 ... D18PM03 vii 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 SHOP LINH KIỆN MÁY TÍNH ZACKBUTCHER Mục Tiêu Đề Tài + Thiết kế Website bán linh kiện máy tính Ý Nghĩa... sau tiến hành khảo sát em định Thiết kế trang web bán linh kiện máy tính mà cụ thể ? ?Thiết kế website shop linh kiện máy tính ZackButcher? ??với chức cần thiết cho trang web buôn bán cần có em thấy... 31 Tiểu luận môn thiết kế web 1.8.18 Chi tiết linh kiện khác cũ Hình 1.8.18 Giao diện trang chi tiết linh kiện khác cũ SVTH:Võ Minh Tấn– LỚP: D18PM03 32 Tiểu luận môn thiết kế web CHƯƠNG 4: KẾT