đồ án môn học thiết kế và lập trình web kinh doanh 1 xây dựng trang web giải trí

Trang 1

TRUONG DAI HOC KINH TE - LUAT

KHOA TIN HQC QUAN LY

Ss

DO AN MON HOC THIET KE & LAP TRINH WEB KINH DOANH 1

XAY DUNG TRANG WEB GIAI TRI

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

ThS Hồ Trung Thành CH Trần Thị Ánh

Sinh viên thực hiện:

Vạn Thị Kim Chỉ (K084061039)

Trần Dương Minh Chuyên (K084061040) Lê Thị Kim Hiền (K084061055)

Châu Thanh Tùng (K084061134)

Thành phố Hồ Chí Minh, năm 2010

Trang 2

MUC LUC

trang

Chuong 1: QUA TRINH XAY DUNG TRANG WEB

I Lựa chọn đề tài 3

II Khảo sát và đánh giá Website 3

1 Khảo sát hiện trạng 2 Đánh giá Website

3 Điểm tương đồng và điểm nổi bật của trang web nhóm

Ill Cac giai đoạn xây dựng Website 7

1 Thiết kế bằng HTML

2 Thiết kế bang JAVASCRIPT

3 Thiét ké bang ASP, JAVASCRIPT két nối với cơ sở dữ liệu

IV Những khó khăn và thuận lợi khi thực hiện trang Web 14

1 Khó khăn 2 Thuận lợi

Chuong 2: GIOI THIEU TONG QUAN VA HUONG DAN SU DUNG WEBSITE

I Giới thiệu trang Web 16

1 Cấu trúc tổng quan của Website

2 Giới thiệu chỉ tiết từng trang Web

Trang 3

Chuong 1:

QUA TRINH XAY DUNG TRANG WEB

I LUA CHON DE TAI:

Việt Nam là 1 nước có 60% dân số là người trẻ ở độ tuổi dưới 30 Xu hướng thói quen xem tivi, đọc sách trong thanh niên trước kia giờ đã giảm, mà thay vào đó là sự gia tăng của việc thích chơi game và lướt net Không giống như trước đây khi muốn nghe nhạc,xem phim hay tìm kiếm thơng tin người ta phải nghe qua radio, truyền hình hoặc cần thơng tin trên sách báo Ngày nay, công nghệ thông tin phát triển, một người tiêu dùng biết sử dụng internet có thê truy cập vào các website để thư giãn, giải trí Chúng ta có thể kể đến các trang web giải trí đang được nhiều bạn trẻ yêu thích hiện nay như : kenh14.vn, mp3.zing.vn, Nhận thấy tầm quan trọng trong việc cung cấp thông tin đáp ứng nhu cầu giải trí của người dùng, nhóm đã chọn dé tài :Thiết kế một website cung cấp thông tin giải trí bao gồm các chuyên mục: du lịch, đọc truyện, xem phim, âm thực, nghe nhạc

Il KHAO SAT VA DANH GIA WEBSITE:

1 Khảo sát hiện trang:

Hiện nay, các website giải trí tồn tại khá nhiều nhưng hầu hết chưa cung cấp đủ các loại hình giải trí cho giới trẻ mà thường là thiên về một mặt nào đó VD: trang web chuyên về nghe nhạc, trang web chuyên về xem phim Điều này gây khơng ít khó khăn cho người sử dụng khi muốn xem phim thì phải nhớ địa chỉ trang web này, muốn nghe nhạc thì phải tìm đến trang web kia Vì vậy, việc đưa ra một trang web cung cấp nhiều chuyên mục thông tin thiên về giải trí là vô cùng cần thiết

Trong quá trình khảo sát các trang web được nhiều bạn trẻ ưa chuộng hiện nay, nhóm đã quyết định chọn website http://kenh14.vn để tham khảo về mặt thiết kế giao diện và các chuyên mục nội dung

2 Đánh giá website:

Trang 4

Hinh 1

Menu chính của website được đặt nằm ngang ở phía trên, sử dụng hiệu màu sắc rất đẹp nồi bật, thuận tiện cho ngưới sử dụng Ở bắt kì vị trí nào trong trang web người sử dụng cũng có thể quay lại trang chủ hay bất cứ vị trí nào mà họ muốn

Nội dung từng chuyên mục được bồ trí logic rõ ràng,người đùng có thể nhìn bao quát được những nội dung mà trang web muốn truyền đạt (Hình 2)

WT nSeỂ (all, spteesen wets ©) teahis | cin thengem teh oh

Sex —— “muzik li cà (ax 5 Tae THỊ vào Ben thân tệ E

*Baghia" style teane r1 nen tt tí

cng wrt eaireta nữhep =a suerte fs a {

Trang 5

3 Điểm tương đồng và những ưu điểm nối bật của trang web nhóm so với

kenh14.vn:

a Tương đồng:

-Mục tiêu: thiết kế một website phục vụ nhu cầu giải trí cho người dùng -Giao diện:

+ Thanh menu ngang nằm cố định ở trên (Hình 3)

Be arent (as on inven mat

nero fe oI $e KT Hình 3

Trang 6

cera

= Or as

@rc =] Gre rsaigy sangre)

N=- O° [eters] is b Điểm nổi bật khác: -Giao diện:

+Thanh menu ngang phía trên khi trỏ tới sẽ hiển thị đầy đủ tất cả các danh mục của chuyên mục đó, tạo sư thuận tiện cho người dùng (Hình 5)

Bienen) Am nhạc Phim truyện Du lịch Đọc truyện KT Âm thực Liên hệ Danh lam thắng cảnh Văn hóa - Lễ hội Tour du lịch Cam nang

Hình 5

+Ln hiển thị những nội dung mới nhất được cập nhật và những nội dung được xem nhiều nhất

+Không đưa vào quá nhiều hình quảng cáo như kenh14.vn để tránh làm rối mắt người sử dụng

-Nội dung:

+Chuyên mục nghe nhạc, xem phim cho phép người dùng có thể nghe xem trực tiếp, khác han với kenh14.vn chỉ dừng ở việc cung cấp thông tin

Trang 7

-Đối tượng : nếu như đối tượng sử dụng của kenh14.vn là hướng đến giơi trẻ thì trang web giải trí của nhóm muốn hướng đến nhiều nhóm đối tượng khác nhau: giới trẻ, trung niên, vì vây các chuyên mục được thiết kế phù hợp đề tất cả các đối tượng trên đều hài lòng

HI CÁC GIAI ĐOẠN XÂY DỰNG WEBSITE:

1 Thiết kế bằng HTML:

- Trang chủ: Logo của nhóm, tên nhóm, tên trang web và background được thiết kế bằng công cụ Photoshop Thanh menu ngang phía trên được viết bằng CSS (code chi tiết xem trong file trangchu.css) Công cụ tìm kiếm sẽ giúp người dùng tìm thấy những thơng tin hữu ích từ người “khổng lồ” Google, tạo sự thuận tiện cho người sử dụng Khung hình của nhóm ở giữa được xây dựng bằng flash, do nhóm tự thiết kế Tất cả các khung nội dung và tin tức khác được canh chỉnh bằng CSS và thiết kế tĩnh bằng HTML vì trang chủ được xây dựng từ giai đoạn đầu tiên, những trang khác được nâng lên thành trang asp dé tai được những nguồn thông tin phong phú khác nhau (sẽ được

nêu chỉ tiết ở phần Thiết kế bằng ASP)

- Trang đăng ký, đăng nhập và liên hệ: cũng được thiết kế thơng qua ngơn ngữ chính là HTML Trang đăng ký và đăng nhập chủ yếu lầy thông tin truyền vào từ phía người dùng nên cần có giao diện đơngiản, dễ sử dụng, không gây nhằm lẫn giữa các yêu cầu nhập liệu khác nhau Trang liên hệ hiển thị thông tin cá nhân của nhóm và các thành viên trong nhóm, giao diện cần sinh động, đẹp mắt và phù hợp với toàn trang web - HTML là một ngôn ngữ cơ bản hình thành nên trang web do đó nó không chỉ được sử dụng để thiết kế một vài trang đã nêu trên, mà nó được sử dụng xuyên suốt trong tồn bộ q trình xây dựng trang web Vì thế, trong những giai đoạn tiếp theo đây của quá trình thiết kế, ngôn ngữ HTML vẫn được sử dụng và đóng một vai trị quan trọng

nhưng sẽ ít được đề cập đến 2 Thiết kế bằng JAVASCRIPT:

- Ding Javascript dé hiển thị thứ, ngày, tháng và giờ hiện tại (bằng tiếng Việt), đặt phía cuối ở tất cả các trang web

function start()

{

Trang 8

var arrday = new Array("'Chi Nhat", "Thi Hai", "Thi Ba", ''Thứ Tư", "Thứ Năm", "Thứ Sáu'"', "Thứ Bảy");

var ngay = time.getDate(); var thang = time.getMonth() + 1; var nam = time.getFullYear(); var date = time.getDay(); var thu = arrday[date]; var hours = time.getHours() var minutes = time.getMinutes()

minutes = ((minutes < 10) ?'"0": ''") + minutes var seconds = time.getSeconds()

seconds = ((seconds < 10) ? "0": '''') + seconds var clock = hours + ":" + minutes + '' GMT+7"

mom

Trang 9

- Trang dang ky: viét ham javascript kiểm tra việc nhập thông tin đăng ký của người dùng, nếu người dùng không nhập đầy đủ thông tin sẽ hiền thị thông báo lỗi và phải nhập lại: function kiemtra() { var un = document.getElementById('username').value var pw = document.getElementById('password').value var ht = document.getElementById(‘ten').value

var mail = document.getElementById(‘email').value

if(un == """' || pw == """ lÍ ht == "" |Í mail == '"'")

{

alert("Bạn phải nhập đầy đủ thông tin")

return false

}

return CheckMail(mail)

}

„ Sau khi đã nhập đầy đủ vào tất cả các textbox của trang đăng ký, hệ thống sẽ tiên hành kiêm tra email mà người dùng nhập vào đã hợp lệ hay chưa băng cách sử dụng hàm RegExpQ:

function CheckMail(email)

{

var rs = new RegExp("([A-Za-z0-9_.-]){2,}@([A-Za-z0-9_.-

){2,}.((A-Za-z0-9_.-]){2,}")5

if(email.match(rs) == null)

{

alert("Dia chi mail khéng hop lệ")

Trang 10

else

return true

}

Néu tất cả đều hợp lệ hệ thống sẽ tiếp tục xử lý bằng ngôn ngữ asp đề lưu trữ đữ liệu (sẽ đê cập ở phân tiêp theo)

- Trang gửi mail liên hệ với các thành viên của nhóm: xử lý chủ yếu bằng asp, có một sơ xử lý nhỏ bằng Javascript cũng tương tự như ở trang đăng ký: cũng có phần kiểm tra nhập đây đủ thông tin và kiểm tra email người dùng đã hợp lệ hay chưa

3 Thiét ké bang ASP va JAVASCRIPT két nối với cơ sở dữ liệu Access:

- Trang global.asa:

+ Chira bién Application lưu trữ số lượt truy cập vào trang web, khởi tạo bằng 0 và tăng lên I mỗi khi có 1 yêu câu gọi trang web

+Chứa biến Session user mang giá trị true hoặc false đẻ kiểm tra việc đăng nhập của người dùng, giá trị khởi tạo là false, tức là khi người dùng chưa đăng nhập thì chưa có quyên user, khi đăng nhập thành công giá trị sẽ được gán bằng true, khi đó người dùng có thể tự do thao tác trên tất cả các trang thành viên (Code cụ thể xem trong trang global.asa)

- Trang đăng ký: sau khi đã kiểm tra thông tin đăng ký của người dùng hợp lệ bằng Javascript thì hệ thống tiền hành thao tác bằng ngôn ngữ ASP, kiểm tra tên người dùng đã có trong cơ sở dữ liệu hay chưa, nếu đã có sẽ yêu cầu người dùng chọn tên khác, nếu chưa có sẽ tiến hành lưu trữ tất cả thông tin vào cơ sở dữ liệu, thông báo cho người dùng biết đã đăng ký thành công Sau đó kết hợp với Javascript sử dụng hàm setTimeout để chuyển qua trang đăng nhập sau 3 giây (Code cụ thể xem trong trang Teg1sf.asp)

- Trang đăng nhập: Sau khi bạn đã nhập username và password vào các textbox tương ứng, trình duyệt sẽ gửi thơng tin của bạn đến server và tiến hành kiểm tra với đữ liệu CÓ trong access, nếu tìm thây username và password của bạn sẽ báo thành công và chuyển hướng đến trang chủ, nếu không thành công sẽ báo lỗi và yêu cầu bạn đăng nhập lại (Code cụ thể xem trong trang thanhcong.asp)

- Trang chủ: nhận giá trị trả về của biến Application lưu trữ số lượt truy cập (đã khởi tạo trong trang global.asa) và hiên thị kêt quả ở vùng Lượt truy cập phía ci thanh bên

Trang 11

phải Đoạn code sau được đặt trong vùng Lượt truy cập để hiển thị kết quả nhận được từ biên Application: <%=Application("'truycap") %>

- Các trang thành viên: Có tất cả là 5 trang thành viên, các trang chủ của từng trang thành viên bao gôm: nhac.asp, phim.asp, dulich.asp, doctruyen.asp, suckhoe.asp

Trong giai đoạn đầu khi thiết kế trang web, 5 trang trên được xây dựng bằng ngôn ngữ HTML, là trang hồn tồn tinh, có giao diện tương đồng nhau ở phần trên, bên phải và phần đưới Nội dung của từng trang được thiết kế phù hợp với chủ đề của trang đó Sau khi được học về ASP, cả 5 trang trên được nâng lên thành trang ASP và có một số bổ sung đề tương tác với cơ sở dữ liệu Access Cụ thé là mục “Các tin khác” ở cuối mỗi trang được lấy từ cơ sở dữ liệu và được sắp xếp theo thứ tự thời gian

(những tin mới cập nhật sẽ được hiển thị trước) để người sử đụng đễ theo dõi những tin

mới ở từng chuyên mục Đồng thời, vì dữ liệu khá nhiều cho nên ở khung “Các tin

khác” được xử lý phân trang bằng ASP để mỗi trang chỉ hiển thị 10 mục, khi muốn

xem tiếp thì click vào các trang tiếp theo (Hình 6 — minh họa mục “Các tin khác” trong trang dulich.asp) (Code tải dữ liệu và xử lý phân trang xem chỉ tiết trong trang chủ của từng trang thành viên) Các tin khác ! Đền Thái L › › › > Vietnam Aurlines gt › › › Pacific b giá rẻ chỉ từ 300.000 đồng

1earl Land: Miễn phí phịng ở cho khách du lịch bị kẹt vì mưa lũ Đà Nẵng - Kun Tum - Pleu - Buôn Mê Thuật - Đà Lạt - Nha Trang

Năng

Hà Nội - Nha Trang - Miễn Cát Trắng

Tp.HCM - Châu Đắc - Long 3

Trang 12345678

Hinh 6

Đó là các trang chủ của từng trang thành viên, còn đối với nội dung từng trang con của các trang thành viên được thiết kế theo một cơ chế khác, hoàn toàn bằng ASP Sau đây xin lẫy đại diện là trang du lịch để trình bày cơ chế thành lập của từng trang con (các trang còn lại tương tự)

Trang du lịch có thêm 2 trang con đó là: dulich chuyenmuc.asp và dulichchitiet.asp Ở trang dulich_chuyenmuc.asp nhận vào 2 biên được truyền thông

qua URL 1a bién ct va cm:

Trang 12

+ Biến ct: tức là mã chuyên trang (tương ứng với mã chuyên trang lưu trong cơ sở đữ liệu, để cho server biết người dùng đang yêu cầu gọi đến trang nào)

+ Biến cm: tức là mã chuyên mục (cũng tương ứng với mã chuyên mục trong cơ sở dữ liệu)

_— Code nhận giá trị của 2 biến trên và truyền vào trang dulich_chuyenmuc.asp cụ thê như sau:

dim mact, macm

mact = request.QueryString("'ct") macm = request.QueryString("'cm")

set conn = Server.CreateObject('"'ADODB.Connection") conn.Provider = ''Microsoft.Jet.OLEDB.4.0"

conn.Open Server.MapPath("'csdl/data.mdb") set rs = Server.CreateObject('"'ADODB.recordset"') if macm <> '""' then

sql = "SELECT TENCM FROM CHUYENMUC WHERE MACMS" & macm & ''"'""

else

sql = "SELECT TENCT FROM CHUYENTRANG WHERE MACT

=" & mact & 10111

end if

Có sự khác biệt về giá trị của 2 biến này khi người dùng click vào thanh menu ngang phía trên và khi click vào thanh menu dọc bên trái Vì mục du lịch chia làm 4 tiêu mục là: Danh lam thắng cảnh, Van hóa — Lễ hội, Tour du lịch, Cẩm nang, trong từng tiểu mục này lại có các tiểu tiểu mục (tức là các mục con nhỏ nữa), mà trong thanh menu ngang chúng ta chỉ thấy hiển thị 4 tiểu mục của trang du lịch (Hình 7)

Trang chu Am nhạc Phim truyện Du lịch Payer ca) Tra Try a I1

Danh lam thắng cảnh Văn hóa - Lễ hội Tour du lịch Cam nang

Hinh 7

Vì vậy khi người dùng clich vào thanh menu ngang thì nội dung hiển thị trong trang đulich_chuyenmuc.asp phải bao gồm thông tin của tất cả các tiêu tiểu mục của

Trang 13

phần đó Do đó, giá trị của biến cm và ct lúc này phải là mã chuyên mục và chuyên trang tương ứng trong cơ sở dữ liệu

Còn đồi với thanh menu dọc (Hình 8)

| ĐDAMH LA4 THÁNG CANH

'Việt Nam

Thế giới

II sản - Kỳ quan T6

Irrrrm 'Vấn hóa Việt Maes

Vấn hóa các nước

Lễ hội đặc sắc Phong tuc ky lạ

lImcrrrnm Du lịch trong nước

Dw ch nước ngoài Dich vụ dư ch

<r De dif mưa sâm,

Ban Gin belt Tự vấn

Hình 8

Do là thanh menu đọc chứa đường link liên kết đến các tiểu tiểu mục nên khi người dùng click vào sẽ không cần truyền mả cm, khi đó biến này sẽ chưa giá trị rỗng (trong đoạn code xử lý đẽ nêu phía trên cũng có kiểm tra điều này), giá trị của biến ct phải tương ứng với mã chuyên trang trong cơ sở đữ liệu

Nội dung hiển thị ở giữa được gọi từ cơ sở đữ liệu đúng với tiểu mục và tiểu tiểu mục mà người dùng đã click vào, kết quả hiển thị và định đạng được nêu chỉ tiết trong trang dulich_chuyenmuc.asp (bắt đầu từ dòng 161 đến hết dòng 247) Do nội dung phong phú nên trang dulich chuyenmuc.asp cũng được phân thành nhiều trang bằng ngôn ngữ ASP

Tiếp theo là việc xây dựng trang dulichchitiet.asp, trang nay sé hiển thị đầy đủ và chỉ tiết một thông tin mà người dùng muốn tìm hiểu kỹ bằng cách click v ào đường link của thơng tin đó Giá trị nhận vào của trang dulichchitiet.asp là chỉ số iđ tương ứng với mã du lịch trong cơ sở đữ liệu, code cụ thể như sau:

dim madl

Trang 14

set conn = Server.CreateObject(''ADODB.Connection") conn.Provider = ''Microsoft.Jet.OLEDB.4.0"

conn.Open Server.MapPath(''csdl/data.mdb") set rs = Server.CreateObject(""ADODB.recordset")

sql = "SELECT * FROM DULICH WHERE MADL ='" & madl & '""" Ở câu lệnh sql sẽ lấy ra dịng thơng tin chứa nội dung có mã trùng với id được

truyền vào để hiển thị thơng tin đó ra màn hình cho người sử dụng Toàn bộ đoạn code

trong trang dulichchitiet.asp để lấy đữ liệu, định dạng và hiển thị kết quả được xử lý và nêu chỉ tiết từ dòng 162 đến đòng 193 trong trang dulichchitiet.asp

Các trang cịn lại cũng có cơ chế xử lý và tương tác với người dùng tương tự như trang du lịch đã nêu trên đây (tham khảo code cụ thê ở từng trang tương ứng) Có một điểm nhỏ khác biệt ở tiểu tiểu mục Truyện dài của chuyên mục Đọc truyện, khi người dùng click vào một truyện cụ thé, trình duyệt sẽ gọi đến trang doctruyenchitiet.asp và kết qua hiển thị sẽ là một file flash chứa nội đung của truyện đó, file flash này được chuyển từ định dạng pdf sang định dạng swf bằng phan mém “Aiseesoft PDF To SWF Converter”, mục đích của việc chuyển đổi này vì nội dung của truyện đài thường sẽ chiếm một không gian rất lớn, việc chuyên tải nội dung lên từ file pdf làm cho trang web trở nên phong phú, không gây nhàm chán và tiết kiệm không gian hơn

- Trang liên hệ và gửi mail cho các thành viên của nhóm: Trong trang liên hệ có mục

gửi mail phản hồi của người dùng đến nhóm hoặc liên hệ với mỗi thành viên trong

nhóm, khi click vào email trong trang liên hệ thì địa chỉ mail tương ứng sẽ được chuyên đến trang noidung_mail.asp và được nhận bởi một thẻ input có kiểu là hiđden (thẻ này sẽ không được hiền thị trên trang web) Ở trang noidung_ mail.asp, người dùng nhập vào địa chỉ mail của mình, nội dung muốn gửi và bấm nút send để chuyền nội dung đến người nhận, nếu địa chỉ mail không hợp lệ thì trình duyệt sẽ thông báo và yêu cầu nhập lại, nếu tất cả đều hợp lệ thì tồn bộ thơng tin của trang noidung_ mail.aspl sẽ được chuyển đến trang sned_mail.asp, trang này tiếp nhận thông tin, xử lý và gửi nội dung đó đến mail của người nhận theo đúng yêu cầu của người dùng

- Một số lưu ý khác: Các trang ASP được viết hoàn toàn bằng ngôn ngữ VBSCRIPT

Do nội dung gửi đến người dùng hoàn toàn bằng tiếng Việt nên để hiển thị được đúng

kiêu chữ thì cân phải có đoạn code sau đê chữ không bị bê: <%Session.CodePage=65001%>

Trên đây là toàn bộ quá trình xây dựng nên trang web của cả nhóm, trong khi thực hiện đồ án, nhóm nhận được sự hỗ trợ, giúp đỡ từ phía giảng viên và sự phấn đấu hết mình, khơng ngừng học hỏi của mỗi cá nhân, tuy nhiên vẫn không tránh khỏi một

Trang 15

IV NHUNG KHO KHAN VA THUAN LOI KHI THUC HIEN TRANG WEB:

1 Khó khăn:

-Tìm kiếm đề tài, mục tiêu mà đồ án muốn hướng đến Phải xem xét xem có thể đạt được tất cả các mục tiêu đó hay không Mục tiêu nào cần được ưu tiên hơn

-Sau khi xác định ý tưởng, đến việc triển khai ý tưởng gặp khó khăn đo lịch học khá

dày đặc, thời gian lại hạn chế và nơi ở cách xa nhau nên các thành viên thường xuyên phải họp nhóm online, khiến cho việc đưa ra ý kiến đôi khi không thống nhất

-Do kiến thức về thiết kế web còn hạn chế, buộc phải tìm kiếm học hỏi nhiều trên

internet nhưng việc cung cấp internet ở nơi trọ còn gặp nhiều thiếu thôn, trở ngại -Trang web đưa ra nhiều chuyên mục nhằm thu hút nhiều đối tượng người đùng, vì vậy

việc tìm kiếm được dữ liệu phù hợp cho từng nội đung là một vấn đề vơ cùng khó khăn

và tốn thời gian

-Một trang web không phải chỉ thỏa mãn về nội dung mà cịn phải lơi cuốn về hình thức, khó khăn ở đây là không phải tất cả các thành viên đều có năng khiếu về thiết kế và phối màu., do vậy trang web vẫn chưa thực sự bắt mắt

- Vấn đề tài chính cũng là một yếu tố gây trở ngại lớn trong quá trình thực hiện trang web, có rất nhiều chỉ phí phát sinh như: chỉ phí hội họp, đi lại, liên lạc, văn phịng phẩm, online tìm kiếm thông tin

2 Thuận lợi:

-Tinh thần trách nhiệm và tự học hỏi của mỗi cá nhân đều cao nên tuy họp nhóm online nhưng ln có một deadline cho từng phần công việc, và các thành viên đều hoàn thành đúng hạn, giúp tiến độ công việc khơng bị trì trệ

-Công việc được phân chia cụ thể cho từng cá nhân, tuy nhiên mỗi thành viên đều nắm rõ được từng bước và qui trình trong việc thực hiện đồ án của cả nhóm Các thành viên có sự hỗ trợ lẫn nhau, cùng giúp nhau giải quyết một vấn đề khó khăn nào đó

-Nhóm trưởng biết cách phân chia công việc, tổ chức công việc, hướng các thành viên vào mục tiêu chung của nhóm

-Được sự hỗ trợ từ giảng viên, sự hỗ trợ giữa các thành viên với nhau nên tiến độ công việc thực hiện sớm hơn thời hạn qui định Các thành viên đều cảm thấy hài lòng và tự

Trang 16

hào với kết quả mà nhóm đã thực hiện được vì đó là cơng sức khơng chỉ của riêng bat kì một cá nhân nào mà đó là sự nỗ lực không ngừng nghỉ của cả nhóm

Trang 17

Chuong 2:

GIOI THIEU TONG QUAN VE TRANG WEB VA HUONG DAN SU DUNG WEBSITE

I GIOI THIEU TRANG WEB:

1 Cấu trúc tổng quan của website: được mô tả chỉ tiết theo sơ đồ dưới day:

Ụ Ụ

Đ.TRỊ A

afm] PE : ome] Pia]

Blvens] Em | ms > Lee) pase lăn Học

B|verm] EEassn fer |

pofimeran] — Fofen Ea -| Lee | INước Ngoài]

nfo] mem]

2 Giới thiệu chỉ tiết từng trang web: a Trang chủ: (Hình 9)

Trang 18

Trang chu Âm nhạc Phim truyện Du lịch Đọc truyện Sức khỏe Ám thực ID ải)

Lê Thị Kim Hiền Châu Thanh Tùng

Ẩm thực: Món ốc bươu của người Pháp 4#

'Ngày mai sau nếu - Ngô Kiến Huy

wilt Hinh 9

- Đây là trang giới thiệu tổng quan về toàn bộ các trang web con, có phần giới thiệu những tin tức nổi bật của từng trang thành viên Minh họa ở hình dưới đây (Hình

10): Ngôi nhà hạnh phúc Đạo diễn:Vũ Ngọc Dang

Đây là phiên bản được

remake từ series “Full

House" của Hàn Quốc

do cặp đôi Bi Rain và Song Hye Kyo thd diễn đã nỗi đình nỗi đám

khắp Châu Á từ trước đó

Minh Minh là một cô gái mồ côi, sống một mình trong căn nhà đo ba mẹ

cô đề lai với mơ ước sẽ trở thành một nhà văn Bị

hai người bạn là Bá Thông và Kiều Nhi rắp tâm

Cô bẽ mùa đông

Sáng tác: Tồn Thắng

Trình bày: Đăng Khöi-Thủy Tiên

Lời bài hát Từng cơn gió

khế vơ tình, chiếc lá lia

cành buông xuống lịng đường,ngồi nhặt chiếc lá tơi mơ về Cô bé đáng

yêu của tôi Mùa đồng

đến em vẫn cười Em ước mình là bơng tuyết

ngồi trời Đễ được bay mãi lên thiên đường Một thiên đường tuyết rơi

» Déi thay- ga » Yéulgptr dau yr”

DU LICH %

Quân đảo Phi Phi (Thai Lan) - Vé dep

> Déng mau anh higg *

> Sat thủy ` a we a Bình minh của Bồ

Nội dung: Tôi là con gái ca của bồ mẹ, và được

quyền rũ bồ đặt tên là Dawn - Sau Khi bị tần phá bỡi nghĩa là Bình Minh Bố

sóng thần năm 2004, _ ¬—=>~+w me đều rất thương yêu

Hình 10

Trang 19

- Khi bạn muốn xem các tin tức nỗi bật nhất ở từng trang, bạn không cần phải tìm ở đâu xa, trang chủ có link giúp bạn truy cập trực tiếp đến những vùng tin HOT này - Khung bên phải của trang chủ, là các tin tức nổi bật của từng trang chủ đề, bạn có thể nhanh chóng xem những tin Hot trong từng chủ đề riêng như: âm nhạc , âm

thực mà không cần phải tìm đâu xa (Hình 11)

› ` La »

Yêu thương quay ve Se Tao yéu may

Vườn treo Babylon Rừng NaUyX#

> Cat tia hoa qua nghé thuat - Dep

dén mé man

>» Ar n gi dé thay thé thuốc an thần

Hinh 11

- Bên đưới khung Top Tin là khung tin tức giải trí, cung cấp cho bạn các tỉn tức giải trí nóng bỏng đang diễn ra trong nước và quốc tế (Hình 12)

` _ _ ƯNNNG Thế giới sao 3£ » » > » Hỗ Ngọc Hà và nghỉ án "không sinh con"

Nit dién vién néi tiếng xứ Hàn bị

đột tử sau khi cự LHP

Ba x4 Jang Don Gun 16 dién sau khi sinh

Người đẹp Maya muốn tranh xa

moi "thi phi"

Cwoi He

» > » >

Uống rượu sơng lâu

Phó nháy đi chụp đám ma

Canh sát cũng rnê

Đó tay với các cụ

Hình 12

- Khung bên phải cũng chứa các đường link liên kết đến các trang web khác ứng với nhiều chủ đề nằm trong tổng thể trang web (Hình 13)

Trang 20

Hinh 13

- Trang chủ cũng là nơi cung cấp cho bạn biết số lượt truy cập của trang, bằng một thống kê nằm ở cuối khung bên phải của trang web (Hình 14)

Lượt truy cập

Hình 14

- Phần menu cuối trang (giống nhau ở tất cả các trang): có các link liên kết đến từng trang chủ đề: trang chủ, âm nhạc, sức khỏe, phim truyện, du lịch, âm thực Đồng thời có hiển thị ngày giờ hiện tại và địa chỉ liên lạc của nhóm

b Các trang thành viên:

> Cấu trúc chung của các trang thành viên:

— Cac trang thành viên có cấu trúc ngang giống như đã giới thiệu ban đầu

— Phần khung nội dung ở tất cả các trang thành viên có cấu trúc chung theo chiều dọc gồm 3 phần như sau:

e _ Phần khung bên trái: là menu chứa các mục chính của từng trang

Trang 21

e Phan trung tam: gidi thiệu những tin tức, sự kiện nổi bật nhất của từng trang,

minh họa bằng hình ảnh và lời giới thiệu khái quát, có đường link ở mỗi mục để

thuận tiện khi bạn muốn xem chỉ tiết mục đó

e_ Phần khung bên phải: Đây là mục top tin, là các link liên kết đến từng bài viết

chỉ tiết có trong từng trang thành viên Phía bên đưới của khung này có các liên kết đến các trang bên ngồi, nơi tiếng, thuộc cùng thể loại

> Cu thé 6 từng trang như sau:

ry Bookmarks Tools Help

@ - e 6 (Li http://localhost/hien/nhac.asp 2

2) Most Visited #ề Geting Started a) Latest Headlines

@ Disable- & Cookies: i CSS: ©) Forms: ! Images: © Information: > Miscellaneous: -/ Outine- šŠ Resize- #* Tools: {2) View Source: Options: voo | Chicken Hot Team

Điu úc gân đơn Yêu thương quay vã Yêu từ đầu Đổi thay

ˆ Khắc VỆP Noo Phước Thịnh ‘kr Phan Cao Thal Son

+ One paused download fil

Hinh 15

e Bên trái là menu chứa các mục chính của trang gồm: Nhạc trẻ, nhạc phim,nhạc trữ tình, nhạc khơng lời, nhạc dân tộc

e _ Phần trung tâm của trang giới thiệu các ca khúc nổi bật, bao gồm: Ca khúc Hot trong tuần, ca khúc mới, và ca khúc do các ca sĩ Hot thể hiện

e_ Bên phải là mục Toptin chứa các liên kết đến các bài hát hot như: yêu lại từ đầu, Hoa anh đào trong gió

- _ Trang phim truyện: (Hình 16)

Trang 22

es kee

Phim Việt Nam ee Ce Petron ee) or TT DU! Do

Phim Hollywood 7 Hany Potter Và Hoàng Tử Lai Đẹp Từng Centimet man i = Cảnh Sát Tương Lai Mia sin bin ae » Harry Potter Và Hoàng Tử Lai kkeckii-ocnidoe lu Phim Việt Nam Đạo diễn: Davd Yates Thể bại: Phim Lễ Đạo diễn: Vũ Ngọc Đăng Quốc gia: Việt Nam Đạo diễn: Wong Jing Quốc ga: Hồng Kông Đạo diễn: Roger Alles, Jil Cuton, Anthony Stacch

c 2 Ì

e_ Bên trái là menu chứa các mục chính của trang gồm: Phim bộ, Phim hài, phim hành động, phim kinh dị, phim hoạt hình

» Quyền than Re » Xích lỗ Phim Hồng Kông Phim Hàn Quốc

ed Phim bé mdi cap nhat aw

eens Di roa) RIE ueu aaa TT Hình 16

e _ Phần trung tâm của trang giới thiệu các bộ phim nổi bật, bao gồm: Phim hot trong tuần, Phim bộ mới cập nhật, Phim lẻ mới cập nhật Phía dưới là mục các phim khác, giới thiệu các bộ phim có trong trang web (Hình

17)

Cac phim khác !

Nàng tiên cá nhỏ Ponyo

Shrek 4

Mia San Ban

Tin Hiệu Sống Hành Trình Vượt Ngục

Người Hai Mặt

Hiểm Họa Vùng Sameri - Chaw Bup Bé Hinh Nhan

Mat Quy

Yéu Quái Đô Thị

Trang 1 2 3 4 5 6>>

Hình 17

e_ Bên phải là mục Toptin chứa các liên kết đến các phim hot như: đẹp từng centimet, cảnh sát tương lai và các liên kết đến các trang khác nổi tiếng cùng chủ đề

-_ Trang du lịch: (Hình 18)

Trang 23

Econo) ‘Nam Thế giới - Kỹ quan TG

VĂN HÓA - LỄ HỘI TH Van héa các nước

Lễ hội đặc sắc TOUR DU LỊCH Phong tục kỳ _ Du ch trong nước

Quần đảo Tarutao, Malaysia là "thiên đường” của hoang kiéu Robinson

» Hoang da Tarutao, Thai Lan

Dye en rer eet

giới Thái Lan -

ưu, ham muốn trải nghiệm cuộc sống khám phá đảo

» Tiên Châu cô tự và truyền thuyết Bãi Tiên

'Chùa Tiên Châu tọa lạc trên một củ lao nhỏ, được ôm

ấp bởi hai nhánh của địng Mê Kơng hùng vĩ Sông Tiền

và sông Cổ Chiên, thuộc ấp Bình Lương, xã An Bình, huyện Long Hỗ, tinh Vinh Long,

eae

Địa điểm mua sim Van héa - Lễ hội các vùng miễn

= -= tevin

»Loy Krathong - Lễ hội truyền thống của người

Thái

»Hôn nhân và tục hát cưới của người Dao đỏ ở

Lao Cai "

Hình 18

e Bên trái là menu chứa các mục chính của trang gồm: Danh lam thắng cảnh, văn hóa- lễ hội, tour du lich, cam nang du lich

e Phần trung tâm của trang giới thiệu các tin tức nổi bật, bao gồm: Danh

lam thắng cảnh, Văn hóa - lễ hội vùng miền, Cẩm nang du lịch Phía

dưới là mục các tin khác, giới thiệu các bài viết khác có trong trang web

e Bên phải là mục Toptin chứa các liên kết đến các tin du lich hot như: Những điều cần biết khi đi đu lịch Sapa, 5 địa điểm trăng mật lý tưởng và các liên kết đến các trang khác nổi tiếng cùng chủ đề như: dulichphuonghoang.com -_ Trang đọc truyện: (Hình 19) ©) Top tin 'VÌ SAO TỚ YEU BO Tình muộn SE Cả phê muối Mưa Tình yêu Hình 19

e_ Bên trái là menu chứa các mục chính của trang gồm: Tác phẩm văn học, truyện cổ tích, sống đẹp Bên dưới là mục “Sách trong tuần”: giới thiệu

Trang 24

đến bạn đọc những cuốn sách hay, chọn lọc trong tuần thuộc nhiều thể

loại khác nhau như: Tình yêu, tình cảm gia đình, truyện thiếu nhỉ

e Phần trung tâm của trang giới thiệu các sách truyện nổi bật, như: Bước qua hai thế giới, vì sao tớ yêu bố

e Bên phải là mục Toptin chứa các liên kết đến các tập truyện hot như: Tình muộn, café muối và các liên kết đến các trang khác nỗi tiếng cùng chủ đề

-_ Trang sức khỏe: (Hình 20)

An uống hợp lý ở

người cao tuôi

Con người là một hệ Để có một trái Im khóe

thống, một cỗ máy tiêu không phải là điều quá

Phát tiến tâm sinh lý ở nữ thụ năng lượng 06 host 6 W "- le đồng, cổ mấy này cũng bị Một chế độ dính dưỡng

sử đụng hao môn trong quá tinh nhiều chất xơ, ngữ cốc, muổi hạn ché

Ẩn uống qua thức ăn : cholesterol và thay thé cung cắp năng lượng chờ các chất béo có hại bằng,

Đcác hoại déng cia co thé a các chất béo có lợi như ha bao hòa trong dầu đậu nành sẽ :

Phát triển tâm sinh lý ở

Hiểu hơn về bệnh cảm cám St

sau khi sinh fra bệnh tiểu đường

Dịch vụ khám sức khỏe định k ya tu vin bénh nghế nghiêi Hinh 20

e Bên trái là menu chứa các mục chính của trang gồm: Sức khỏe cộng

đồng, Sức khỏe giới tính, Sức khỏe sinh sản

e Phần trung tâm của trang giới thiệu các tin tức nổi bật như: Ăn uống hợp lý ở người cao tuổi, thực phẩm cho một trái tim khỏe Phía đưới là mục các tin khác, giới thiệu các bài viết khác có trong trang web

e_ Bên phải là mục Toptin chứa các liên kết đến các tin sức khỏe hot như: Hiểu được bệnh cảm cúm, lưu ý khi chăm sóc trẻ ốm và các liên kết đến các trang khác nỗi tiếng cùng chủ đề

Trang 25

»DAC SAN TAY NGUYEN - LAU LA RUNG

"Đến với Tây Nguyên đại ngàn, ngoài thắng cảnh thiên nhiên hùng vĩ, con người thân

‘hac chan ban sẽ cò được Tây ua al lếc lá Đó không

lương vị của quê,

hương, xứ sở thơng qua món đặc sản của đồng bào Tây Nguyên - Lầu lá rừng Le

Duong như hương vị của nủi rừng, của đại ngàn xanh đã thâm vào từng chiếc lá đẻ bạn có thể cảm nhận một cách day đủ nhất về Tây Nguyễn

› Lẫu lá rừng Me » Banh khoái › Sài gồn da hương vị lẫu

»MON AN MUA LANH CUA NGƯỜI MIỄN NAM , ee a aay của người miễn Nam,

| Advertising

(Cie dén da thina 10 Ichi naoai Ric teiti hat dan chuvdn lank nereiti miền Nam lại cần:

Hinh 21

e Bén trai 1A menu chita các mục chính của trang gồm: Món ăn Việt, Quán ngon, Góc khéo tay, Món ăn nước ngoài

e_ Phần trung tâm của trang giới thiệu các tin tức nổi bật, bao gồm: Cả nhà vào bếp, Âm thực bốn phương Phía dưới là mục các tin khác, giới thiệu các bài viết khác có trong trang web

e_ Bên phải là mục Toptin chứa các liên kết đến các tin ẩm thực hot như: Lẫu lá rừng, món ốc bươu của người Pháp và các liên kết đến các trang khác nổi tiếng cùng chủ đề như: amthhuc.com.vn

-_ Trang liên hệ: (Hình 22)

= Ching tôi có những sở thích khác nhau

:: Chúng tôi đến với nhau thật tình cờ

+ Và chúng tôi kết bạn

:: Chúng tơi khơng ln hịa thuận

z: Nhưng khi có 1 mục tiêu chung

+ Là lúc chúng tơi đồn kết

+ Và lúc đó bạn không bao giờ là đối thủ : Chúng tôi đến từ K08406

: Một cái tên thân thuộc đây yêu thương + CHICKEN HOT TEAM

+ Họ tên: Vạn Thị Kim Chi

Hình 22

Trang 26

e Trang lién hệ chủ yếu có giao diện đẹp, giới thiệu về nhóm và các thành viên của nhóm: thơng tin cá nhân, địa chỉ mail liên lac

e_ Nếu bạn muốn liên hệ với bất kì thành viên nào, bạn chỉ việc click vào mail của người đó, sau đó hệ thống sẽ chuyển trang nội dung mail (Hình 23) đến cho bạn để ghi những lời góp ý bạn muốn gửi gắm đến chúng tôi, bạn chỉ việc click nút Gửi đi là thư của bạn sẽ tự động được gửi mà không cần bạn phải tốn công đăng nhập vào yahoo mail

ng Minh Chuyên Lê Thị Kim Hiền Châu Thanh Tùng

thugian4c.webng.com - Liên lệ

Email người gửi:

Chu de:

Nội dung:

Hinh 23

II HUONG DAN SU DUNG WEBSITE:

- Buéc 1: truy cap vao dia chi trang chi: www.thugian4c.webng.com

- Bwéc 2: Khi ban nhan vao bat ky muc nao cia trang chu (néu là lần truy cập đầu tiên), hệ thống website sẽ chuyển trang đăng nhập (Hình 24) đến cho bạn, bạn phải nhập vào đúng User và pass thì mới login và xem được các tin tức mà bạn muốn xem

Trang 27

Bạn phải đăng nhập để sử dụng trang web!

Nếu bạn chưa có tài khoản, vui lịng Click vào đây dé dang ký Hình 24

> Sau khi bạn đăng nhập thành công, hệ thống sẽ chuyển đến trang chủ và bây giờ bạn có thể tha hồ xem mục yêu thích của mình rồi ^^

> Trong trường hợp bạn chưa có tài khoản ở trang này, thì bạn có thể đăng ký mới bằng cách “Click vào đây” Trang đăng ký mới sẽ hiện ra (Hình 25)

ĐĂNG KÝ

Tên đăng nhập hihi

Mật khân eee

Họ tên người đăng ký tui la hihi

Ngày sinh Ngày: 1 v Tháng 1 v Nam: 1970 v

Giới tỉnh O Nam © Ne

Email ‘hihi@gmailcom -

Hinh 25

> Chú ý là bạn phải nhập đúng và đầy đủ thông tin nha, không là sẽ hiện ra báo lỗi

đó Ví dụ lỗi nè (Hình 26):

„4đ, Địa chỉ mail không hợp lệ

Hình 26

Trang 28

Chúc mừng tui là hi đã đăng ký thành cơng ! Vui lịng chờ trong giây lát

Đang chuyền hướng Hình 27

Va hệ thống sẽ chuyền hướng đến trang đăng nhập Qúa trình đăng nhập diễn ra

như mô tả ở trên

— Bước 3: Hiện giờ bạn đã là thành viên của trang web và bạn có thể tha hồ xem bất cứ trang nào bạn muốn Nhiệm vụ của bạn bây giờ là click chuột và tận hưởng giây phút thư giãn thoải mái với âm nhạc, phim truyện hoặc những thông tin du lịch bổ ích mà chúng tơi mang đến cho bạn ©