Website cung cấp thông tin du lịch ẩm thực Tây Bắc | Báo cáo bài tập lớn học phần Thiết kế Web | Trường Đại học Phenikaa

BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC PHENIKAA BÀI TẬP LỚN
TÊN HỌC PHẦN: THIẾT KẾ WEB
ĐỀ TÀI: WEBSITE CUNG CẤP THÔNG TIN DU LỊCH ẨM THỰC TÂY BẮC Điểm Mã Sinh STT Họ và Tên
Ngày Sinh Bằng Bằng Viên Số Chữ 1
22012874 Ngô Trần Hoài Thương 10/10/2004
CÁN BỘ CHẤM THI Hà Nội, năm 2024 3 LỜI NÓI ĐẦU
Ẩm thực Tây Bắc là một bức tranh đầy màu sắc, là sự kết hợp hài hòa giữa hương vị của
núi rừng và bàn tay tài hoa của con người nơi đây. Khác với sự tinh tế, cầu kỳ của ẩm thực
miền Nam hay sự thanh tao của ẩm thực miền Bắc, ẩm thực Tây Bắc mang một nét đặc
trưng riêng, hoang sơ, mộc mạc nhưng đầy ấn tượng. Nét đặc trưng đầu tiên của ẩm thực
Tây Bắc chính là sự đa dạng trong nguyên liệu. Nơi đây được thiên nhiên ưu ái ban tặng cho
nguồn tài nguyên phong phú với các loại rau rừng, nấm, măng,... cùng với các loại thịt gia
súc, gia cầm được chăn thả tự nhiên. Chính sự đa dạng này đã tạo nên một kho tàng món ăn
vô cùng phong phú, độc đáo.
Ẩm thực Tây Bắc không chỉ là những món ăn ngon mà còn là nét văn hóa đặc trưng của
con người nơi đây. Mỗi món ăn đều mang trong mình một câu chuyện, một ý nghĩa riêng,
thể hiện sự gắn bó của con người với thiên nhiên, với núi rừng Tây Bắc. Đến với Tây Bắc,
du khách không chỉ được chiêm ngưỡng cảnh đẹp hùng vĩ mà còn có cơ hội thưởng thức
những món ăn độc đáo, mang đậm hương vị núi rừng. Ẩm thực Tây Bắc sẽ là một trải
nghiệm khó quên, níu chân du khách và khiến họ muốn quay trở lại mảnh đất này thêm nhiều lần nữa. Nhóm 7 Page 3 4 MỤC LỤC CHƯƠNG 1.TỔNG QUAN
1.1. Giới thiệu về đề tài ...................................................................................................... 9
1.1.1. Mục tiêu: ................................................................................................................ 9
1.1.2. Phân khúc khách hàng: ........................................................................................ 9
1.1.3. Nội dung chính: ..................................................................................................... 9
1.2. Lý do chọn đề tài ...................................................................................................... 10
1.2.1. Tính thiết thực: .................................................................................................... 10
1.2.2. Lợi ích: ................................................................................................................. 10
1.2.3. Tính khả thi: .........................................................................................................11
1.2.4. Tính sáng tạo: .......................................................................................................11
1.3. Ý nghĩa đề tài ..............................................................................................................11
1.3. 1. Giới thiệu và quảng bá du lịch ẩm thực Tây Bắc: .............................................11
1.3. 2. Nâng cao trải nghiệm du lịch ẩm thực Tây Bắc: ...............................................11
1.3. 3. Góp phần bảo tồn và phát huy giá trị văn hóa, ẩm thực Tây Bắc: .................. 12
1.3. 4. Lợi ích cho các bên liên quan: .......................................................................... 12
1.3. 5. Tính sáng tạo và khả thi: ................................................................................... 12
CHƯƠNG 2. PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG ...................................... 12
2.1. Phân tích và xác định yêu cầu .................................................................................. 12
2.1.1. Giao diện: ............................................................................................................. 12
2.1.2. Chức năng: .......................................................................................................... 13
2.2. Công nghệ sử dụng .................................................................................................... 13
2.2.1 HTML .................................................................................................................... 13
2.2.2 CSS ........................................................................................................................ 14 Nhóm 7 Page 4 5
2.2.3 JAVASCRIPT ........................................................................................................ 14
CHƯƠNG 3. THIẾT KẾ GIAO DIỆN VÀ CHỨC NĂNG TỪNG TRANG ....... 15
3.1 Trang đăng nhập ........................................................................................................ 15
3.2 Trang chủ .................................................................................................................... 16
3.3 Form tìm kiếm tour .................................................................................................... 16
3.4 Trang giới thiệu tour .................................................................................................. 17
3.5 Trang danh sách tour ................................................................................................. 17
3.6 Trang chi tiết tour ....................................................................................................... 18
3.7 Trang liên hệ ............................................................................................................... 22
3.8 Chân Trang ................................................................................................................. 23 Nhóm 7 Page 5 6
MỤC LỤC HÌNH ẢNH
Hình 3.1. Giao diện đăng nhập..............................................................................................15
Hình 3.2 Giao diện trang chủ................................................................................................16
Hình 3.3 Form tìm kiếm tour.................................................................................................16
Hình 3.4 Giao diện giới thiệu một số tour du lịch.................................................................17
Hình 3.5a , 3.5b , 3.5c Danh sách tour..................................................................................18
Hình 3.6 Giao diện tour chi tiết.............................................................................................22
Hình 3.7 Trang liên hệ.........................................................................................................22
Hình 3.8 Chân trang.............................................................................................................23 Nhóm 7 Page 6 7 MỤC LỤC BẢNG Nhóm 7 Page 7 8
BẢNG CÁC TỪ VIẾT TẮT (Nếu có) STT TỪ VIẾT TẮT VIẾT ĐẦY ĐỦ 1 CSDL Cơ sở dữ liệu 2 Nhóm 7 Page 8 9 CHƯƠNG 1.TỔNG QUAN
1.1. Giới thiệu về đề tài
1.1.1. Mục tiêu: •
Xây dựng website giới thiệu tour du lịch ẩm thực Tây Bắc chuyên nghiệp, thu hút du khách. •
Cung cấp thông tin đầy đủ, chi tiết về các tour du lịch ẩm thực Tây Bắc, giúp du
khách dễ dàng lựa chọn tour phù hợp. •
Tạo trải nghiệm dễ dàng và tiện lợi cho du khách trong việc đặt tour du lịch ẩm
thực Tây Bắc trực tuyến. •
Quảng bá du lịch ẩm thực Tây Bắc đến du khách trong và ngoài nước.
1.1.2. Phân khúc khách hàng: •
Du khách quan tâm đến du lịch ẩm thực Tây Bắc. •
Du khách muốn tìm hiểu thông tin về các tour du lịch ẩm thực Tây Bắc. •
Du khách muốn đặt tour du lịch ẩm thực Tây Bắc trực tuyến. •
Du khách muốn tìm hiểu về văn hóa, phong tục tập quán của người dân Tây Bắc.
1.1.3. Nội dung chính: •
Trang chủ: Giới thiệu website, các tour du lịch ẩm thực nổi bật, tin tức du lịch ẩm thực Tây Bắc. •
Giới thiệu tour: Danh sách các tour du lịch ẩm thực Tây Bắc, thông tin chi tiết về
từng tour (điểm tham quan, lịch trình, giá cả, dịch vụ đi kèm). •
Lựa chọn tour: Chức năng lọc tour theo sở thích, ngân sách, thời gian. •
Đặt tour: Hỗ trợ du khách đặt tour trực tuyến: đơn giản, nhanh chóng, an toàn. •
Thanh toán: Tích hợp các cổng thanh toán trực tuyến uy tín. •
Tư vấn du lịch: Cung cấp thông tin hữu ích về du lịch ẩm thực Tây Bắc (visa, văn hóa, ẩm thực,...). •
Blog du lịch: Chia sẻ kinh nghiệm du lịch ẩm thực Tây Bắc. Nhóm 7 Page 9 10 •
Hỗ trợ khách hàng: Giải đáp thắc mắc, hỗ trợ du khách trong quá trình sử dụng website.
1.2. Lý do chọn đề tài
1.2.1. Tính thiết thực: •
Nhu cầu du lịch ẩm thực Tây Bắc ngày càng tăng: Tây Bắc là một điểm đến du
lịch hấp dẫn với nhiều món ăn độc đáo, mang đậm hương vị núi rừng. Nhu cầu
tìm kiếm thông tin và đặt tour du lịch ẩm thực Tây Bắc trực tuyến của du khách cũng ngày càng cao. •
Website giới thiệu tour du lịch ẩm thực Tây Bắc sẽ đáp ứng nhu cầu này: Website
sẽ cung cấp thông tin đầy đủ, chi tiết về các tour du lịch ẩm thực Tây Bắc, giúp du
khách dễ dàng lựa chọn tour phù hợp và đặt tour trực tuyến một cách nhanh chóng, tiện lợi.
1.2.2. Lợi ích: • Lợi ích cho du khách:
o Tiết kiệm thời gian và công sức trong việc tìm kiếm thông tin và đặt tour
du lịch ẩm thực Tây Bắc.
o Có được trải nghiệm du lịch ẩm thực Tây Bắc tốt nhất với sự lựa chọn tour
phù hợp và dịch vụ chuyên nghiệp. •
Lợi ích cho các công ty du lịch, lữ hành:
o Quảng bá tour du lịch ẩm thực Tây Bắc đến du khách trong và ngoài nước một cách hiệu quả.
o Tăng doanh thu và lợi nhuận.
o Nâng cao hình ảnh và uy tín của công ty. •
Lợi ích cho ngành du lịch Tây Bắc:
o Thu hút du khách đến Tây Bắc du lịch. o Thúc đẩy du lịch ẩm thực Tây
Bắc phát triển. o Góp phần bảo tồn và phát huy giá trị văn hóa, ẩm thực của Tây Bắc. Nhóm 7 Page 10 11
1.2.3. Tính khả thi: •
Có đủ nguồn thông tin: Có nhiều nguồn thông tin về các tour du lịch ẩm thực Tây
Bắc, văn hóa, phong tục tập quán của người dân Tây Bắc để xây dựng website. •
Có đủ công nghệ: Có nhiều công nghệ web tiên tiến để xây dựng website với giao
diện đẹp mắt, thu hút, dễ sử dụng và hoạt động ổn định. •
Có đội ngũ nhân lực: Có nhiều đội ngũ nhân lực có trình độ chuyên môn cao để xây dựng website.
1.2.4. Tính sáng tạo: •
Website có thể được thiết kế với nhiều chức năng sáng tạo như hệ thống đánh giá
tour du lịch, blog du lịch, chatbot hỗ trợ khách hàng,... •
Website có thể được tích hợp với các công nghệ mới như AI, VR để mang lại trải
nghiệm du lịch ẩm thực Tây Bắc tốt nhất cho du khách.
1.3. Ý nghĩa đề tài
1.3. 1. Giới thiệu và quảng bá du lịch ẩm thực Tây Bắc: •
Website giới thiệu tour du lịch ẩm thực Tây Bắc là một kênh thông tin hiệu quả để
giới thiệu và quảng bá du lịch ẩm thực Tây Bắc đến du khách trong và ngoài nước. •
Website cung cấp thông tin đầy đủ, chi tiết về các tour du lịch ẩm thực Tây Bắc,
giúp du khách dễ dàng lựa chọn tour phù hợp và có kế hoạch du lịch Tây Bắc hiệu quả. •
Website góp phần thu hút du khách đến Tây Bắc du lịch, góp phần thúc đẩy du
lịch ẩm thực Tây Bắc phát triển.
1.3. 2. Nâng cao trải nghiệm du lịch ẩm thực Tây Bắc: •
Website giới thiệu tour du lịch ẩm thực Tây Bắc giúp du khách tiết kiệm thời gian
và công sức trong việc tìm kiếm thông tin và đặt tour du lịch ẩm thực Tây Bắc. •
Website giúp du khách dễ dàng lựa chọn tour phù hợp với nhu cầu và sở thích của mình. Nhóm 7 Page 11 12 •
Website cung cấp cho du khách các thông tin hữu ích về du lịch ẩm thực Tây Bắc
như văn hóa, lịch sử, ẩm thực,... giúp du khách có được trải nghiệm du lịch ẩm
thực Tây Bắc tốt nhất.
1.3. 3. Góp phần bảo tồn và phát huy giá trị văn hóa, ẩm thực Tây Bắc: •
Website giới thiệu tour du lịch ẩm thực Tây Bắc giúp du khách hiểu biết hơn về
văn hóa, ẩm thực Tây Bắc. •
Website góp phần bảo tồn và phát huy các giá trị văn hóa, ẩm thực Tây Bắc.
1.3. 4. Lợi ích cho các bên liên quan: •
Website giới thiệu tour du lịch ẩm thực Tây Bắc mang lại lợi ích cho nhiều bên
liên quan như du khách, các công ty du lịch, lữ hành, ngành du lịch Tây Bắc,... •
Website giúp các bên liên quan tăng doanh thu và lợi nhuận, nâng cao hình ảnh và uy tín.
1.3. 5. Tính sáng tạo và khả thi: •
Website có thể được thiết kế với nhiều chức năng sáng tạo và có tính khả thi cao. •
Website có thể được tích hợp với các công nghệ mới để mang lại trải nghiệm du
lịch ẩm thực Tây Bắc tốt nhất cho du khách.
CHƯƠNG 2. PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG
2.1. Phân tích và xác định yêu cầu
2.1.1. Giao diện: •
Đẹp mắt, thu hút: Sử dụng hình ảnh đẹp, bố cục hợp lý, màu sắc hài hòa, phù hợp với văn hóa Tây Bắc. •
Dễ sử dụng: Menu rõ ràng, dễ tìm kiếm thông tin. •
Phù hợp với thị hiếu du khách quốc tế: Hỗ trợ đa ngôn ngữ, giao diện thân thiện
với người dùng quốc tế. Nhóm 7 Page 12 13 •
Phù hợp với các thiết bị di động: Website hiển thị tốt trên các thiết bị di động như smartphone, tablet.
2.1.2. Chức năng: •
Giới thiệu tour: Cung cấp thông tin đầy đủ, chi tiết về các tour du lịch ẩm thực
Tây Bắc như điểm tham quan, lịch trình, giá cả, dịch vụ đi kèm. •
Lựa chọn tour: Cho phép du khách lọc tour theo sở thích, ngân sách, thời gian. •
Đặt tour: Hỗ trợ du khách đặt tour trực tuyến một cách đơn giản, nhanh chóng, an toàn. •
Thanh toán: Tích hợp các cổng thanh toán trực tuyến uy tín. •
Tư vấn du lịch: Cung cấp thông tin hữu ích về du lịch ẩm thực Tây Bắc như visa, văn hóa, ẩm thực,... •
Blog du lịch: Chia sẻ kinh nghiệm du lịch ẩm thực Tây Bắc. •
Hỗ trợ khách hàng: Giải đáp thắc mắc, hỗ trợ du khách trong quá trình sử dụng website.
2.2. Công nghệ sử dụng 2.2.1 HTML
HTML là viết tắt của HyperText Markup Language, là ngôn ngữ lập trình cơ bản để
tạo cấu trúc và nội dung cho website. HTML sử dụng các thẻ để định dạng văn bản, hình
ảnh, video, liên kết,... và chia website thành các khu vực chức năng khác nhau.
Lợi ích của HTML với đề tài : •
Cấu trúc website: HTML giúp tạo khung sườn cho website, bao gồm các khu vực như
header, main content, sidebar và footer. •
Thêm nội dung: HTML giúp thêm văn bản, hình ảnh, video, liên kết,... vào website. •
Tạo bố cục cơ bản: HTML chia website thành các khu vực chức năng khác nhau. •
Dễ học và sử dụng: HTML có cú pháp đơn giản, dễ học và sử dụng. •
Tương thích với nhiều trình duyệt: HTML được hỗ trợ bởi tất cả các trình duyệt web phổ biến. Nhóm 7 Page 13 14 2.2.2 CSS
CSS là viết tắt của Cascading Style Sheets, là ngôn ngữ lập trình dùng để thiết kế
giao diện website. CSS giúp định dạng màu sắc, font chữ, kích thước, vị trí các element trên
website, tạo hiệu ứng và nâng cao tính thẩm mỹ cho website.
Lợi ích của CSS với đề tài: •
Thiết kế giao diện: CSS giúp website có giao diện đẹp mắt, thu hút và ấn tượng. •
Tạo hiệu ứng: CSS thêm các hiệu ứng đẹp mắt cho website như hover, animation,... •
Nâng cao tính thẩm mỹ: CSS giúp website thu hút và ấn tượng hơn. •
Dễ học và sử dụng: CSS có cú pháp đơn giản, dễ học và sử dụng.
2.2.3 JAVASCRIPT
JavaScript là ngôn ngữ lập trình được sử dụng để thêm các chức năng tương tác cho
website, giúp website trở nên sống động và hấp dẫn hơn. JavaScript có thể được sử dụng để: •
Tạo các hiệu ứng động như thanh trượt, pop-up, animation,... •
Xử lý dữ liệu người dùng như nhập liệu, click chuột,... •
Phát triển các ứng dụng web như hệ thống đặt tour du lịch, hệ thống thanh toán trực tuyến,...
Lợi ích của JavaScript với đề tài : •
Tăng tính tương tác: JavaScript giúp website có nhiều chức năng tương tác, thu hút du khách sử dụng. •
Cung cấp trải nghiệm cá nhân hóa: JavaScript có thể được sử dụng để cá nhân hóa
website theo nhu cầu và sở thích của từng du khách. •
Phát triển các ứng dụng web: JavaScript có thể được sử dụng để phát triển các ứng
dụng web nâng cao cho website du lịch. •
Dễ học và sử dụng: JavaScript có cú pháp tương đối đơn giản, dễ học và sử dụng. Nhóm 7 Page 14 15
CHƯƠNG 3. THIẾT KẾ GIAO DIỆN VÀ CHỨC NĂNG TỪNG TRANG
3.1 Trang đăng nhập
Hình 3.1. Giao diện đăng nhập Nhóm 7 Page 15 16 3.2 Trang chủ
Hình 3.2 Giao diện trang chủ
3.3 Form tìm kiếm tour
Hình 3.3 Form tìm kiếm tour Nhóm 7 Page 16 17
3.4 Trang giới thiệu tour
Hình 3.4 Giao diện giới thiệu một số tour du lịch
3.5 Trang danh sách tour Nhóm 7 Page 17 18
Hình 3.5a , 3.5b , 3.5c Danh sách tour
3.6 Trang chi tiết tour Nhóm 7 Page 18 19 Nhóm 7 Page 19 20 Nhóm 7 Page 20 21 Nhóm 7 Page 21