tiểu luận đề tài phân tích và thiết kế website nongpro

Mô hình kinh doanh Nongpro chọn mô hình kinh doanh của mình là B2C - giao dịch của doanh nghiệp với người tiêu dùng, khách hàng chính của trang web là những người tiêu dùng cá nhân.. Màu

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC KINH TẾ ĐẠI HỌC ĐÀ NẴNG-

Lớp học phần: ELC3018_47K31.2 Sinh viên thực hiện:

1 Trần Thanh Đô

2 Cao Thị Thu Cẩm

3 Nguyễn Thị Thùy Giang

4 Lê T ị Lan Anhh

5 Nguyễn Trần Như Phương

Đà Nẵng, 9/2023

Nhóm O | Phân tích và thiết kế website_47K31.2

MỤC LỤC

I GIỚI THIỆU DOANH NGHIỆP 2

1 Giới thiệu chung 2

2 Mô hình kinh doanh 2

3 Đánh giá về trang web hiện tại 2

3.1 Bố cục 2

3.2 Màu sắc 3

3.3 Hình ảnh 4

3.4 Nội dung web 4

3.5 Font chữ 6

II TRIỂN KHAI KẾ H OẠCH CHO WEBSITE 6

1 Xác định mục đích và mục tiêu của trang web 6

1.1 Mục đích 6

1.2 Mục tiêu 6

1.3 Khách hàng mục tiêu 7

2 Xác định nội dung của website 8

2.1 Trang chủ 8

2.2 Trang con 9

3 Cấu trúc trang 10

3.1 Sơ đồ trang web 10

3.2 Wirefram 10

4 Chỉ định hệ thống điều hướng trang web 13

4.1 Cấu trúc điều hướng trang web 13

4.2 Links Types 13

5 Thiết kế giao diện trang web 14

5.1 Giao diện người dùng 14

5.2 Page layout 15

6 Kiểm tra, xuất bản, bảo trì 16

III ĐỀ XUẤT PHƯƠNG ÁN CẢI THIỆN 18

IV TÀI LIỆU THAM KHẢO 19

V ĐÁNH GIÁ MỨC ĐỘ ĐÓNG GÓP CỦA THÀNH VIÊN 20

Nhóm O | Phân tích và thiết kế website_47K31.2

I GIỚI THIỆU DOANH NGHIỆP

1. Giới thiệu chung

NongPro được thành lập vào cuối năm 2016 ở địa chỉ 819 Ngô Quyền, Đà Nẵng do chị

Lê Nguyễn Thị Như Nguyện đứng đầu Chị mong muốn làm cho khái niệm “Thực phẩm sạch” trở nên không còn xa lạ với người dân Việt Nam, mà trở thành văn hóa tiêu dùng

của người Việt: Trồng sạch, Bán sạch, Ăn sạch

Cửa hàng NongPro với tâm huyết đem thực phẩm sạch đến người tiêu dùng, đồng thời mong muốn góp phần phát triển nền nông nghiệp xanh của quê hương ngày một tiên tiến hơn Đến với NongPro người tiêu dùng tiếp cận được nguồn thực phẩm sạch và các mặt hàng tiêu dùng hữu cơ được nhập khẩu đạt tiêu chuẩn quốc tế

Với sứ mệnh là cam kết cung cấp những sản phẩm sạch với chất lượng cao nhất và đảm bảo an toàn cho thị trường người tiêu dùng Đà Nẵng và cả nước bằng một cái tâm trong sáng và trách nhiệm với cộng đồng Và hơn nữa là mong muốn trở thành đơn vị cung cấp thực phẩm sạch uy tín và thân thiện với người tiêu dùng Việt Nam và gần hơn là người dân

Đà Nẵng

Với triết lý vì sức khỏe cộng đồng, vì một nền nông nghiệp sạch Việt Nam Và cam kết người tiêu dùng sẽ có được nguồn thực phẩm sạch, nguồn gốc rõ ràng, đảm bảo an toàn và hàm lượng dinh dưỡng cao nhất, phục vụ tận tình, chu đáo Luôn ủng hộ, ưu tiên nhất đối với sản phẩm sạch cải thiện và bảo vệ môi trường Luôn nỗ lực đóng góp vào sự phát triển

chung cùng cộng đồng Các đối tác hợp tác cùng có lợi, minh bạch, lành mạnh

Một số kênh thông tin liên lạc:

Fanpage facebook: https://www.facebook.com/NongProDN

SĐT: 0236 3 86 66 76

Hotline: 0935 00 99 23

Địa chỉ: 819 Ngô Quyền, Phường An Hải Bắc, Quận Sơn Trà, Tp Đà Nẵng

Email: nongprodn@gmail.com

2 Mô hình kinh doanh

Nongpro chọn mô hình kinh doanh của mình là B2C - giao dịch của doanh nghiệp với người tiêu dùng, khách hàng chính của trang web là những người tiêu dùng cá nhân Họ là những người có nhu cầu cao về việc lên mạng tìm kiếm và mua sản phẩm tươi sạch, hữu cơ, phục vụ nhu cầu sử dụng, và không phát sinh thêm các giao dịch mua bán tiếp theo

3. Đánh giá v trang web hiề ện tại

3.1 B c c ố ụ

Về phần bố cục web được bố trí chưa hợp l í:

➢ Cách bố trí trang bị phân tán, không tập trung chính vào sản phẩm Điều này dễ gây rối mắt người xem và họ có thể rời trang web ngay lập tức

➢ Thông tin liên hệ để đầu trang web làm mất tầm nhìn của người xem về hình ảnh đại diện của trang web

Nhóm O | Phân tích và thiết kế website_47K31.2

➢ Thiết kế thanh điều h ến chưa phi ù hợp Cụ thể như:

• Nhiều phần trên thanh điều hướng chưa phù hợp làm ảnh hưởng tới quá trình tìm kiếm thông tin của người dùng nên lược bỏ bớt để khách hàng dễ dàng tìm kiếm thông tin mà họ cần hơn

• Mục Hỏi Đáp trên thanh điều hướng không có thông tin: Phần thông tin của khách hàng không được cập nhật trong mục Hỏi Đáp của website Do đó, khi khách hàng cần thông tin thêm về sản phẩm hay có bất cứ thắc mắc gì khác gì thì gây bất tiện rất lớn đối với người mua

3.2 Màu sắc

Về phần màu sắc chưa thu hút được người xem, kém hấp dẫn, không làm nổi bật sản phẩm:

• Độ tương phản màu sắc chưa phù hợp với sản phẩm cần quảng bá

• Trang web sử dụng màu sắc quá phổ biến và không có sự độc đáo sẽ làm cho trang web của bạn trông giống như hàng ngàn trang web khác

Too long to read on your phone? Save to

read later on your computer

Save to a Studylist

Nhóm O | Phân tích và thiết kế website_47K31.2

Nhóm O | Phân tích và thiết kế website_47K31.2

• Đa số các sản phẩm trên trang web không có thông tin mô tả sản phẩm, nhất là các sản phẩm tươi sống Điều này làm cho khách hàng khó có thể lựa chọn mua sản phẩm

•

• Mục tin tức trên trang web không được cập nhật thường xuyên, điều này làm ảnh hưởng đến chất lượng trang web, không bắt kịp với xu hướng của người dùng

Nhóm O | Phân tích và thiết kế website_47K31.2 3.5 Font ch ữ

NongPro đã sử dụng nhiều hơn 3 font chữ trong một trang và nội dung được in nghiêng

in đậm rất lộn xộn làm mất đi tính thẩm mỹ của trang web cũng như kém thu hút người xem

II TRIỂN KHAI Ế HOẠCH CHO K WEBSITE

1. Xác định mục đích và mục tiêu của trang web

➢ Cung cấp thông tin

➢ Cầu nối giữa khách hàng với doanh nghiệp

1.2. Mục tiêu

Để trở thành 1 đơn vị cung cấp thực phẩm sạch uy tín và thân thiện nhóm đã đưa ra các mục tiêu cụ thể như sau:

➢ Specific (Cụ thể):

• Tăng lượt tiếp cận khách hàng mục tiêu

• Tăng lưu lượng truy cập trang web

• Gia tăng tỉ lệ chốt đơn hàng

➢ Measurable (Có thể đo lường được):

• Số lượng người dùng tiếp cận trang web (Đơn vị: 1000 người/tuần)

• Số lượng người truy cập vào trang web đạt được 500 người/tuần

• Tỉ lệ chốt đơn đạt 50% so với số lượng truy cập trang web

➢ Attainable (Tính Khả thi):

• Với khả năng đăng tải ít nhất 2 bài viết chuẩn SEO trong 1 ngày, giải quyết vấn đề khách hàng đang quan tâm cho website, tôi muốn tăng lưu lượng khách hàng truy cập website lên 500 người/tuần

• Đưa ra các chương trình khuyến mãi thu hút khách hàng khi mua hàng trên trang web, giải quyết các vấn đề khách hàng đang gặp phải khi tương tác trên website, tương tác tích cực với khách hàng để thu hút họ

Nhóm O | Phân tích và thiết kế website_47K31.2

➢ Relevant (Tính liên quan):

• Tạo mối quan hệ tốt với khách hàng giúp tiếp cận được nhiều khách hàng tiềm năng, tăng cơ hội có thêm khách hàng mới

• Nâng cao hiệu quả marketing, tương tác khách hàng một cách chuyên nghiệp, tạo dựng được niềm tin và thương hiệu đối với khách hàng

• Tăng thêm nhiều lượt mua hàng thành công trên trang web

➢ Time (Thời hạn đạt được mục tiêu): Thời gian bắt đầu thực hiện 1/10/2023 và thực hiện trong vòng 3 tháng

• Hành vi sử dụng:

• Thường xuyên sử dụng các sản phẩm hữu cơ, bảo vệ môi trường

• Tần suất sử dụng: Đối tượng khách hàng mục tiêu của NongPro thường sử dụng thực phẩm tươi, sạch hằng ngày cho mỗi bữa ăn

➢ Tâm lý: Đối tượng khách hàng mục tiêu của NongPro thuộc nhóm tính cách cẩn thận, chu đáo, nhạy cảm, thích sử dụng các sản phẩm hữu cơ, tươi, sạch

Theo báo vneconomy, Thương mại điện tử tiếp tục là một trong những điểm sáng trong phát triển kinh tế số với tốc độ tăng trưởng cao (20%) năm 2022 Dự kiến con số này sẽ đạt 20,5

tỷ USD trong năm 2023, tăng khoảng 4 tỷ USD, tăng 25% so với năm trước

=> Điều đó chứng tỏ rằng, những sàn thương mại thương m điện tử như Nongpro cại ó cơ hội rất lớn trong việc phát triển thị trường, gia tăng thu cấp và tiếp cận được nh ều ki hách hàng

h ơn

Nhóm O | Phân tích và thiết kế website_47K31.2

Tóm lại, khách hàng mục tiêu của Nongpro là nh ng ngữ ười có xu hướng quan tâm đến

sức khỏe có mức thu cập khá, từ độ tuổi 25 50 – tuồi ống tập tr s ung ở Đà Nẵng

2 Xác định nội dung của website

2.1 T ng ch ra ủ

➢ Trang chủ (Homepage): Trang chủ là trang đầu tiên khi người dùng truy cập vào website của Nongpro Bao gồm các sản phẩm chính của trang web,

Trang chủ của Nongpro gồm có:

➢ Phần header : Cố định, giúp người dùng dễ dàng điều hướng thông tin dù ở bất kì

vị trí nào trên trang web, bao gồm:

• Logo của thương hiệu giúp tăng độ nhận diện thương hiệu

• Hộp tìm kiếm giúp người dùng tìm kiếm thông tin mình mong muốn một

cách nhanh chóng

• Thanh menu điều hướng gồm: Trang chủ, giới thiệu ,sản phẩm, chính sách, tin tức, tra cứu đơn

• Giỏ hàng Giúp người dùng quản lý các sản phẩm mà họ thêm vào

• Đăng nhập/Đăng ký: Yêu cầu người dùng đăng nhập hoặc đăng ký thành

viên

➢ Phần content gồm: văn bản và hình ảnh

• Văn bản: Là những đoạn thông tin chủ yếu mô tả sản phẩm của website

nhằm cung cấp thông tin cho người xem

Nhóm O | Phân tích và thiết kế website_47K31.2

• Hình ảnh: Hình ảnh liên quan đến các sản phẩm mà website đang phục vụ

khách hàng

➢ Tin tức/Blog: phần này chứa các bài viết, blog hoặc thông tin mới nhất liên quan

đến sản phẩm của trang web Nó có thể được tổ chức thành danh mục, thẻ, hoặc bài viết được sắp xếp theo thời gian hoặc chủ đề

➢ Animations: Video bao gồm 1 loạt hình ảnh các sản phẩm hữu cơ chuyển động với các hiệu ứng khác nhau, giúp trang web trở nên sống động, hấp dẫn hơn

➢ Phần biểu tượng: Biểu tượng của web chính là : mũi tên di chuyển nhanh và hộp

tin nhắn Người dùng có thể trực tiếp click vào biểu tượng messenger để trò chuyện với trợ lý bán hàng nếu có bất kỳ thắc mắc hay câu hỏi nào muốn giải đáp Ngoài

ra mũi tên di chuyển nhanh giúp người dùng trỏ về đầu trang dễ dàng, nhanh chóng

mà không phải cuộn thanh lên xuống

➢ Phần Footer: danh mục web nằm ở chân trang, đây cũng là vị trí hiển thị các thành

phần như thông tin bản quyền website, các liên kết chính, liên kết xã hội( instagram, facebook, ), thông tin liên hệ, chính sách và điều khoản khác, Nên chú trọng về phần này để tạo uy tín doanh nghiệp và tăng tính chuyên nghiệp cho website

2.2 Trang con

➢ Trang con được tạo ra để giúp người truy cập có nhiều thông tin chi tiết hơn về các danh mục lớn ở phần trang chủ Các trang con của Nông Pro gồm có:

➢ Trang giới thiệu: Cung cấp được thông tin cơ bản về doanh nghiệp, tạo sự tin

tưởng cho người dùng khi mua hàng

➢ Trang sản phẩm: Những sản phẩm được bán đều tập trung tại đây, với nhiều danh

mục loại hàng khác nhau, đa dạng về sản phẩm, số lượng cũng như về giá

➢ Trang chính sách: Cung cấp thông tin chi tiết về các chính hoàn trả sản phẩm

➢ Trang tin tức: Các bài viết nói về sản phẩm, công dụng và chức năng của chúng

sẽ được Nông Pro đặt vào trang con này, để giúp trải nghiệm mua hàng được nâng cao, có thể chọn được những gì mà người mua đang cần với tư liệu, nguồn tham khảo chuẩn

➢ Tra cứu đơn: Tổng hợp các thông tin về các đơn hàng đã mua và các sản phẩm

còn đang nằm trong giỏ hàng chờ thanh toán

Nhóm O | Phân tích và thiết kế website_47K31.2

3. Cấu trúc trang

3.1 S ơ đồ trang web

3.2 Wirefram

Nhóm O | Phân tích và thiết kế website_47K31.2

Nhóm O | Phân tích và thiết kế website_47K31.2

Nhóm O | Phân tích và thiết kế website_47K31.2

4 Ch nh h ỉ đị ệ thống điều hướng trang web

4.1 C u trúc ấ điều hướng trang web

➢ Là cách mà các trang và nội dung trên trang web được tổ chức và liên kết với nhau

để tạo ra một trải nghiệm người dùng liền mạch và dễ dàng trong việc điều hướng trang web Điều này đảm bảo rằng người dùng có thể dễ dàng tìm kiếm thông tin và truy cập vào các nội dung mà họ quan tâm

➢ Website thuộc ệ thống điều hướng dựa trên người dùngh

4.2 Links Types

• Text links: là liên kết được hiển thị dưới dạng văn bản màu xanh và có gạch chân bên dưới Khi nhấp chuột vào text links có thể dẫn đến một trang web mới

• Related link groups: là cách tổ chức liên kết theo nhóm có liên quan đến nhau thay

vì nhóm riêng lẻ Ví dụ như nhóm danh mục sản phẩm sẽ sắp xếp các liên kết liên quan thành danh sách đứng như trái cây, thịt, rau củ, sản phẩm hữu cơ,

Nhóm O | Phân tích và thiết kế website_47K31.2

• Breadcrumb trails: là một phần của giao diện người dùng trên các trang web, thường được hiển thị ở đầu trang hoặc ở trên cùng của trang Chúng cung cấp cho người dùng một hệ thống đường dẫn để biết vị trí hiện tại của họ trong cấu trúc trang web

• Search capability (khả năng tìm kiếm): Thanh điều hướng tìm kiếm giúp người

5 T hiết kế giao diện trang web

5.1. Giao diện người dùng

➢ Font chữ và kiểu chữ: Nongpro chọn Font Arial làm font chính cho trang web của

mình Đây là một loại font chữ không chân chúng thường được sử dụng cho các web bán hàng mang phong cách sang trọng, hiện đại

Nhóm O | Phân tích và thiết kế website_47K31.2

➢ Bảng màu: Sử dụng màu xanh lá màu chủ đạo mang lại cảm giác tươi mới, tích cực

cho người dùng khi vào trang web Nó cũng thể hiện đúng các sản phẩm trang web mang lại là các sản phẩm tươi, sạch, thiên nhiên

5.2 Page layout

Dành cho máy tính:

Nhóm O | Phân tích và thiết kế website_47K31.2

Dành cho điện thoại:

6. Kiểm tra, xuất bản, bảo trì

➢ Kiểm tra: Sau khi hoàn thành trang web, chúng ta cần kiểm tra các yếu tố sau trước khi

phát hành trang web đó ra ngoài:

• Kiểm tra thiết kế: Kiểm tra chất lượng hình ảnh, font chữ, màu sắc, logo thương hiệu

Nhóm O | Phân tích và thiết kế website_47K31.2

• Kiểm tra chức năng: Kiểm tra các tính năng giỏ hàng, thanh toán (nếu có), tính năng đăng nhập, đăng ký

• Kiểm tra các liên kết Các liên kết điều hướng trên Menu chính, liên kết ở cuối : trang, Liên kết mạng xã hội (Facebook, Twitter, v.v.), Logo (thường là liên kết đến trang chủ)

• Kiểm tra nội dung: Kiểm tra các lỗi chính tả, ngữ pháp

• Kiểm tra khả năng xuất hiện của trang web trên các trình duyệt: Chrome, Safari, và trên các thiết bị : điện thoại, laptop,

➢ Xuất bản:

• Xuất bản trang web: lựa chọn domain (tên miền) và hosting

• Duy trì trang web:

• Cập nhật nội dung: Những từ khoá mới cần được nghiên cứu trước khi cập nhật nội dung mới Điều này sẽ giúp nâng cao lượng traffic và thứ hạng bởi vì người truy cập sẽ có nhiều “con đường” để đến với site dựa trên những từ khoá mà họ nhập vào các công cụ tìm kiếm Nội dung càng phong phú, cơ hội tiếp cận người dùng của website càng cao

• Quản lý thứ hạng trên công cụ tìm kiếm: một site cần phải quản lý thứ hạng của mình trên các công cụ tìm kiếm để tạo được lợi thế cạnh tranh so với đối thủ, giúp người truy cập tìm kiếm được trang web của mình đầu tiên khi tìm kiếm thông tin,

“vượt mặt” đối thủ cạnh tranh để đánh dấu vị trí của mình trong lòng người dùng

• Tăng mức độ phổ biến liên kết: duy trì những liên kết chất lượng trỏ đến trang Những liên kết càng chất lượng, càng có cơ hội được rank cao trên các công cụ tìm kiếm chính

➢ Bảo trì:

• Cập nhật phần mềm: bảo vệ trang web khỏi các lỗ hổng bảo mật và giúp trang web hoạt động tốt hơn Có thể cập nhật các phần mềm hệ thống như WordPress, Joomla, Drupal hay các phần mềm bảo mật như SSL hay firewall lên phiên bản mới nhất

để tránh tình trạng bảo mật bị tấn công.lỗi xảy ra khi mã HTML, CSS hoặc JavaScript của trang web không đúng cú pháp

• Sữa chữa lỗi: Lỗi cú pháp (lỗi xảy ra khi mã HTML, CSS hoặc JavaScript của trang web không đúng cú pháp); lỗi kỹ thuật lỗi liên quan đến phần mềm hoặc cấu hình (máy chủ); lỗi tương tác người dùng liên quan đến giao diện người dùng của trang (web, bao gồm các liên kết không hoạt động, các trang không tải được hoặc các biểu mẫu không hoạt động) Cần sửa chữa các lỗi như trên để tránh việc gây ra sự

cố và làm giảm trải nghiệm của người dùng

• Theo dõi hiệu suất: để biết được trang web đang hoạt động như thế nào và giúp tìm

ra các vấn đề về hiệu suất để giải quyết chúng, bao gồm: theo dõi tốc độ tải trang