Luận văn thiết kế website bán hàng quần áo bằng HTML - ĐH KD&CN Hà Nội

Nghiên cứu chi tiết về địa chỉ PM23 18 Nguyễn Việt Phương, 18117088 LVTN. Thông tin về dự án, vị trí, tiềm năng đầu tư và đánh giá chi tiết.

• Tác giả: Nguyễn Việt Phương
• Người hướng dẫn: TS. Phạm Kim Thư
• Trường học: Trường Đại học Kinh doanh và Công nghệ Hà Nội
• Chuyên ngành: Công nghệ thông tin
• Đề tài: Thiết kế website bán hàng quần áo bằng HTML
• Loại tài liệu: Luận văn tốt nghiệp
• Năm xuất bản: 2022
• Địa điểm: Hà Nội

Tóm tắt

I. Tổng quan về PM23

PM23.18 Nguyễn Việt Phương 18117088 LVTN là luận văn tốt nghiệp chuyên ngành Công nghệ Thông tin tại Trường Đại học Kinh doanh và Công nghệ Hà Nội. Đề tài tập trung vào thiết kế website bán hàng quần áo bằng HTML, giải quyết nhu cầu chuyển đổi số cho các cửa hàng thời trang. Luận văn bao gồm 4 chương chính: cơ sở lý luận, thực trạng website bán hàng tại Việt Nam, giải pháp xây dựng website, và kết luận. Nội dung đề cập đến ngôn ngữ lập trình HTML, cơ sở dữ liệu, yêu cầu hệ thống, và kết quả đạt được. Đây là minh chứng cho khả năng ứng dụng công nghệ vào kinh doanh thời trang.

1.1. Mục tiêu và phạm vi nghiên cứu

Mục tiêu chính của luận văn là xây dựng website bán quần áo bằng HTML nhằm tối ưu hóa quy trình bán hàng và nâng cao trải nghiệm khách hàng. Phạm vi nghiên cứu bao gồm phân tích nhu cầu thị trường, thiết kế giao diện, lập trình chức năng quản lý sản phẩm, giỏ hàng, thanh toán, và cơ sở dữ liệu. Luận văn không đề cập đến các ngôn ngữ lập trình khác như PHP hay JavaScript, mà tập trung hoàn toàn vào HTML tĩnh. Ngoài ra, nghiên cứu cũng khảo sát thực trạng website bán hàng tại Việt Nam để đưa ra giải pháp phù hợp.

1.2. Ý nghĩa thực tiễn của đề tài

Đề tài có ý nghĩa quan trọng trong việc thúc đẩy thương mại điện tử tại Việt Nam, đặc biệt trong lĩnh vực thời trang. Website bán hàng bằng HTML giúp doanh nghiệp giảm chi phí vận hành, tiếp cận khách hàng rộng rãi, và nâng cao uy tín thương hiệu. Ngoài ra, luận văn còn đóng góp kiến thức thực tế cho sinh viên ngành CNTT, hỗ trợ họ nắm vững quy trình thiết kế website từ lý thuyết đến triển khai. Đây là nền tảng quan trọng cho những ai muốn theo đuổi lĩnh vực lập trình web.

II. Phân tích thực trạng website bán hàng quần áo tại Việt Nam

Website bán hàng quần áo tại Việt Nam hiện nay tồn tại nhiều hạn chế như giao diện kém chuyên nghiệp, chức năng hạn chế, và thiếu tính tương tác. Nhiều cửa hàng vẫn sử dụng các nền tảng thương mại điện tử phổ biến như Shopee hay Lazada thay vì xây dựng website riêng. Điều này dẫn đến sự phụ thuộc vào bên thứ ba, tăng chi phí hoa hồng, và giảm khả năng kiểm soát thương hiệu. Bên cạnh đó, tốc độ tải trang chậm, thiếu tính năng tìm kiếm thông minh, và giao diện không thân thiện với người dùng cũng là vấn đề phổ biến. Những hạn chế này ảnh hưởng trực tiếp đến trải nghiệm khách hàng và doanh thu của doanh nghiệp.

2.1. Hiện trạng website bán hàng quần áo

Hiện nay, đa số các cửa hàng quần áo tại Việt Nam sử dụng website tĩnh bằng HTML hoặc các nền tảng như WordPress với plugin WooCommerce. Những website này thường thiếu tính năng động, không hỗ trợ quản lý đơn hàng tự động, và khó tích hợp với các phương thức thanh toán trực tuyến. Ngoài ra, giao diện thường đơn điệu, không phản ánh đúng phong cách thương hiệu. Nhiều doanh nghiệp nhỏ lẻ vẫn sử dụng Facebook hoặc Zalo để bán hàng, thay vì đầu tư xây dựng website chuyên nghiệp.

2.2. Nhận xét và giải pháp khắc phục

Việc thiếu chuyên nghiệp trong thiết kế website dẫn đến mất khách hàng tiềm năng do trải nghiệm kém. Giải pháp là xây dựng website bằng HTML động, tích hợp cơ sở dữ liệu SQL, và sử dụng CSS/JS để nâng cao tính tương tác. Ngoài ra, cần tối ưu hóa tốc độ tải trang, cải thiện giao diện, và bổ sung tính năng quản lý đơn hàng. Doanh nghiệp cũng nên đào tạo nhân viên về quản trị website để tận dụng tối đa công cụ này.

III. Giải pháp thiết kế website bán quần áo bằng HTML

Giải pháp thiết kế website bán quần áo bằng HTML tập trung vào ba yếu tố chính: giao diện thân thiện, chức năng đầy đủ, và tối ưu hóa SEO. Website cần bao gồm trang chủ, danh mục sản phẩm, chi tiết sản phẩm, giỏ hàng, thanh toán, và trang quản trị. Sử dụng HTML5, CSS3, và JavaScript để tạo giao diện trực quan, hỗ trợ responsive cho mọi thiết bị. Cơ sở dữ liệu SQL quản lý sản phẩm, đơn hàng, và khách hàng. Ngoài ra, tích hợp các phương thức thanh toán trực tuyến như Momo, VNPay, và chuyển khoản ngân hàng. Website cũng cần có chức năng tìm kiếm sản phẩm, lọc theo danh mục, và hiển thị sản phẩm liên quan.

3.1. Yêu cầu hệ thống và công cụ thiết kế

Hệ thống yêu cầu máy chủ lưu trữ website hỗ trợ PHP và cơ sở dữ liệu MySQL. Công cụ thiết kế bao gồm trình soạn thảo mã Visual Studio Code, trình quản lý phiên bản Git, và phần mềm quản lý cơ sở dữ liệu phpMyAdmin. Ngoài ra, cần sử dụng thư viện Bootstrap để tạo giao diện responsive. Quá trình thiết kế tuân thủ quy trình phát triển phần mềm: phân tích yêu cầu, thiết kế giao diện, lập trình, kiểm thử, và triển khai. Mỗi giai đoạn đều có tài liệu hướng dẫn cụ thể.

3.2. Kết quả đạt được sau triển khai

Sau khi triển khai, website bán quần áo bằng HTML đã đạt được những kết quả tích cực như giao diện chuyên nghiệp, tốc độ tải trang nhanh, và chức năng quản lý đơn hàng tự động. Website hỗ trợ khách hàng tra cứu sản phẩm, thêm vào giỏ hàng, và thanh toán trực tuyến. Phía quản trị có thể cập nhật sản phẩm, theo dõi doanh thu, và thống kê khách hàng. Kết quả khảo sát cho thấy 90% khách hàng hài lòng với trải nghiệm mua sắm, và doanh thu tăng 30% sau 3 tháng triển khai.

IV. Kết luận và ứng dụng thực tiễn từ luận văn PM23

Luận văn PM23.18 Nguyễn Việt Phương 18117088 LVTN đã chứng minh tầm quan trọng của website bán hàng bằng HTML trong lĩnh vực thời trang. Kết quả nghiên cứu cho thấy website không chỉ giúp doanh nghiệp tiết kiệm chi phí mà còn nâng cao hiệu quả kinh doanh. Các giải pháp đề xuất như tối ưu hóa giao diện, tích hợp chức năng quản lý, và tối ưu hóa SEO đều mang lại giá trị thực tiễn. Luận văn cũng góp phần đào tạo nguồn nhân lực CNTT chất lượng cao, sẵn sàng cho thị trường lao động. Đây là minh chứng cho sự kết hợp giữa lý thuyết và thực tiễn trong đào tạo đại học.

4.1. Đánh giá hiệu quả của luận văn

Luận văn đã hoàn thành đầy đủ mục tiêu đề ra, từ phân tích hiện trạng đến đề xuất giải pháp thiết kế website. Quá trình triển khai cho thấy HTML là ngôn ngữ phù hợp cho website bán hàng tĩnh, trong khi các ngôn ngữ động như PHP cần thiết cho chức năng quản lý. Kết quả khảo sát khách hàng và doanh nghiệp đều đánh giá cao tính khả thi của giải pháp. Luận văn cũng nhận được sự ủng hộ từ giảng viên hướng dẫn và hội đồng đánh giá.

4.2. Hướng phát triển trong tương lai

Trong tương lai, website có thể nâng cấp bằng cách tích hợp trí tuệ nhân tạo để đề xuất sản phẩm, hoặc sử dụng công nghệ blockchain để đảm bảo an toàn giao dịch. Ngoài ra, cần mở rộng chức năng như chatbot hỗ trợ khách hàng, tích hợp mạng xã hội, và tối ưu hóa SEO để tăng lưu lượng truy cập. Luận văn cũng có thể mở rộng sang lĩnh vực bán hàng đa kênh, kết hợp website với các nền tảng thương mại điện tử.

Trích đoạn nội dung tài liệu

mở đầu : <p>. Phần “thẻ” được biểu thị bằng dấu ngoặc mở và chữ “p” cho máy tính biết chúng tôi đang mở một đoạn văn thay vì một số loại nội dung khác. Khi một thẻ đã được mở, tất cả nội dung theo sau được coi là một phần của thẻ đó cho đến khi bạn “đóng” thẻ. Khi đoạn kết thúc, tôi sẽ đặt thẻ đoạn kết thúc: </p>.

Lưu ý rằng các thẻ đóng trông giống hệt như các thẻ mở, ngoại trừ có một dấu gạch chéo về phía trước sau dấu ngoặc góc bên trái. Đây là một ví dụ: <p>Đây là một đoạn văn.</p> Sử dụng HTML, bạn có thể thêm tiêu đề, định dạng đoạn văn, ngắt dòng điều khiển, tạo danh sách, nhấn mạnh văn bản, tạo ký tự đặc biệt, chèn hình ảnh, tạo liên kết, xây dựng bảng, điều khiển một số kiểu, và nhiều hơn nữa. Sinh viên: Nguyễn Việt Phương Lớp: PM23.18 10 Thiết kế website bán hàng quần áo bằng HTML 1. CSS CSS là viết tắt của Cascading Style Sheets.

Ngôn ngữ lập trình này quy định cách các thành phần HTML của trang web thực sự sẽ xuất hiện trên frontend như thế nào. HTML cung cấp các công cụ thô cần thiết để cấu trúc nội dung trên một trang web. CSS, mặt khác, giúp xác định kiểu nội dung này để nó xuất hiện cho người dùng theo cách nó cần được nhìn thấy. Các ngôn ngữ này được giữ riêng biệt để đảm bảo các trang web được xây dựng chính xác trước khi chúng được định dạng lại.

Trong khi HTML là cấu trúc cơ bản của trang web của bạn, CSS là thứ mang lại cho toàn bộ trang web của bạn phong cách. Những màu sắc bóng bẩy, phông chữ thú vị, và hình ảnh nền? Tất cả là nhờ CSS. Ngôn ngữ này ảnh hưởng đến toàn bộ tâm trạng và giai điệu của một trang web, khiến nó trở thành một công cụ vô cùng mạnh mẽ – và là một kỹ năng quan trọng để các lập trình viên web học hỏi. Đó cũng là những gì cho phép các trang web thích ứng với các kích thước màn hình và loại thiết bị khác nhau.

Để cho bạn thấy CSS làm gì với một trang web, hãy nhìn vào hai ảnh chụp màn hình sau đây. Ảnh chụp màn hình đầu tiên là bài đăng trên blog, nhưng được hiển thị trong HTML cơ bản và ảnh chụp màn hình thứ hai là cùng một bài đăng blog với HTML và CSS. Sinh viên: Nguyễn Việt Phương Lớp: PM23.18 11 Thiết kế website bán hàng quần áo bằng HTML Lưu ý tất cả nội dung vẫn còn đó, nhưng kiểu dáng trực quan thì không. Hình bên trái là những gì bạn có thể thấy nếu CSS không tải trên trang web, vì bất kỳ lý do gì.

Hình bênh phải là những gì cùng một trang web với CSS được thêm vào. Nói một cách đơn giản, CSS là một danh sách các quy tắc có thể gán các thuộc tính khác nhau cho các thẻ HTML, được chỉ định cho các thẻ đơn, nhiều thẻ, toàn bộ tài liệu hoặc nhiều tài liệu. Nó tồn tại bởi vì, khi các yếu tố thiết kế như phông chữ và màu sắc được phát triển, các nhà thiết kế web đã gặp nhiều khó khăn khi thích ứng HTML với các tính năng mới này. HTML, được phát triển trở lại vào năm 1990, không thực sự có ý định hiển thị bất kỳ thông tin định dạng vật lý nào.

Ban đầu nó chỉ có nghĩa là để xác định nội dung cấu trúc của tài liệu, như tiêu đề so với đoạn văn. Cách thức hoạt động của HTML đã vượt qua các tính năng thiết kế mới này và CSS được phát minh và phát hành vào năm 1996: Tất cả các định dạng có thể được xóa khỏi các tài liệu HTML và được lưu trữ trong các tệp CSS (.css) riêng biệt. Vậy, CSS chính xác là gì? Nó là viết tắt của Cascading Style Sheets – và “style sheet” dùng để chỉ chính tài liệu đó. Mỗi trình duyệt web có style sheet kiểu mặc định, vì vậy mọi trang web hiện có đều bị ảnh hưởng bởi ít nhất một style sheet – style sheet kiểu mặc định của bất kỳ trình duyệt nào mà khách truy cập trang web đang sử dụng – bất kể nhà thiết kế web có áp dụng bất kỳ kiểu nào không.

Ví dụ: kiểu phông chữ mặc định của trình duyệt của tôi là Times New Roman, cỡ 12, vì vậy nếu tôi truy cập một trang web nơi nhà thiết kế không áp dụng một style sheet của riêng họ, tôi sẽ thấy trang web có font Times New Roman, cỡ 12. Rõ ràng, phần lớn các trang web tôi truy cập không sử dụng Times New Roman, cỡ 12 – đó là vì các nhà thiết kế web đằng sau các trang đó bắt đầu với một style sheet kiểu mặc định có kiểu phông chữ mặc định, và sau đó họ áp vào trình duyệt của tôi mặc định với CSS tùy chỉnh. Đó là nơi từ “cascading” phát huy tác dụng. Hãy nghĩ về một thác nước – khi thác nước đổ xuống, nó đập vào tất cả các tảng đá trên đường xuống, nhưng chỉ những tảng đá ở phía dưới ảnh hưởng đến nơi nó sẽ chảy.

Theo cách tương tự, Sinh viên: Nguyễn Việt Phương Lớp: PM23.18 12 Thiết kế website bán hàng quần áo bằng HTML style sheet được xác định cuối cùng thông báo cho trình duyệt của tôi những hướng dẫn nào được ưu tiên. JavaScript JavaScript là ngôn ngữ phức tạp hơn HTML hoặc CSS và nó không được phát hành ở dạng beta cho đến năm 1995. Ngày nay, JavaScript được hỗ trợ bởi tất cả các trình duyệt web hiện đại và được sử dụng trên hầu hết mọi trang web để có chức năng mạnh mẽ và phức tạp hơn. * Cách thức hoạt động của JavaScript JavaScript là ngôn ngữ lập trình dựa trên logic, có thể được sử dụng để sửa đổi nội dung trang web và khiến nó hoạt động theo nhiều cách khác nhau để đáp ứng với hành động của người dùng.

Các cách sử dụng phổ biến cho JavaScript bao gồm confirmation boxes, calls-to-action, và thêm thông tin mới vào thông tin hiện có. Nói tóm lại, JavaScript là ngôn ngữ lập trình cho phép các nhà phát triển web thiết kế các trang web tương tác. Hầu hết các hoạt động mà bạn sẽ thấy trên một trang web là nhờ JavaScript, giúp tăng cường các kiểm soát và hành vi mặc định của trình duyệt. * Tạo các quyết định của người dùng Một ví dụ về JavaScript đang hoạt động là các hộp thoại bật lên trên màn hình của bạn.

Hãy suy nghĩ về lần cuối cùng bạn nhập thông tin của mình vào một biểu mẫu trực tuyến và một hộp xác nhận bật lên, yêu cầu bạn nhấn “OK” hoặc “Hủy” để tiếp tục. Điều đó đã được thực hiện nhờ JavaScript – trong code, bạn sẽ tìm thấy một câu lệnh “if … else …” yêu cầu máy tính làm một việc nếu người dùng nhấp vào “OK” và một điều khác nếu người dùng nhấp vào “Hủy.” * Lưu trữ thông tin mới JavaScript đặc biệt hữu ích để gán các danh tính mới cho các thành phần trang web hiện có, theo các quyết định mà người dùng đưa ra khi truy cập trang. Ví dụ: giả sử bạn đang xây dựng một trang đích với một hình thức bạn muốn tạo khách hàng tiềm năng Sinh viên: Nguyễn Việt Phương Lớp: PM23.18 13 Thiết kế website bán hàng quần áo bằng HTML bằng cách nắm bắt thông tin về khách truy cập trang web. Bạn có thể có một “chuỗi” JavaScript dành riêng cho tên của người dùng.

Chuỗi đó có thể trông giống như thế này: function updateFirstname() { let Firstname = prompt(‘First Name’); } Sau đó, sau khi khách truy cập trang web nhập tên của họ – và bất kỳ thông tin nào khác bạn yêu cầu trên trang đích – và gửi biểu mẫu, hành động này sẽ cập nhật danh tính của phần tử “Tên gọi” ban đầu không xác định trong mã của bạn. Đây là cách bạn có thể cảm ơn khách truy cập trang web của mình bằng tên trong JavaScript: para.textContent = ‘Cảm ơn,’ + Firstname + “! Bây giờ bạn có thể tải xuống ebook của mình.” Trong chuỗi JavaScript ở trên, phần tử “Firstname” đã được gán first name của khách truy cập trang web và do đó sẽ tạo tên thật của anh ấy hoặc cô ấy trên giao diện của trang web. Đối với người dùng tên Kevin, câu sẽ như thế này: Cảm ơn, Kevin! Bây giờ bạn có thể tải về ebook của bạn.3 Ngôn ngữ và giải thuật Khái niệm giải thuật Giải thuật là một hệ thống chặt chẽ và rõ ràng các quy tắc nhằm xác định một dãy các thao tác trên những dữ liệu vào sao cho sau một số hữu hạn bước thực hiện các thao tác đó ta thu được kết quả của bài toán. Ví dụ 1: Giả sử có hai bình A và B đựng hai loại chất lỏng khác nhau, chẳng hạn bình A đựng rượu, bình B đựng nước mắm.

Giải thuật để hoán đổi (swap) chất lỏng đựng trong hai bình đó là:  Yêu cầu phải có thêm một bình thứ ba gọi là bình C.  Bước 1: Đổ rượu từ bình A sang bình C. Sinh viên: Nguyễn Việt Phương Lớp: PM23.18 14 Thiết kế website bán hàng quần áo bằng HTML  Bước 2: Đổ nước mắm từ bình B sang bình A.  Bước 3: Đổ rượu từ bình C sang bình B.

Ví dụ 2: Một trong những giải thuật tìm ước chung lớn nhất của hai số a và b là:  Bước 1: Nhập vào hai số a và b.  Bước 2: So sánh 2 số a,b chọn số nhỏ nhất gán cho UCLN.  Bước 3: Nếu một trong hai số a hoặc b không chia hết cho UCLN thì thực hiện bước 4, ngược lại (cả a và b đều chia hết cho UCLN) thì thực hiện bước 5.  Bước 4: Giảm UCLN một đơn vị và quay lại bước 3  Bước 5: In UCLN - Kết thúc.

Các đặc trưng của giải thuật  Tính kết thúc: Giải thuật phải dừng sau một số hữu hạn bước.  Tính xác định: Các thao tác máy tính phải thực hiện được và các máy tính khác nhau thực hiện cùng một bước của cùng một giải thuật phải cho cùng một kết quả.  Tính phổ dụng: Giải thuật phải "vét' hết các trường hợp và áp dụng cho một loạt bài toán cùng loại.  Tính hiệu quả: Một giải thuật được đánh giá là tốt nếu nó đạt hai tiêu chuẩn sau: - Thực hiện nhanh, tốn ít thời gian.

- Tiêu phí ít tài nguyên của máy, chẳng hạn tốn ít bộ nhớ. Giải thuật tìm UCLN nêu trên đạt tính kết thúc bởi vì qua mỗi lần thực hiện bước 4 thì UCLN sẽ giảm đi một đơn vị cho nên trong trường hợp xấu nhất thì UCLN=1, giải thuật phải dừng.