Thiết Kế Website Quản Lý Cửa Hàng Mỹ Phẩm

Thiết kế website quản lý cửa hàng mỹ phẩm giúp tối ưu hóa quy trình kinh doanh, nâng cao trải nghiệm khách hàng và tăng doanh thu hiệu quả.

• Tác giả: Đỗ Quang Minh
• Người hướng dẫn: Dr. Pham Dinh Tan
• Trường học: Vietnam National University
• Chuyên ngành: ICE
• Đề tài: Design A Website For Cosmetic Store Management
• Loại tài liệu: graduation project
• Năm xuất bản: 2024
• Địa điểm: Hanoi

Mục lục chi tiết

• ACKNOWLEDGEMENT
• INTRODUCTION
• 1. CHAPTER 1: OVERVIEW OF WORDPRESS AND MYSQL
• 1.1. Introduction to web development
• 1.2. Learn about HTML
• 1.3. Learn about CSS
• 1.4. Learn about JavaScript programming language
• 1.5. Learn about PHP
• 1.6. Benefits of Website for businesses
• 2. CHAPTER 2: SYSTEM ANALYSIS AND DESIGN
• 2.1. Introducing online sales website
• 2.2. Overview of the website
• 2.3. Client-side functions
• 2.4. Administrator side functions
• 2.5. User -side functional hierarchy diagram
• 2.6. Functional hierarchy diagram for administrators
• 2.7. General usecase diagram
• 2.8. Usecase diagram for customer actor
• 2.9. Usecase diagram for system administrator
• 2.10. Usecase diagram for shopping cart management
• 2.11. Usecase diagram for product management
• 2.12. Usecase diagram for new management
• 2.13. Usecase diagram for add to cart
• 2.14. Usecase diagram for payment
• 2.15. Usecase diagram for update shopping cart
• 2.16. Usecase diagram for add products
• 2.17. Usecase diagram for delete products
• 2.18. Single Page Application model
• 2.19. Install Visual Studio Code
• 2.20. Connect to PHP Myadmin
• 2.21. Integrate contact button into website
• 2.22. Integrate chat messages into the website
• 2.23. Integrate Zalo and phone
• 3. CHAPTER 3: BUILDING A WEBSITE
• 3.1. Admin side interface

Tóm tắt

I. Tổng Quan Về Thiết Kế Website Quản Lý Cửa Hàng Mỹ Phẩm

Ngày nay, sự phát triển của công nghệ đã thay đổi diện mạo của nhiều lĩnh vực, trong đó có thương mại điện tử. Cùng với nhu cầu chuyển đổi số của các doanh nghiệp, việc sử dụng website để mua bán, tìm kiếm thông tin ngày càng trở nên phổ biến. Việc cập nhật thông tin là vô cùng quan trọng đối với các nhà quản lý và doanh nghiệp. Để quảng bá sản phẩm, nhiều công ty lớn đã có chiến lược quảng bá sản phẩm trên các phương tiện truyền thông đại chúng như báo chí, đài phát thanh, truyền hình, trong đó quảng bá sản phẩm trên website là một trong những giải pháp hiệu quả nhất. Đây là công thức để truyền tải thông tin một cách nhanh chóng, hiệu quả và tiết kiệm chi phí. Cùng với sự phát triển của Internet, nhu cầu chăm sóc bản thân và làm đẹp của mọi người cũng tăng lên, vì vậy một loạt các sản phẩm công nghệ nghệ thuật được cung cấp để ứng dụng vào thị trường. Phục vụ khách hàng, khách hàng có thể trực tiếp mua hàng qua website online. Khách hàng không mất nhiều thời gian để nhanh chóng mua được sản phẩm mong muốn.

1.1. Tầm Quan Trọng Của Website Bán Hàng Mỹ Phẩm Online

Việc xây dựng một website bán hàng mỹ phẩm online là vô cùng cần thiết, đặc biệt trong thời đại thương mại điện tử ngày càng phát triển. Đối với nhu cầu trao đổi hàng hóa từ các doanh nghiệp cá nhân đến người tiêu dùng một cách nhanh chóng, một website là không thể thiếu. Website sẽ giúp dễ dàng quảng bá và bán sản phẩm một cách nhanh chóng và hiệu quả. Từ công việc nghiên cứu lý thuyết, kiến trúc và thời gian nghiên cứu, tôi đã sử dụng để xây dựng một website bán hàng.

1.2. Lợi Ích Khi Thiết Kế Website Quản Lý Cửa Hàng Mỹ Phẩm

Một website giúp kết nối hơn 7 tỷ người trên toàn thế giới, không chỉ giới hạn trong phạm vi quốc gia. Để phát triển công nghệ ở một cấp độ cao hơn, mang thông tin đến mọi cá nhân sử dụng internet ngày nay không phải là điều quá xa vời. Với một website bán hàng, có thể quảng bá sản phẩm và bán hàng ở thị trường trong nước hoặc một quốc gia khác ngoài Việt Nam một cách nhanh chóng và dễ dàng. Số lượng sản phẩm đăng trên website phụ thuộc vào mong muốn và nhu cầu của bạn. Không giới hạn số lượng thông tin sẽ giúp cung cấp thông tin đầy đủ và chi tiết, từ đó giúp khách hàng dễ dàng tiếp cận doanh nghiệp và tăng doanh thu.

II. Những Thách Thức Khi Quản Lý Cửa Hàng Mỹ Phẩm Không Có Website

Việc không có website quản lý cửa hàng mỹ phẩm có thể gây ra nhiều khó khăn trong việc quản lý, vận hành và phát triển kinh doanh. Khả năng tiếp cận khách hàng bị hạn chế, chỉ có thể phục vụ những khách hàng đến trực tiếp cửa hàng. Việc quản lý thông tin sản phẩm, quản lý kho mỹ phẩm, quản lý đơn hàng trở nên phức tạp và tốn thời gian hơn, dễ xảy ra sai sót. Khó khăn trong việc xây dựng thương hiệu và tạo dựng uy tín trên thị trường, đặc biệt trong bối cảnh cạnh tranh ngày càng gay gắt. Chi phí marketing và quảng cáo cao hơn so với việc sử dụng website để tiếp cận khách hàng tiềm năng. Việc mở rộng thị trường và phát triển kinh doanh gặp nhiều trở ngại do thiếu công cụ hiệu quả để quảng bá sản phẩm và tiếp cận khách hàng ở xa.

2.1. Khó Khăn Trong Quản Lý Sản Phẩm Và Kho Hàng Thủ Công

Nếu không có website, việc quản lý sản phẩm trở nên rất khó khăn. Việc cập nhật thông tin sản phẩm mới, điều chỉnh giá, theo dõi số lượng tồn kho đều phải thực hiện thủ công, tốn nhiều thời gian và dễ xảy ra sai sót. Khó kiểm soát được số lượng sản phẩm bán ra, sản phẩm nào đang được ưa chuộng, sản phẩm nào cần giảm giá để đẩy hàng. Việc quản lý kho hàng thủ công cũng rất phức tạp, đặc biệt đối với các cửa hàng có nhiều sản phẩm và nhiều chi nhánh.

2.2. Hạn Chế Trong Tiếp Cận Khách Hàng Và Mở Rộng Thị Trường

Khi không có website, cửa hàng chỉ có thể tiếp cận được những khách hàng đến trực tiếp. Điều này hạn chế khả năng mở rộng thị trường, tiếp cận khách hàng tiềm năng ở xa. Khó khăn trong việc thực hiện các chương trình marketing, quảng cáo để thu hút khách hàng mới. Không thể tận dụng được sức mạnh của internet để quảng bá thương hiệu và sản phẩm. Dẫn đến việc bỏ lỡ nhiều cơ hội kinh doanh và mất dần lợi thế cạnh tranh.

III. Hướng Dẫn Thiết Kế Website Quản Lý Cửa Hàng Mỹ Phẩm Chuẩn SEO

Việc thiết kế website quản lý cửa hàng mỹ phẩm đòi hỏi sự tỉ mỉ và chuyên nghiệp để đảm bảo website hoạt động hiệu quả, thu hút khách hàng và mang lại doanh thu. Cần xác định rõ mục tiêu của website, đối tượng khách hàng mục tiêu và các chức năng cần thiết. Lựa chọn nền tảng thiết kế website phù hợp, có thể là WordPress, Shopify, hoặc các nền tảng e-commerce mỹ phẩm khác. Thiết kế giao diện website mỹ phẩm đẹp mắt, chuyên nghiệp, thân thiện với người dùng và phù hợp với thương hiệu của cửa hàng. Xây dựng cấu trúc website rõ ràng, logic, dễ điều hướng. Tối ưu hóa website chuẩn SEO để cải thiện thứ hạng trên các công cụ tìm kiếm.

3.1. Lựa Chọn Nền Tảng Thiết Kế Website Phù Hợp

Có nhiều nền tảng thiết kế website khác nhau, mỗi nền tảng có ưu và nhược điểm riêng. WordPress là một lựa chọn phổ biến, dễ sử dụng, có nhiều plugin hỗ trợ và khả năng tùy biến cao. Shopify là một nền tảng thương mại điện tử chuyên dụng, cung cấp đầy đủ các công cụ để quản lý và bán hàng online. Các nền tảng thiết kế website khác như Wix, Squarespace cũng là những lựa chọn tốt, đặc biệt đối với những người không có nhiều kinh nghiệm về lập trình.

3.2. Thiết Kế Giao Diện Website Mỹ Phẩm Chuyên Nghiệp Và Thu Hút

Giao diện website mỹ phẩm là yếu tố quan trọng để thu hút và giữ chân khách hàng. Cần lựa chọn màu sắc, hình ảnh, font chữ phù hợp với thương hiệu của cửa hàng. Thiết kế website responsive để đảm bảo hiển thị tốt trên mọi thiết bị, từ máy tính để bàn đến điện thoại di động. Bố cục website cần rõ ràng, dễ nhìn, dễ tìm kiếm thông tin. Hình ảnh sản phẩm cần chất lượng cao, chân thực.

3.3. Tối Ưu Hóa Website Quản Lý Cửa Hàng Mỹ Phẩm Chuẩn SEO

Việc tối ưu hóa website chuẩn SEO là rất quan trọng để cải thiện thứ hạng trên các công cụ tìm kiếm, giúp khách hàng dễ dàng tìm thấy website của bạn. Cần nghiên cứu từ khóa liên quan đến sản phẩm mỹ phẩm, sử dụng từ khóa trong tiêu đề, mô tả, nội dung website. Xây dựng liên kết nội bộ và liên kết bên ngoài chất lượng. Tối ưu hóa tốc độ tải trang. Tạo sơ đồ website (sitemap) và gửi cho các công cụ tìm kiếm.

IV. Chức Năng Thiết Yếu Của Website Quản Lý Cửa Hàng Mỹ Phẩm

Một website quản lý cửa hàng mỹ phẩm cần có đầy đủ các chức năng để quản lý sản phẩm, đơn hàng, khách hàng và các hoạt động kinh doanh khác. Chức năng quản lý sản phẩm cho phép thêm, sửa, xóa thông tin sản phẩm, phân loại sản phẩm theo danh mục. Chức năng quản lý đơn hàng cho phép theo dõi trạng thái đơn hàng, xử lý đơn hàng, in hóa đơn. Chức năng quản lý khách hàng cho phép lưu trữ thông tin khách hàng, theo dõi lịch sử mua hàng, thực hiện các chương trình khuyến mãi. Chức năng quản lý kho mỹ phẩm cho phép theo dõi số lượng tồn kho, cảnh báo hết hàng, nhập kho, xuất kho. Chức năng thanh toán online giúp khách hàng dễ dàng thanh toán đơn hàng.

4.1. Quản Lý Sản Phẩm Mỹ Phẩm Hiệu Quả

Chức năng quản lý sản phẩm cho phép thêm mới sản phẩm, cập nhật thông tin sản phẩm (tên sản phẩm, giá, mô tả, hình ảnh), phân loại sản phẩm theo danh mục, thương hiệu. Cần có chức năng tìm kiếm sản phẩm nhanh chóng, lọc sản phẩm theo các tiêu chí khác nhau. Có thể tích hợp chức năng đánh giá, nhận xét sản phẩm để tăng tính tương tác với khách hàng.

4.2. Quản Lý Đơn Hàng Và Khách Hàng Chuyên Nghiệp

Chức năng quản lý đơn hàng cho phép theo dõi trạng thái đơn hàng (mới, đang xử lý, đã giao, đã hủy), xử lý đơn hàng (xác nhận đơn hàng, đóng gói sản phẩm, giao hàng), in hóa đơn. Chức năng quản lý khách hàng cho phép lưu trữ thông tin khách hàng (tên, địa chỉ, số điện thoại, email), theo dõi lịch sử mua hàng, phân loại khách hàng theo nhóm (khách hàng mới, khách hàng thân thiết).

4.3. Tích Hợp Thanh Toán Online Và Vận Chuyển Tiện Lợi

Việc tích hợp các cổng thanh toán online (Visa, Mastercard, Momo, ZaloPay) giúp khách hàng dễ dàng thanh toán đơn hàng. Cần lựa chọn các cổng thanh toán uy tín, bảo mật. Tích hợp với các đơn vị vận chuyển (Giao hàng nhanh, Giao hàng tiết kiệm, Viettel Post) giúp tự động tính phí vận chuyển, theo dõi trạng thái vận chuyển đơn hàng. Cung cấp nhiều hình thức thanh toán và vận chuyển khác nhau để khách hàng lựa chọn.

V. Các Yếu Tố Quan Trọng Để Website Mỹ Phẩm Thành Công

Để website mỹ phẩm thành công, cần chú trọng đến nhiều yếu tố. Thiết kế website đẹp mắt, chuyên nghiệp, thân thiện với người dùng. Cung cấp thông tin sản phẩm đầy đủ, chính xác, hấp dẫn. Đảm bảo chất lượng sản phẩm và dịch vụ. Xây dựng thương hiệu uy tín. Thực hiện các chiến dịch marketing, quảng cáo hiệu quả. Chăm sóc khách hàng chu đáo. Thường xuyên cập nhật nội dung website và cải thiện website dựa trên phản hồi của khách hàng.

5.1. Nội Dung Website Chất Lượng Và Hấp Dẫn

Nội dung website cần cung cấp thông tin đầy đủ, chính xác, hữu ích về sản phẩm mỹ phẩm. Viết bài viết chia sẻ kiến thức về làm đẹp, chăm sóc da. Tạo video hướng dẫn sử dụng sản phẩm. Sử dụng hình ảnh, video chất lượng cao. Cập nhật nội dung thường xuyên để thu hút khách hàng quay lại website.

5.2. Chăm Sóc Khách Hàng Tận Tâm Và Chu Đáo

Trả lời nhanh chóng các câu hỏi của khách hàng. Giải quyết các vấn đề phát sinh một cách chuyên nghiệp. Cung cấp dịch vụ tư vấn, hỗ trợ khách hàng nhiệt tình. Thu thập phản hồi của khách hàng để cải thiện sản phẩm và dịch vụ. Xây dựng mối quan hệ tốt đẹp với khách hàng.

VI. Xu Hướng Thiết Kế Website Quản Lý Cửa Hàng Mỹ Phẩm Tương Lai

Trong tương lai, thiết kế website quản lý cửa hàng mỹ phẩm sẽ tiếp tục phát triển theo hướng cá nhân hóa trải nghiệm người dùng, tích hợp công nghệ AI (trí tuệ nhân tạo) để tư vấn sản phẩm, sử dụng thực tế ảo (VR/AR) để khách hàng trải nghiệm sản phẩm trước khi mua. Tập trung vào thiết kế website mobile friendly để đáp ứng nhu cầu sử dụng điện thoại di động ngày càng tăng. Chú trọng đến bảo mật thông tin khách hàng và tuân thủ các quy định về bảo vệ dữ liệu cá nhân.

6.1. Cá Nhân Hóa Trải Nghiệm Mua Sắm Online

Sử dụng AI để gợi ý sản phẩm phù hợp với nhu cầu của từng khách hàng. Hiển thị nội dung, khuyến mãi dựa trên lịch sử mua hàng và sở thích của khách hàng. Tạo chương trình khách hàng thân thiết với các ưu đãi riêng biệt.

6.2. Ứng Dụng Công Nghệ AR VR Để Trải Nghiệm Sản Phẩm

Cho phép khách hàng thử son, phấn, kem nền ảo trên khuôn mặt của mình. Tạo không gian mua sắm ảo để khách hàng khám phá sản phẩm. Tăng tính tương tác và trải nghiệm cho khách hàng.

Nội dung chính

Bối cảnh và vấn đề nghiên cứu

Trong bối cảnh chuyển đổi số và sự phát triển mạnh mẽ của công nghệ thông tin, thương mại điện tử đã trở thành phương thức giao dịch phổ biến, giúp tối ưu hóa thời gian và chi phí cho cả người bán lẫn người mua. Bên cạnh đó, nhu cầu chăm sóc sắc đẹp và sử dụng mỹ phẩm của người tiêu dùng ngày càng gia tăng, đòi hỏi các đơn vị kinh doanh phải xây dựng kênh bán hàng trực tuyến hiệu quả nhằm quảng bá sản phẩm và tiếp cận khách hàng trên diện rộng mà không bị giới hạn bởi không gian hay thời gian.

Đồ án tốt nghiệp "Thiết Kế Website Quản Lý Cửa Hàng Mỹ Phẩm" (tên tiếng Anh: "Design a website for cosmetic store management") được thực hiện bởi sinh viên Đỗ Quang Minh (Mã sinh viên: 19071617 / 1907167, Lớp: ICE2019A, Ngành: Kỹ thuật Thông tin và Truyền thông - ICE, Mã học phần: INS401401) dưới sự hướng dẫn của TS. Phạm Đình Tân tại Trường Quốc tế – Đại học Quốc gia Hà Nội (VNU-IS), năm 2024.

Mục tiêu và nhiệm vụ nghiên cứu của đồ án bao gồm:

1. Nghiên cứu tổng quan về nền tảng mã nguồn mở WordPress Framework và hệ quản trị cơ sở dữ liệu quan hệ MySQL.
2. Phân tích yêu cầu nghiệp vụ và thiết kế hệ thống website bán hàng mỹ phẩm trực tuyến (bao gồm phân hệ khách hàng và phân hệ quản trị).
3. Triển khai xây dựng, tối ưu hóa giao diện, tốc độ xử lý và tích hợp các tiện ích tương tác trực tuyến (Zalo, Messenger, gọi điện) nhằm đảm bảo tiêu chuẩn về trải nghiệm người dùng và quy trình quản lý bán hàng.

Đối tượng nghiên cứu là quy trình quản lý, quảng bá và kinh doanh trực tuyến các mặt hàng mỹ phẩm. Phạm vi nghiên cứu tập trung vào việc ứng dụng công nghệ web (HTML, CSS, JavaScript, PHP), CMS WordPress, hệ quản trị MySQL và môi trường công cụ phát triển cục bộ trong năm học tốt nghiệp 2024.

---

Cơ sở lý thuyết và phương pháp

Khung lý thuyết và công nghệ sử dụng

Đồ án xây dựng nền tảng kiến thức dựa trên các công nghệ phát triển web tiêu chuẩn:

• Kiến trúc phát triển Web: Phân định rõ tầng Front-End (giao diện tương tác người dùng) và Back-End (xử lý logic nghiệp vụ, máy chủ và cơ sở dữ liệu).
• Ngôn ngữ đánh dấu và định dạng: HTML (HyperText Markup Language) và phiên bản HTML5 bổ sung thẻ ngữ nghĩa, hỗ trợ nhúng đa phương tiện <audio>, <video>, đồ họa SVG, MathML và mở rộng các loại trường biểu mẫu (email, date, time, phone, search); CSS (Cascading Style Sheets) định kiểu hiển thị và bố cục giao diện.
• Ngôn ngữ kịch bản: JavaScript (ngôn ngữ lập trình thông dịch bậc cao, hướng đối tượng dựa trên prototype) và PHP (ngôn ngữ kịch bản phía máy chủ mã nguồn mở, nhúng trực tiếp vào HTML).
• Hệ quản trị nội dung (CMS): WordPress Framework (khởi nguồn từ dự án b2/cafelog năm 2001 bởi Michel Valdrighi, phát triển chính thức bởi Matt Mullenweg và Mike Little từ năm 2003).
• Hệ quản trị cơ sở dữ liệu: MySQL (hệ quản trị cơ sở dữ liệu quan hệ mã nguồn mở theo giấy phép GNU GPL).

Phương pháp nghiên cứu và nguồn dữ liệu

• Phương pháp phân tích và tổng hợp lý thuyết: Thu thập, phân tích tài liệu kỹ thuật về kiến trúc web, các phiên bản CSS/HTML5, các framework JavaScript (Angular, React, Vue), so sánh mô hình Single Page Application (SPA) và Server Side Rendering (SSR).
• Phương pháp phân tích và thiết kế hệ thống hướng đối tượng: Sử dụng sơ đồ phân cấp chức năng (Functional Hierarchy Diagram), sơ đồ ca sử dụng tổng quát và chi tiết (Use Case Diagram), cùng sơ đồ tuần tự (Sequence Diagram) để mô hình hóa các luồng xử lý dữ liệu.
• Phương pháp thực nghiệm phát triển phần mềm: Cài đặt, cấu hình hệ thống trên máy tính cá nhân sử dụng Visual Studio Code, Git, quản lý cơ sở dữ liệu qua phpMyAdmin, triển khai giao diện qua Theme Xstore và plugin hỗ trợ Xstore Core.

---

Thiết kế và triển khai

Hệ thống website quản lý cửa hàng mỹ phẩm được thiết kế gồm hai phân hệ chính: phân hệ người dùng (Client-side) và phân hệ quản trị viên (Administrator-side).

1. Phân hệ người dùng (Client-side)

Phân hệ này cung cấp đầy đủ các tiện ích giúp khách hàng tìm kiếm, xem thông tin và mua sắm mỹ phẩm trực tuyến.

STT	Tên chức năng	Mô tả chi tiết chức năng
1	Đăng ký tài khoản (Register an account)	Khách hàng đăng ký tài khoản bằng email, tên và mật khẩu; thông tin được lưu trữ vào cơ sở dữ liệu.
2	Đăng nhập tài khoản (Log in to your account)	Xác thực thông tin qua email và mật khẩu; hệ thống cấp token lưu phiên đăng nhập của người dùng.
3	Đăng xuất tài khoản (Sign out of your account)	Xóa token đã lưu và chuyển hướng người dùng về trang đăng nhập.
4	Xem sản phẩm (View products)	Hiển thị toàn bộ danh sách sản phẩm mỹ phẩm cho mọi khách truy cập (kể cả chưa đăng nhập).
5	Tìm kiếm sản phẩm (Search products)	Tìm kiếm nhanh danh sách sản phẩm dựa theo từ khóa nhập vào thanh tìm kiếm.
6	Sắp xếp sản phẩm (View sorted products)	Lọc và sắp xếp sản phẩm theo các tiêu chí: mới nhất, cũ nhất, giá tăng dần, giá giảm dần, sản phẩm tốt nhất.
7	Xem theo danh mục (View products by category)	Phân loại và hiển thị sản phẩm theo từng danh mục cụ thể hoặc xem tất cả danh mục.
8	Giỏ hàng (Cart)	Quản lý sản phẩm chọn mua, cho phép tăng/giảm số lượng, xóa từng sản phẩm và tự động tính tổng tiền.
9	Xem lịch sử mua hàng (View purchase history)	Hiển thị chi tiết đơn hàng đã mua: số lượng, ngày mua, họ tên, địa chỉ, mã bưu điện, mã quốc gia và tổng giá trị.
10	Xem chi tiết sản phẩm (See details of each product)	Hiển thị tên, mô tả, nội dung, giá bán và đề xuất các sản phẩm tương tự trong cửa hàng.
11	Thanh toán trực tiếp (Direct payment)	Cho phép khách hàng đặt hàng và lựa chọn hình thức thanh toán khi nhận hàng (COD).
12	Xem tin tức (View news)	Hiển thị danh sách các bài viết, tin tức làm đẹp trên trang blog của website.
13	Xem chi tiết tin tức (See details of each new)	Chuyển tiếp tới trang xem toàn bộ nội dung chi tiết của một bài viết cụ thể.

2. Phân hệ quản trị (Administrator-side)

Phân hệ quản trị cho phép người quản lý kiểm soát toàn bộ hoạt động kinh doanh, dữ liệu sản phẩm, đơn hàng và nội dung bài viết.

STT	Tên chức năng	Mô tả chi tiết chức năng
1	Quản lý sản phẩm (Product Management)	Thêm sản phẩm mới (tên, giá, mô tả, hình ảnh), chỉnh sửa thông tin sản phẩm, xóa từng sản phẩm hoặc xóa toàn bộ.
2	Quản lý danh mục (Manage product catalog)	Thêm, sửa, xóa các danh mục phân loại mỹ phẩm trên website.
3	Quản lý chi tiết đơn hàng (Manage order details)	Theo dõi danh sách đơn hàng đã bán: thông tin người nhận, ngày đặt hàng, địa chỉ, mã bưu điện, mã quốc gia, số lượng và tổng tiền.
4	Tiếp nhận phản hồi (Get customer feedback)	Lưu trữ và hiển thị các ý kiến đóng góp, phản hồi từ khách hàng gửi về website.
5	Quản lý tin tức (News management)	Soạn thảo, thêm mới, sửa nội dung hoặc xóa các bài viết tin tức/blog trên hệ thống.

3. Mô hình hóa hệ thống và công cụ triển khai

• Biểu đồ ca sử dụng (Use Case Diagrams): Tác giả xây dựng sơ đồ ca sử dụng tổng quát và các sơ đồ phân rã chi tiết cho tác tử khách hàng (Customer) và quản trị viên (System Administrator), bao gồm: ca sử dụng quản lý giỏ hàng, quản lý sản phẩm, quản lý tin tức, thêm vào giỏ hàng, cập nhật giỏ hàng, thanh toán, thêm sản phẩm và xóa sản phẩm.
• Biểu đồ tuần tự (Sequence Diagrams): Mô tả chi tiết luồng thông điệp theo thời gian cho các nghiệp vụ: Đăng nhập (Login sequence diagram), Đặt hàng (Order sequence diagram), Tìm kiếm (Search sequence diagram) và Đăng ký (Register sequence diagram).
• Môi trường triển khai thực nghiệm:
  • Soạn thảo mã nguồn và quản lý phiên bản: Visual Studio Code, Git.
  • Quản trị cơ sở dữ liệu: phpMyAdmin (tạo người dùng, cấp quyền, tạo thư mục cơ sở dữ liệu và kết nối).
  • Giao diện và tiện ích mở rộng: Cài đặt và kích hoạt Theme Xstore, plugin Xstore Core, trình dựng trang (Page Builder), nhập dữ liệu mẫu (Import data demo).
  • Tích hợp công cụ tương tác đa kênh: Chèn nút liên hệ (Contact button), cấu hình Messenger Chat qua đoạn mã plugin (Messenger Plugin Chat Code), tích hợp nút gọi điện thoại và Zalo trực tiếp trên giao diện website.

---

Nội dung chính theo từng chương

Chương 1: Tổng quan về WordPress và MySQL (Chapter 1: Overview of WordPress and MySQL)

Chương 1 hệ thống hóa toàn bộ cơ sở lý luận và nền tảng công nghệ xây dựng website thương mại điện tử:

• Khái niệm lập trình web: Phân tích vai trò của Front-End (HTML, CSS, JavaScript) trong việc tối ưu hóa khả năng hiển thị đa thiết bị và Back-End (PHP, C#, Java, Python; các framework Django, Rails, Spring; các hệ quản trị cơ sở dữ liệu SQL/NoSQL; hệ quản trị nội dung WordPress, Joomla, Umbraco) trong việc xử lý logic nghiệp vụ và dữ liệu.
• Các ngôn ngữ cốt lõi: Phân tích đặc tính của HTML5 (loại bỏ các thẻ lỗi thời như applet, font, frame, center, isindex...; bổ sung thẻ ngữ nghĩa và hỗ trợ đa phương tiện), CSS và tiến trình phát triển các thuộc tính CSS qua các phiên bản, JavaScript (mô hình prototype-based, ứng dụng trên Front-End, Back-End với Node.js, ứng dụng Desktop với Electron, ứng dụng di động với React-Native) và PHP (ngôn ngữ mã nguồn mở máy chủ, hỗ trợ kết nối đa dạng cơ sở dữ liệu MySQL, PostgreSQL, MS-SQL, SQLite).
• Lợi ích của website đối với doanh nghiệp: Liệt kê 16 lợi ích cụ thể như bán hàng mọi lúc mọi nơi 24/24, không giới hạn không gian, tiết kiệm chi phí mặt bằng và nhân sự, nâng cao tính chuyên nghiệp, tăng khả năng tiếp cận khách hàng tiềm năng, thu thập phản hồi và xây dựng thương hiệu.
• WordPress Framework và Hệ quản trị MySQL: Trình bày lịch sử phát triển của WordPress từ b2/cafelog (2001) đến phiên bản chính thức (2003), quy mô hơn 75 triệu website toàn cầu và hỗ trợ 52 ngôn ngữ. Phân tích ưu nhược điểm của WordPress và MySQL.

Chương 1 cũng cung cấp bảng đối chiếu chi tiết giữa WordPress.org và WordPress.com để làm căn cứ lựa chọn nền tảng:

Tiêu chí so sánh	WordPress.org (Tự lưu trữ - Self-hosted)	WordPress.com (Lưu trữ sẵn)
Chi phí ban đầu	Mua Hosting khoảng 3.49 USD/tháng (~81.000 VNĐ) và tên miền khoảng 10 USD/năm (~231.000 VNĐ).	Miễn phí bản cơ bản, giới hạn dung lượng lưu trữ 3GB, sử dụng tên miền phụ (subdomain).
Quản lý giao diện (Theme)	Tùy ý tải lên giao diện miễn phí, trả phí hoặc tự chỉnh sửa mã nguồn theme.	Giới hạn giao diện; phải trả thêm 30 USD/năm (~693.000 VNĐ) để được tùy biến mã nguồn.
Bảo trì và cập nhật	Người quản trị tự chịu trách nhiệm tối ưu hóa, sao lưu (backup), chống spam và bảo mật.	Hệ thống tự động thực hiện việc cập nhật và sao lưu dữ liệu.
Sử dụng Plugin	Cho phép cài đặt không giới hạn mọi plugin để bổ sung tính năng chuyên biệt.	Không hỗ trợ tải lên plugin ngoài ở phiên bản cơ bản, tính năng bị giới hạn.
Kiếm tiền và quảng cáo	Toàn quyền đặt banner quảng cáo, tiếp thị liên kết (affiliate links) và các hình thức khác.	Không được phép đặt banner cho đến khi đạt tối thiểu 25.000 lượt xem/tháng và phải xin cấp phép.

Chương 2: Phân tích và thiết kế hệ thống (Chapter 2: System Analysis and Design)

Chương 2 tập trung vào việc mô hình hóa các yêu cầu nghiệp vụ của website bán mỹ phẩm trực tuyến:

• Đặc tả tổng quan: Xác định hệ thống là website thương mại điện tử với giao diện thân thiện, tốc độ xử lý nhanh, hỗ trợ phương thức thanh toán khi nhận hàng (COD).
• Đặc tả chức năng chi tiết: Phân rã cụ thể 13 chức năng phía người dùng (Client-side) và 5 chức năng phía quản trị viên (Administrator-side) theo cơ chế: Đầu vào (Input) $\rightarrow$ Quy trình xử lý dữ liệu (Processing) $\rightarrow$ Kết quả đầu ra (Output).
• Mô hình hóa ca sử dụng: Xây dựng sơ đồ phân cấp chức năng phía người dùng và quản trị viên; sơ đồ ca sử dụng tổng quát cùng 8 sơ đồ ca sử dụng thành phần mô tả chi tiết các tác vụ: giỏ hàng, sản phẩm, tin tức, thanh toán, thêm/xóa sản phẩm.
• Mô hình hóa tương tác: Thiết lập 4 sơ đồ tuần tự (Sequence Diagram) thể hiện tuần tự các thông điệp trao đổi giữa Actor, Interface, Controller và Database cho các tiến trình: Đăng nhập, Đặt hàng, Tìm kiếm và Đăng ký tài khoản.

Chương 3: Xây dựng Website (Chapter 3: Building a Website)

Chương 3 trình bày các bước triển khai kỹ thuật thực tế và kết quả giao diện website:

• So sánh mô hình kiến trúc: Đánh giá ưu nhược điểm giữa mô hình Single Page Application (SPA) và Server Side Rendering (SSR).
• Chuẩn bị môi trường và cấu hình hệ thống: Hướng dẫn quy trình cài đặt Visual Studio Code, cài đặt Git, cấu hình máy chủ cục bộ và cơ sở dữ liệu trên phpMyAdmin (tạo tài khoản, phân quyền truy cập, tạo thư mục và khai báo thông tin kết nối).
• Triển khai giao diện và Plugin: Thiết lập theme Xstore, cài đặt plugin Xstore Core, thực hiện nhập dữ liệu mẫu (Import data demo), sử dụng Page Builder để tùy biến bố cục trang.
• Tích hợp kênh hỗ trợ khách hàng: Cấu hình và nhúng mã Messenger Plugin Chat Code, thiết lập nút liên hệ tích hợp số điện thoại hotline và ứng dụng Zalo.
• Hiện thực hóa giao diện: Trình bày kết quả hoàn thiện của các màn hình chức năng: Trang chủ khi đăng nhập, trang chi tiết sản phẩm, trang giỏ hàng, giao diện tìm kiếm sản phẩm, giao diện thêm/quản lý danh mục và toàn bộ phân hệ quản trị (Admin side interface).

---

Kết quả và đóng góp

Kết quả chính đạt được

• Xây dựng hoàn chỉnh website bán hàng và quản lý cửa hàng mỹ phẩm trực tuyến dựa trên nền tảng WordPress và hệ quản trị cơ sở dữ liệu MySQL.
• Hiện thực hóa đầy đủ 13 chức năng phía khách hàng và 5 nhóm chức năng quản trị bán hàng, đảm bảo tính liên kết từ khâu tìm kiếm, xem danh mục, quản lý giỏ hàng đến đặt hàng thanh toán COD.
• Tối ưu hóa giao diện hiển thị, đảm bảo tính thẩm mỹ, thân thiện với người dùng và cải thiện tốc độ xử lý thao tác trên trang.
• Tích hợp thành công các công cụ giao tiếp trực tuyến thời gian thực (Facebook Messenger, Zalo, gọi điện trực tiếp) giúp kết nối liền mạch giữa khách hàng và nhân viên tư vấn.

Đóng góp thực tiễn

• Cung cấp một giải pháp xây dựng website bán hàng hoàn chỉnh, tiết kiệm chi phí đầu tư ban đầu về nhân sự và mặt bằng cho các cửa hàng, cá nhân kinh doanh mỹ phẩm nhỏ và vừa.
• Đưa ra tài liệu phân tích thiết kế hệ thống chi tiết (từ bảng chức năng I/O, biểu đồ ca sử dụng đến biểu đồ tuần tự) có thể áp dụng trực tiếp cho các bài toán phát triển web thương mại điện tử tương tự.

---

Hạn chế và hướng nghiên cứu tiếp

Dựa trên các phân tích kỹ thuật trong văn bản, đồ án ghi nhận một số hạn chế và hướng mở:

• Vấn đề bảo mật: Do đặc thù mã nguồn mở của PHP và WordPress, hệ thống có nguy cơ bị khai thác lỗ hổng nếu mã nguồn hoặc các plugin không được cập nhật thường xuyên.
• Xung đột phần mềm: Việc cài đặt, kết hợp nhiều template và plugin ngoài có thể dẫn đến nguy cơ xung đột mã nguồn trong quá trình vận hành.
• Giới hạn khả năng chịu tải: Cấu trúc cơ sở dữ liệu MySQL kết hợp với WordPress phù hợp tối ưu cho các doanh nghiệp quy mô vừa và nhỏ; chưa đáp ứng được các hệ sinh thái có khối lượng dữ liệu khổng lồ như mạng lưới siêu thị toàn quốc, hệ thống ngân hàng hoặc quản lý dân số quốc gia.
• Phương thức thanh toán: Hệ thống hiện mới tập trung vào hình thức thanh toán trực tiếp khi nhận hàng (COD), chưa tích hợp các cổng thanh toán điện tử trực tuyến nâng cao.

---

Giá trị tham khảo

Đồ án là tài liệu tham khảo hữu ích cho:

• Sinh viên chuyên ngành Kỹ thuật Thông tin và Truyền thông (ICE), Công nghệ thông tin, Hệ thống thông tin quản lý hoặc Thương mại điện tử đang thực hiện đồ án tốt nghiệp về xây dựng website bán hàng.
• Các nhà phát triển web mới bắt đầu, cần tìm hiểu quy trình phân tích thiết kế từ biểu đồ phân cấp chức năng, biểu đồ use case, biểu đồ sequence đến các bước cài đặt theme, plugin Xstore và cấu hình cơ sở dữ liệu phpMyAdmin trên nền tảng WordPress.
• Các cá nhân và chủ cửa hàng mỹ phẩm muốn tham khảo mô hình website kinh doanh trực tiếp kết hợp các kênh chăm sóc khách hàng đa nền tảng (Zalo, Messenger).

---

Câu hỏi thường gặp

1. Đồ án do ai thực hiện, thuộc đơn vị đào tạo nào và người hướng dẫn là ai?
Đồ án do sinh viên Đỗ Quang Minh (Mã sinh viên: 19071617 / 1907167, Lớp: ICE2019A, Ngành: ICE) thực hiện tại Trường Quốc tế – Đại học Quốc gia Hà Nội, dưới sự hướng dẫn của TS. Phạm Đình Tân vào năm 2024.

2. Công nghệ chính được sử dụng để xây dựng website trong đồ án là gì?
Website được phát triển dựa trên nền tảng mã nguồn mở WordPress Framework, ngôn ngữ lập trình PHP, giao diện Front-End sử dụng HTML/HTML5, CSS, JavaScript, cơ sở dữ liệu MySQL quản lý qua phpMyAdmin, kết hợp cùng theme Xstore và plugin Xstore Core.

3. Phân hệ người dùng (Client-side) bao gồm những chức năng chính nào?
Phân hệ người dùng gồm 13 chức năng: Đăng ký tài khoản, Đăng nhập, Đăng xuất, Xem sản phẩm, Tìm kiếm sản phẩm, Lọc/sắp xếp sản phẩm, Xem theo danh mục, Quản lý giỏ hàng, Xem lịch sử mua hàng, Xem chi tiết sản phẩm, Thanh toán khi nhận hàng (COD), Xem tin tức blog và Xem chi tiết bài viết tin tức.

4. Phân hệ quản trị (Administrator-side) quản lý những đối tượng dữ liệu nào?
Phân hệ quản trị quản lý 5 nhóm đối tượng: Quản lý sản phẩm (thêm/sửa/xóa sản phẩm), Quản lý danh mục sản phẩm, Quản lý chi tiết đơn hàng đã bán, Tiếp nhận và lưu trữ phản hồi của khách hàng, và Quản lý các bài viết tin tức.

5. Điểm khác biệt cơ bản giữa WordPress.org và WordPress.com được đồ án chỉ ra là gì?
WordPress.org yêu cầu người dùng tự mua hosting (khoảng 3.49 USD/tháng) và tên miền (khoảng 10 USD/năm), nhưng cho phép toàn quyền cài đặt theme, plugin và kiếm tiền; trong khi WordPress.com cung cấp dịch vụ lưu trữ sẵn miễn phí nhưng bị giới hạn 3GB dung lượng, dùng tên miền phụ, giới hạn cài đặt plugin và yêu cầu đạt tối thiểu 25.000 lượt xem/tháng mới được xem xét đặt banner quảng cáo.

---

Kết luận

Đồ án "Thiết Kế Website Quản Lý Cửa Hàng Mỹ Phẩm" của sinh viên Đỗ Quang Minh đã hoàn thành mục tiêu nghiên cứu lý thuyết công nghệ web và phân tích, thiết kế, triển khai thực nghiệm thành công một website thương mại điện tử chuyên biệt cho ngành hàng mỹ phẩm. Hệ thống đáp ứng đầy đủ các luồng nghiệp vụ mua sắm trực tuyến cho khách hàng và phân hệ quản lý bán hàng cho quản trị viên trên nền tảng WordPress và MySQL. Đồ án là tài liệu tham khảo có giá trị về mặt kỹ thuật triển khai và quy trình phân tích hệ thống thông tin ứng dụng trong thương mại điện tử.

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

Graduation Project VIETNAM NATIONAL UNIVERSITY, HANOI INTERNATIONAL SCHOOL GRADUATION PROJECT PROJECT NAME Design a website for cosmetic store management Student’s name Đỗ Quang Minh Hanoi - Year 2024 Đỗ Quang Minh 1 Graduation Project VIETNAM NATIONAL UNIVERSITY, HANOI INTERNATIONAL SCHOOL GRADUATION PROJECT PROJECT NAME Design a website for cosmetic store management SUPERVISOR: Dr. Pham Dinh Tan STUDENT: Đỗ Quang Minh STUDENT ID: 19071617 SUBJECT CODE: INS401401 MAJOR: ICE Hanoi - Year 2024 Đỗ Quang Minh 2 Graduation Project TABLE OF CONTENT TABLE OF CONTENT. 3 LIST OF FIGURES. 6 LIST OF TABLES.

9 INFORMATION ON RESEARCH RESULTS. OVERVIEW OF WORDPRESS AND MYSQL. Introduction to web development. Learn about HTML.

Learn about CSS. Learn about JavaScript programming language. Learn about PHP. Benefits of Website for businesses.

Overview of WordPress Framework. History of WordPress formation. Advantages and Disadvantages when using WordPress. How to differentiate between WordPress.com and WordPress.

Overview of MySQL. Advantages and disadvantages of MySQL. SYSTEM ANALYSIS AND DESIGN. Introducing online sales website.

Overview of the website. Client-side functions. 37 Đỗ Quang Minh 3 Graduation Project 2. Administrator side functions.

User-side functional hierarchy diagram. Functional hierarchy diagram for administrators. General usecase diagram. Usecase diagram for customer actor.

Usecase diagram for system administrator. Usecase diagram for shopping cart management. Usecase diagram for product management. Usecase diagram for new management.

Usecase diagram for add to cart. Usecase diagram for payment. Usecase diagram for update shopping cart. Usecase diagram for add products.

Usecase diagram for delete products. Single Page Application model. Install Visual Studio Code. Connect to PHP Myadmin.

Integrate contact button into website. Integrate chat messages into the website. Integrate Zalo and phone. 72 Đỗ Quang Minh 4 Graduation Project 3.

Admin side interface. 80 Đỗ Quang Minh 5 Graduation Project LIST OF FIGURES Figure 1-1. Popular programming languages in front-end and back-end. Compare websites when adding CSS.

CSS properties through each version. Wide spectrum of programming languages. Home page PHP interface. WordPress interface first versions.

Sony Music homepage from the WordPress platform. WordPress supports a variety of languages. Supports a large WordPress community. The security issue is not really good.

What is MySQL?. Advantages of MySQL. Disadvantages of MySQL. User-side functional hierarchy diagram.

Functional hierarchy diagram for administrators. General usecase diagram. Usecase diagram for customer actor. Usecase diagram for system administrator.

Usecase diagram for shopping cart management. Usecase diagram for product management. Usecase diagram for new management. Usecase diagram for add to cart.

Usecase diagram for payment. Usecase diagram for update shopping cart. Usecase diagram for add products. Usecase diagram for delete products.

Login sequence diagram. 49 Đỗ Quang Minh 6 Graduation Project Figure 2-15. Order sequence diagram. Search sequence diagram.

Register sequence diagram. Comparison between Single Page Application and Server Side Rendering. Visual studio code homepage interface. Install Visual Studio Code.

Visual studio code interface. Git homepage interface. Install Git successful. Php Myadmin home page interface.

New account user addition interface. Create new folder. Declare information needed. Login with username.

Active theme Xstore. Install plugin Xstore Core. Import data demo. Choose page builder.

Install necessary plugin. 67 Đỗ Quang Minh 7 Graduation Project Figure 3-27. Add messager to website. Setup plugin chat.

Messenger Plugin Chat Code. Homepage interface when logged in. Product detail interface. Shopping cart interface.

Product search interface. Add new category and all categories. 78 Đỗ Quang Minh 8 Graduation Project LIST OF TABLES Table 1-1. Comparison table between WordPress.org and WordPress.

The table describes the client-side functionality. Table describing administrator-side functions. 41 Đỗ Quang Minh 9 Graduation Project INFORMATION ON RESEARCH RESULTS 1. General information Topic name: Design a website for cosmetic store management Student’s full name: Đỗ Quang Minh Student’s ID: 1907167 Class: ICE2019A Major: ICE 2.

Target Building an online sales website using Wordpress Framework and MySQL database management system. Website must ensure standards in content, interface, and user experience 3. Main content Research on Wordpress Framework and MySQL database management system. Analyze website system.

Accurate results are achieved Successfully built an online sales website. Optimize both interface and processing speed on the website. The website will provide basic content and functions of a sales website. Đỗ Quang Minh 10 Graduation Project ACKNOWLEDGEMENT I would like to send my sincere and deep thanks to the teachers in the subject, who have dedicatedly taught and imparted the necessary knowledge and valuable experiences to me during my time studying at the International School, VietNam National University, Ha Noi so I can carry out this project.

In particular, I would like to sincerely thank Dr. Pham Dinh Tan, who wholeheartedly guided, advised and supported me throughout the project implementation process. While working on the project with the teacher, I learned more knowledge and the ability to work independently and be responsible for my work. Although I have tried to complete the project within my scope and ability, there are certainly shortcomings.

I hope to receive understanding and suggestions from teachers and friends. Đỗ Quang Minh 11 Graduation Project INTRODUCTION 1. Overview of research situation in the field of the topic Nowadays, the development of technology is increasingly changing its face. Along with the development of technology and the need for digital transformation for businesses, we are using more websites to buy, sell goods or find information.

Updating information is essential for managers and businesses in this field. To promote products, many businesses of large companies have strategies for promoting products on mass media such as warnings, radio, and television, in which promoting products on websites is one of them. the most effective solutions. This is a formula for transmitting information quickly, effectively and cost-effectively.

Along with the development of the Internet, people's need to care for themselves and beautify themselves has also increased, so a series of artistic technology products are provided for application to the market. Serving customers, customers can directly buy through the online website. It doesn't take much time for customers to quickly buy the desired product. Based on the above needs, I chose the topic "Design a website for cosmetic store management" to research and carry out my graduation thesis.

The document content includes 3 chapters: Chapter 1: Overview of Wordpress and MySQL. Chapter 2: System analysis and design. Chapter 3: Building a Website. Urgency, scientific and practical significance of the topic The Internet helps people get closer together.

It leads to the creation of a new form of shopping, online shopping. This form of shopping meets the needs of people in the new age because it saves a lot of time. A sales website is a tool that helps users make purchases as quickly as possible, saving travel time and costs. Đỗ Quang Minh 12 Graduation Project Building an online sales website is very necessary, especially in the increasingly developing age of e-commerce.

For the need to exchange goods from individual businesses to consumers quickly, a website is indispensable. Website will help easily promote and sell products quickly and effectively. From theoretical research work, I used architecture and my research time to build a sales website. Đỗ Quang Minh 13 Graduation Project CHAPTER 1 OVERVIEW OF WORDPRESS AND MYSQL 1.

Introduction to web development Website programming is responsible for receiving all data (static web interface) from the department's web design and requests from customers to convert it into a complete system website that interacts with the database and interacts with the website. interact with users based on computer language. Divided into 2 main directions: Front End members and Back End members. Popular programming languages in front-end and back-end.

(source: https://200lab.io/blog/web-development-la-gi/) Front End is the way to call the process of using HTML, CSS, JavaScript languages to design and build interfaces for websites or web applications so that users can view and interact directly on it. The goal of website design is to make it easy for users to use when opening the website. This is very difficult because in reality users use many different types of devices with different sizes and resolutions, thus forcing Front End Developer to consider all these aspects when designing the website. It is Đỗ Quang Minh 14 Graduation Project necessary to ensure the website appears correctly on different browsers, different operating systems, and different devices.

Back End is the person who handles all the complex business logic behind the scenes, helping the system operate smoothly. User data and analysis algorithms are all located at the Back End. Back End programmers bring the website to life. To become a Back End Developer, you need to know Server-side languages as well as know how to manipulate databases: • Server-side languages to write Back End: C#, Java, Python, Ruby, ….

And must include knowledge of web frameworks that come with these languages: ASP.NET MVC, Spring, Django, Rails. • SQL database architecture: MS SQL Server, MySQL,. Recently some NoSQL databases are popular: Neo4j, MongoDB,. • Knowledge about the web in general, how to write Web Services, how to log in and assign permissions.

• Architecture of some CMS: WordPress, Joomla, Umbraco,. Learn about HTML ➢ Concept: HTML is the abbreviation of Hyper Text Markup Language, which means hypertext markup language. HTML is used to format and display text in the browser to the user. It is the backbone of a website.

Hyper Text: hypertext means "text within text". A text containing a link is a hypertext. Each click on a word is taken to a new web page, which is hypertext. Markup language: markup language is a programming language used to make text more interactive and flexible.

It can place text into images, tables, links. An HTML document contains many HTML tags, and each HTML tag contains different content.[4] ➢ Characteristics of HTML: Đỗ Quang Minh 15 Graduation Project o This is a very easy and simple language. o It is very easy to display results in HTML as it has many tag formats. o It is a markup language that can be used as a flexible way to design web pages along with text.

o May link to other websites. o Is platform independent as it can display on any other platform like Windows, Linux and Max. o Images, videos, and sounds can be added to websites to make them more attractive and interactive. ➢ Difference between HTML and HTML 5 HTML5 (also commonly known as HTML) was released in 1999.

During that time, the latest upgraded version of HTML, HTML5, was released in 2014. So, with HTML, HTML5 was added. Added many important features. Specifically, some new features of HTML5 include: o Video and audio support: Instead of having to use Flash Player to play video/audio, with HTML5, the installer can embed video/audio files directly into the web page using the <audio>< tag.

/audio> or <video></video>. o Scalable vector graphics (SVG) and MathML support for mathematical formulas or chemical methods. o There are more improvements in terms of language. Contains many semantic tags to help users understand the main content of the website.

o Supports more form types than HTML such as: email, date, time, phone number, URL, search. Additionally, some HTML tag errors have been removed in the HTML5 version. For example: isindex, noframes, acronym, applet, basefont, dir, font, frame, frameset, big, center, strike. Đỗ Quang Minh 16 Graduation Project 1.

Learn about CSS Figure 1-2. Compare websites when adding CSS. (source https://mikotech.vn/css-la-gi/) CSS stands for Cascading Style Sheets, it is a language used to find and reformat elements created with language markers (e.