Đồ án cơ sở 1 Đề tài xây dựng trang website bán hàng dành cho người khiếm thị

Trong đó những hoàn cảnh như những người bị khiếm thị cũng đã được xã hội quan tâm, giúp đỡ một cách nhiệt tình, nhanh chóng hơn, cuộc sống của những người khiếm thị cũng dần được cải th

TRƯỜNG DAI HOC CONG NGHE THONG TIN

VA TRUYEN THONG VIET HAN

KHOA KHOA HOC MAY TINH

[II

VK

ĐỎ ÁN CƠ SỞ I

DE TAI:

XAY DUNG TRANG WEBSITE BAN HANG

DANH CHO NGUOI KHIEM THI

Giảng viên hướng dẫn : Th.S Trịnh Thị Ngoc Linh

Nguyễn Thị Khánh Nhi — 221T.B154

Đà Nẵng, tháng 05 năm 2023 LỜI CẢM ƠN

Chúng em sẽ không thể thực hiện và hoàn thành đồ án này nếu không có sự hướng dẫn và chỉ bảo tận tình của Th.S Trịnh Thi Ngoc Linh Em xin cảm ơn sự chỉ bảo và hướng dẫn tận tình của cô đề chúng em hoàn thành tốt đỗ án

Em xin trân trọng cảm ơn quý thầy c6 trong Khoa Khoa hoc may tinh Truong Dai học Công nghệ thông tin và Truyền thông Việt - Hàn Đại học Đà Nẵng đã tận tình giảng dạy, truyền đạt những kiến thức và tạo điều kiện đề chúng em hoàn thành đồ án này Xin chân thành cảm ơn sự giúp đỡ đến từ các anh chị đi trước cũng như các bạn trong quá trình thực hiện dé an

Tuy đã cố gắng, nỗ lực hết mình để hoàn thành tốt Song, đỗ án chắc sẽ có những thiếu sót Chúng em rất mong sự thông cảm của thầy cô vả các bạn

Em xin tran trọng cảm ơn

Sinh viên Trần Gia Hân Nguyễn Thị Khánh Nhi

NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DÂN

Giảng viên hướng dẫn

Th.S Trinh Thi Ngoc Linh

MỤC LỤC

LỜI CẢM ƠN Sàn 212212112121 1 11112121212 ce ngu re, NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẦN 22 ccccrrrrrea MỤC LỤC à- S1 T1 1211121122121 121 12112121211 ra DANH MỤC CÁC TỪ VIẾT TẮTT 2s 2121121121121 211111 re DANH MỤC HÌNH VẼ c1 E1 E1 1211112121210 121 12a

1.1.2 Ưu, nhược điểm -Á 5 2222155215 151151152151512111211115Ex se 1.2 Các ngôn npữ sử dỤng 2 2c 2 121122 121111 1 kg

1.3 Kết chương Ì 2 HH HH run

2.1 — Mô tả trang webSIf€ -L n1 n1 11212 11121182 HH xe, 2.2 Mô tả hệ thống S1 S1 T1 E1121112211 111212121 ng re 2.3 Kết chương 2 S20 TH HH H211 reu

CHƯƠNG 3 THIẾT KẾ TRANG WEB 5 22222 re

3.1 _ Thiết kế trang website S St HH H2 3.1.1 Trang chủ -.c c1 12211211121 1111 11211 1g ray

3.1.3 Sản phẩm: c SE HH 01221 erg 3.1.4 Câu chuyỆH: - 2.1 2.11121121111111 3.1.5 - Liên hỆ 0000000001100 1 100111111111 ccy E5“ e.- 3.2 Kếtchương 3 S20 HH Hee

TAI LIEU THAM KHAO coccceccesscssesssessesesescessesesteseseststssesestssesestecseseees

DANH MUC CAC TU VIET TAT

VIET TAT NOI DUNG

HTML Hypertext Markup Language

CSS Cascading Style Sheet

W3C World Wide Web Consortium

JS JavaScript

DANH MỤC HÌNH VẾ

000i án 13

Hình 3.2 Giới thiệu 52-22 221 21 2711211221121111112212112111211212212212 112202 rg 14 Hình 3.3 Sản phẩm - 5-51 91 12112121111121121121121211 112121111 1102111121 ya 14

Hình 3.6 Câu chuyện - - 2 2211 101111211112111121112 1112 1110111111 1119011111 xá 15 Hình 3.7 Liên hệ 2-22 +212222111122212711211211111211211112201 01121212211 ru 15

MỞ ĐẦU

1 Giới thiệu

Thế ký XXI, xã hội dé cao tam quan trong va sự kết nối của Khoa hoc, Kỳ thuật, Công nghệ Xã hội ngày cảng hiện đại, tiên tiến, thông qua việc sử dụng Internet ngày cảng phô biến, mọi thứ đều diễn ra nhanh chóng và tiện lợi hơn nhờ Internet Có rất nhiều vấn đề lợi ích mà Internet mang lại cho chúng ta, không thê không kế đến nhờ

có Internet mà việc giúp đỡ những người không may mắn trong cuộc sông ngày càng được nhanh chóng và thiết thực hơn

Hiện nay, thông qua mạng Internet, mọi người có thể truyền nhau về những hoàn cảnh không may mắn trong cuộc sống cần được xã hội quan tâm và giúp đỡ Trong đó những hoàn cảnh như những người bị khiếm thị cũng đã được xã hội quan tâm, giúp

đỡ một cách nhiệt tình, nhanh chóng hơn, cuộc sống của những người khiếm thị cũng dần được cải thiện hơn nhờ các sản phâm hỗ trợ mang lat Tuy nhiên, nhiều người đã

sử dụng việc vì lợi ích của neười khiếm thị đã lợi dụng lòng tin của các mạnh thường, quân đề lừa đảo khiến việc hỗ trợ và mua các sản phâm hỗ trợ không phải lúc nao cũng diễn ra thuận lợi và nhanh chóng

Nhận thức được tỉnh hình đó, muốn giúp cho những người khiếm thị giảm bớt những khó khăn trong việc sinh hoạt như: đọc sách, đi lại, nhìn thay, muốn giup cho những người khiếm thị tiếp cận đến những sản phâm hỗ trợ như: sây, kính, sách chữ nỗi, một cách nhanh chóng, đồng thời hạn chế được những việc không mong muốn

khi có các đợt hỗ trợ

Do đó chúng em chọn thực hiện đề tài “Xây dựng trang Website dành cho người khiếm thị”

2 Mục tiêu của đề tài

Mục tiêu của đề tài nhằm nhằm đáp ứng được nhu cầu đặt mua các sản phẩm hỗ trợ cho cuộc sống của những người khiếm thị, chúng em đã hướng đến dự án cập nhập các sản phẩm được kiêm soát nghiêm ngặt, tiêu chuẩn trong mọi quá trình, hướng đến những câu chuyện để những người khiếm thị lạc quan, tự tin hơn trone cuộc sống, hướng đến những mạnh thường quân có nhu cầu giúp đỡ, chia sẻ khó khăn nhưng chưa biết làm cách nào để thực hiện nó Với hệ thống Website này, mọi người có thé tiép cận, mua các sản phâm co chat lượng cao, uy tín được đặt lên hàng đâu về các sản

phâm, chắc chắn sẽ đem lại sự tin tưởng tuyệt đối từ các mạnh thường quân cũng như các tô chức thiện nguyên

3 Nội dung và kế hoạch thực hiện

Thành viên thực

hiện

„ Đề xuất ý tưởng đề tài, xác định mục Đó Ộ m

tiêu thực hiện đê tài

Từ 24/3 đến 25/3 | Hoàn thành đề cương đô án Tất cả các thành viên

Tìm hiểu, khảo sát về những vẫn đề |,

mà người khiêm thị mắc phải

Từ 1⁄4 đên 8/4 Tìm hiệu về những sản phâm hỗ trợ Tât cả các thành viên

Từ 9⁄4 đến 23/4 Tổng quan và phân tích trang website | Tất cả các thành viên

Tir 24/4 dén 24/5 | Thiết kế trang website Tat ca cac thanh vién

Từ 25/5 đên 26/5 | Hoàn thành báo cáo đồ án Nhị

1

Từ 26/5 đên 27/5 | Hoàn thanh slide do an Tran Gia Han

4 Bồ cục báo cáo

Sau phan Mo dau, bao cao duoc trinh bảy trong ba chương, cụ thê như sau: Chuong 1 Tong quan vé trang website: Trong chương này, báo cáo trình bày các khái niệm, đặc điểm, các giải pháp liên quan đến trang website

Chương 2 Phân tích trang websife: Nội dung chương bao gồm các mô tả của trang website

Chuong 3 Thiét ké trang website: Xây dựng trang website bằng các công cụ hỗ

Cuối củng là Kết luận, Tài liệu tham khảo và Phụ lục liên quan đến dé tai

CHUONG 1 TONG QUAN VE TRANG WEBSITE

1.1 Các phương pháp

- Nhận thấy, tìm hiểu và tiếp thu các ý kiến từ các bạn và giáo viên hướng dẫn, vận dụng các kiến thức đã học Nhóm chúng em áp dụng những phương pháp sau đây vào đề tài của mình

1.1.1 Trình bày phương pháp triển khai thực hiện đề tài

- Xây dựng website dựa trên kiến thức đã học là ngôn ngữ HTML, CSS và JS

- Tham khảo, tiếp thu ý kiến từ giảng viên hướng dẫn

- La trang website đầu tiên bán các sản phẩm hỗ trợ người khiếm thi

1.1.2 Ưu, nhược điểm

1.1.2.1 Uu điểm

- Giao diện với 3 phông mảu chủ yếu: Xám, Đen, Trắng Là những mảu dễ nhìn

thấy dành cho người khiếm thị

- Hình ảnh thực tế, trực quan

- Phông chữ to, rõ, dễ nhìn

1.1.2.2 Nhược điểm

- Là website tĩnh nên chưa giải quyết được vấn đề về cơ sở đữ liệu cũng như các chức năng

1.2, Các ngôn ngữ sử dụng

- Áp dụng ngôn ngữ đã học là HTML, CSS và JS, không ngừng tìm hiểu thêm những kiến thức chưa biết đề vận dụng, thực hiện, hoàn thành được đề tài đã chọn 1.2.1 HTML

HTML (viết tắt của từ HyperText Markup Laneuage, hay là "Ngôn ngữ Đánh dấu Siêu văn bản") là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các trang web trên World Wide Web Nó có thê được trợ giúp bởi các công nghệ như C§S và các ngôn ngữ kịch bản giống như JavaScript

Các trình duyệt web nhận tài liệu HTML từ một web server hoặc một kho lưu trữ cục bộ và render tải liệu đó thành các trang web đa phương tiện HTML mô tả cầu trúc của một tran web về mặt ngữ nphĩa và các dấu hiệu ban đầu được bao gồm cho

sự xuất hiện của tài liệu

Các phần tử HTML là các khối xây đựng của các trang HTML Với cấu trúc HTML, hình ảnh và các đối tượng khác như biêu mẫu tương tác có thê được nhúng

vao trang duoc hién thi HTML cung cấp một phương tiện dé tao tai liệu có cấu trúc bang cách biểu thị ngữ nghĩa cấu trúc cho văn bản như headings, paragraphs, lists, links, quotes và các mục khác Các phần tử HTML được phân định bằng các 7zgs, được viết bằng dấu ngoặc nhọn Các trình duyệt không hiển thị các thẻ HTML, nhưng

sử dụng chúng đề diễn giải nội dung của trang

HTML có thể nhúng các chương trình được viết bằng scripting như JavaScript, điều này ảnh hưởng đến hành vi và nội dung của các trane web Việc bao gồm C§S xác định giao diện và bố cục của nội dung World Wide Web Consortium (W3C), trudc đây là đơn vị bảo trì HTML và là người duy trì hiện tại của các tiêu chuẩn CSS, đã khuyến khích việc sử đụng CSS trên HTML trình bảy rõ ràng kê từ năm 1997 1.2.2 CSS

CSS là viết tắt của Cascading Style Sheets, một ngôn ngữ thiết kế đơn giản, xử

lý một phần giao diện của trang web CSS mô tả cách các phần tử HTML hiển thị trên man hinh và các phương tiện khác

Sử dụng CSS, ban có thế kiểm soát màu chữ, cỡ chữ, kiểu chữ, khoảng cách piữa các đoạn văn bản, kích thước của các thành phần trén trang web, mau nén, thiét

kế bố cục và cách trang web hiến thị trên những màn hình có kích thước khác nhau cũng như hàng loạt hiệu ứng khác

CSS rất hữu ích và tiện lợi Nó có thể kiểm soát tất cả các trang trên một website Cac stylesheet ngoài được lưu trữ dưới dạng các tập tin CSS CSS được kết hợp với ngôn ngữ đánh dấu HTML hoặc XHTML

1.2.3 JS

JS là viết tắt của JavaScript, là một ngôn ngữ lập trình của HTML và WEB Nó là nhẹ và được sử dụng phỏ biến nhất như là một phần của các trang web, mà sự thi hành cua chung cho phép Client-Side script tương tác với npười sử dụng và tạo các trang web động Nó là một ngôn ngữ chương trình thông dịch với các khả năng hướng đối tượng

JavaScript được biết đến đầu tiên với tên Mocha, và sau đó là LiveScript, nhưng công ty Netscape đã đổi tên của nó thành JavaScript, bởi vì sự phô biến như là một hiện tượng của Java lúc bấy giờ JavaScript xuất hiện lần đầu trong Netscape 2.0 năm

1995 với tên LiveScript Core đa năng của ngôn ngữ này đã được nhúng vào Netscape,

IE, va các trình duyệt khác

1.3 Kết chương I

Thông qua tìm hiểu về các phương pháp và các ngôn ngữ cần thiết từ đó, làm cơ

sở đề xuất Phân tích trang website sẽ được trình bày trong chương tiếp theo

CHƯƠNG 2 PHAN TICH TRANG WEBSITE

2.1 M6 ta trang website

Khác với nhiều trang website cùng chủ đề khác, trang website của chúng em hướng tới có thê cho những npười khiếm thị ở mức độ nhẹ và trung bình có thê sử dụng được mà không cần những người trợ giúp nhờ 3 phông màu dễ thấy dành cho người khiếm thị là: đen, xám, trắng

2.2 Mô tả hệ thống

Thiết kế trang website cung cấp những sản phâm, câu chuyện, về những người khiếm thị cũng như giúp cho những mạnh thường quân có thể giúp đỡ những người khiếm thị một cách nhanh chóng hơn Website có những thông tin như sau:

- Khi truy cập vảo trang website có thê xem phần giới thiệu, sản phẩm, câu chuyện,

- Phần Trang chủ thể hiện được rõ mục tiêu, hướng đi của website tới người sử dụng

- Phần Giới thiệu thể hiện rõ mục tiêu mà trang website muốn hướng tới

- Phần Sản phâm gồm những sản phâm mà trang website cung cấp cho người khiếm thị

- Phần Câu chuyện gồm tông hợp những câu chuyện có thật về nghị lực sống, tạo thêm động lực cho những người khiếm thị

- Phần Liên hệ gồm mục nhắn tin, hiện rõ số điện thoại, email đề tiện liên hệ và giải đáp thắc mắc, tư vấn cho khách hàng

- Ngoài ra, còn có các phần khác như: Tìm kiếm, Giỏ hàng, Đăng Nhập, 2.3 Kết chương 2

Quy trình Phân tích trang website sẽ ảnh hưởng trực tiếp và làm bàn đạp để hoàn thành Thiết kế trang website ở chương 3.

CHUONG 3 THIET KE TRANG WEB

3.1 Thiết kế trang website

- Trong quá trình thực hiện và lên ý tưởng, chúng em không ngừng tiếp thu, học hỏi, tham khảo ý kiến từ thầy cô và các bạn Nhóm chúng em đã hoàn thành trang website với những mục sau:

3.1.1 Trang chủ:

Thể hiện được nội dung mà trang website muốn truyền tải, sản pham noi trội của website cũng như là xác định rõ hướng đi chủ yếu của trang mang lại cho người truy

^

cập

sual AAR ohin Rue MME RUC Nhu

ặt ỡi và cảnh vật tươi đẹp xung quanh, nhì

Hinh 3.1 Trang chủ

3.1.2 Giới thiệu:

Nêu rõ mục tiêu, sự đồng cảm mà trang website đem lại cho người sử dụng Có lời cam kết chất lượng sản pham và dịch vụ để tạo sự an tâm, tin tưởng cho khách hàng đặt mua

NOI LAN TOA YEU THUONG

Tại đây chúng tôi luôn mang đến những câu chuyện về người khiếm thị và những cuốn sách đầy ý nghĩa 100% phí

sẽ góp phần giúp đỡ họ Chúng tôi hiểu được và đồng cảm với những gì mà người khiếm thị đang gặp phải Sản

tôi giúp đỡ người khiếm thị,

Hình 3.2 Giới thiệu 3.1.3 Sản phẩm:

Thể hiện những sản phẩm nôi bật và mới nhất đảm bảo uy tín, chất lượng sẽ được đưa đến những người sử dụng cần thiết

SAN PHAM

KINH

Kinh khang tia UV Kinh kháng tia UV 400 COOLSIR Mất kính Way 001

450.0004 660.000“ 380.004 400.0008 450.0004 509.000

Hinh 3.3 San pham