SlideShare a Scribd company logo
LOGO
 Dựa vào công nghệ phát triển, có 2 loại:
   Web tĩnh:
     • Dễ phát triển
     • Tương tác yếu
     • Sử dụng HTML
     • Người làm web tĩnh thường dùng các công cụ trực quan
       để tạo ra trang web
   Web động:
     • Khó phát triển hơn
     • Tương tác mạnh
     • Sử dụng nhiều ngôn ngữ khác nhau
     • Thường phải viết nhiều mã lệnh
1. Đặc tả
2. Phân tích
3. Thiết kế
4. Lập trình
5. Kiểm thử
 Đặc tả:
   Web để làm gì?
   Ai dùng?
   Trình độ người dùng?
   Nội dung, hình ảnh?
Web để làm gì?
Ai dùng?
Trình độ người dùng?

 Xác định các độc giả chính của website =>thiết kế cấu
  trúc phù hợp với nhu cầu, mong muốn của họ
 Phân loại độc giả một cách phù hợp
  o Các độc giả mới và độc giả không thường xuyên
  o Các độc giả chuyên nghiệp, thường xuyên
  o Các độc giả nước ngoài
  o Các độc giả Dạo chơi trên Web (browsing)
Nội dung, hình ảnh?
 Phân tích
   Mối liên quan giữa các nội dung?
   Thứ tự các nội dung?
Mối liên quan giữa các nội dung?
     Chia làm nhiều chủ đề
     Các bài viết liên quan với nhau phải được
      đặt cùng chủ đề và có thể tham khảo qua lại

Thứ tự các nội dung?
   Nội dung mới/hay phải được đưa lên đầu trang
   Các bài viết phải sắp xếp theo ngày tháng.
 Thiết kế
   Sơ đồ cấu trúc website
   Giao diện
   Tĩnh hay động
   CSDL
   Nội dung từng trang
   Liên kết giữa các trang
  …
Sơ đồ cấu trúc website
Sơ đồ cấu trúc website
  Không nên xây dựng 1 website như sau
Sơ đồ cấu trúc website
  Không nên xây dựng 1 website như sau




      Website quá nông, chỉ một mức liên kết =>
      không có liên kết, trật tự
Sơ đồ cấu trúc website
  Không nên xây dựng 1 website như sau


                       Website quá sâu => mở
                       nhiều thư mục mới tới đích
Sơ đồ cấu trúc website
                         Cấu trúc hợp lý
Giao diện
Giao diện

Màu sắc: Gam màu thống nhất trong toàn bộ Website
Font Tiếng việt: Chỉ dùng Unicode
(Font: Arial, Times New Roman, Tahoma, …)
Web tĩnh hay web động

  Nếu thông tin không cần thay đổi thì nên
 dùng web tĩnh => nhanh hơn, an toàn hơn
  Nếu thông tin thay đổi thường xuyên => web
 động
Web tĩnh hay web động
 Xây dựng
   Cấu trúc thư mục
   Các modul dùng chung
  …
Cấu trúc thư mục        Năm
   Đặt theo phân cấp
   Theo loại                 Tháng




                         Ngày
 Kiểm thử
   Kiểm tra trên nhiều trình duyệt
   Kiểm tra trên nhiều loại mạng
   Kiểm tra tốc độ
   Kiểm tra các liên kết
   Thử các lỗi bảo mật
  …
LOGO

More Related Content

Viewers also liked

Language Acquisition Through Watching Television
Language Acquisition Through Watching TelevisionLanguage Acquisition Through Watching Television
Language Acquisition Through Watching Television
inalekka
 
Busienss plan sami direct
Busienss plan   sami directBusienss plan   sami direct
Busienss plan sami direct
Raj Dewan
 
Doc dien tim de hon (or)
Doc dien tim de hon (or)Doc dien tim de hon (or)
Doc dien tim de hon (or)
Salomon Nguyen
 
Pengukuran mendatar
Pengukuran mendatarPengukuran mendatar
Pengukuran mendatar
Kurniawan Akbar
 
Currículum Vitae
Currículum VitaeCurrículum Vitae
Currículum VitaeCristina Pg
 
Keynote derivatives daily report for 121112
Keynote derivatives   daily report for 121112Keynote derivatives   daily report for 121112
Keynote derivatives daily report for 121112
Keynote Capitals Ltd.
 
Klasseledelse glu5 10.ppt-2-1
Klasseledelse glu5 10.ppt-2-1Klasseledelse glu5 10.ppt-2-1
Klasseledelse glu5 10.ppt-2-1
Gabrielle Hansen
 
Портрет первокурсника 2012
Портрет первокурсника 2012Портрет первокурсника 2012
Портрет первокурсника 2012
Helen-ko
 
Windows 8 cp 速攻レビュー
Windows 8 cp 速攻レビューWindows 8 cp 速攻レビュー
Windows 8 cp 速攻レビューMakoto Nishimura
 
121015 docci営業資料 ver11
121015 docci営業資料 ver11121015 docci営業資料 ver11
121015 docci営業資料 ver11Tomonari Miyashita
 

Viewers also liked (12)

Language Acquisition Through Watching Television
Language Acquisition Through Watching TelevisionLanguage Acquisition Through Watching Television
Language Acquisition Through Watching Television
 
Chuong 1@ngon ngu c
Chuong 1@ngon ngu cChuong 1@ngon ngu c
Chuong 1@ngon ngu c
 
Busienss plan sami direct
Busienss plan   sami directBusienss plan   sami direct
Busienss plan sami direct
 
Doc dien tim de hon (or)
Doc dien tim de hon (or)Doc dien tim de hon (or)
Doc dien tim de hon (or)
 
Pengukuran mendatar
Pengukuran mendatarPengukuran mendatar
Pengukuran mendatar
 
One loaf of bread
One loaf of breadOne loaf of bread
One loaf of bread
 
Currículum Vitae
Currículum VitaeCurrículum Vitae
Currículum Vitae
 
Keynote derivatives daily report for 121112
Keynote derivatives   daily report for 121112Keynote derivatives   daily report for 121112
Keynote derivatives daily report for 121112
 
Klasseledelse glu5 10.ppt-2-1
Klasseledelse glu5 10.ppt-2-1Klasseledelse glu5 10.ppt-2-1
Klasseledelse glu5 10.ppt-2-1
 
Портрет первокурсника 2012
Портрет первокурсника 2012Портрет первокурсника 2012
Портрет первокурсника 2012
 
Windows 8 cp 速攻レビュー
Windows 8 cp 速攻レビューWindows 8 cp 速攻レビュー
Windows 8 cp 速攻レビュー
 
121015 docci営業資料 ver11
121015 docci営業資料 ver11121015 docci営業資料 ver11
121015 docci営業資料 ver11
 

Similar to Chuong2@tkw

Tong quanthietkeweb
Tong quanthietkewebTong quanthietkeweb
Tong quanthietkeweb
Lương Nguyên
 
Giáo trình thiết kế web - Thiết kế web với Dreamweaver
Giáo trình thiết kế web - Thiết kế web với DreamweaverGiáo trình thiết kế web - Thiết kế web với Dreamweaver
Giáo trình thiết kế web - Thiết kế web với Dreamweaver
KhanhPham
 
Asp tiengviet
Asp tiengvietAsp tiengviet
Asp tiengviet
Quoc Nguyen
 
Asp tiengviet
Asp tiengvietAsp tiengviet
Asp tiengviet
quanvn
 
Lecture 01ascaccacaWsacascascsacascascWW.pdf
Lecture 01ascaccacaWsacascascsacascascWW.pdfLecture 01ascaccacaWsacascascsacascascWW.pdf
Lecture 01ascaccacaWsacascascsacascascWW.pdf
Lê Thưởng
 
Các tính năng của eSoff
Các tính năng của eSoffCác tính năng của eSoff
Các tính năng của eSoff
gidaffchannel
 
Unit 8 using the internet vn
Unit 8 using the internet vnUnit 8 using the internet vn
Unit 8 using the internet vn
HG Rồng Con
 
Lecture 01 - WWW.pdf
Lecture 01 - WWW.pdfLecture 01 - WWW.pdf
Lecture 01 - WWW.pdf
Lê Thưởng
 
Baocaodoanhocphan vanquocthinh_11253321_ncth5b
Baocaodoanhocphan vanquocthinh_11253321_ncth5bBaocaodoanhocphan vanquocthinh_11253321_ncth5b
Baocaodoanhocphan vanquocthinh_11253321_ncth5b
quocthinh072
 
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 3
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 3Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 3
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 3Bảo Châu Uit
 
IM 2015 - Chuong 2: Website
IM 2015 - Chuong 2: WebsiteIM 2015 - Chuong 2: Website
IM 2015 - Chuong 2: Website
The Marketing Corner
 
Kiến thức seo
Kiến thức seoKiến thức seo
Kiến thức seo
kcdkcmt kcdkcmt
 
Viet nam slide
Viet nam slideViet nam slide
Cam nang seo cho dientu
Cam nang seo   cho dientuCam nang seo   cho dientu
Cam nang seo cho dientukhoahocseo
 
Báo cáo thực tập tại Trung Tâm athena
Báo cáo thực tập tại Trung Tâm athenaBáo cáo thực tập tại Trung Tâm athena
Báo cáo thực tập tại Trung Tâm athenaThảo Trần
 
Bài giảng thiết kế website - truongkinhtethucpham.com
Bài giảng thiết kế website - truongkinhtethucpham.comBài giảng thiết kế website - truongkinhtethucpham.com
Bài giảng thiết kế website - truongkinhtethucpham.com
mai_non
 
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 4
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 4Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 4
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 4Bảo Châu Uit
 
Html coban
Html coban Html coban
Html coban
Cá Cơm
 

Similar to Chuong2@tkw (20)

Tong quanthietkeweb
Tong quanthietkewebTong quanthietkeweb
Tong quanthietkeweb
 
Giáo trình thiết kế web - Thiết kế web với Dreamweaver
Giáo trình thiết kế web - Thiết kế web với DreamweaverGiáo trình thiết kế web - Thiết kế web với Dreamweaver
Giáo trình thiết kế web - Thiết kế web với Dreamweaver
 
Asp tiengviet
Asp tiengvietAsp tiengviet
Asp tiengviet
 
Asp tiengviet
Asp tiengvietAsp tiengviet
Asp tiengviet
 
Lecture 01ascaccacaWsacascascsacascascWW.pdf
Lecture 01ascaccacaWsacascascsacascascWW.pdfLecture 01ascaccacaWsacascascsacascascWW.pdf
Lecture 01ascaccacaWsacascascsacascascWW.pdf
 
Các tính năng của eSoff
Các tính năng của eSoffCác tính năng của eSoff
Các tính năng của eSoff
 
Unit 8 using the internet vn
Unit 8 using the internet vnUnit 8 using the internet vn
Unit 8 using the internet vn
 
Lecture 01 - WWW.pdf
Lecture 01 - WWW.pdfLecture 01 - WWW.pdf
Lecture 01 - WWW.pdf
 
Baocaodoanhocphan vanquocthinh_11253321_ncth5b
Baocaodoanhocphan vanquocthinh_11253321_ncth5bBaocaodoanhocphan vanquocthinh_11253321_ncth5b
Baocaodoanhocphan vanquocthinh_11253321_ncth5b
 
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 3
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 3Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 3
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 3
 
Buoi1
Buoi1Buoi1
Buoi1
 
Buoi1
Buoi1Buoi1
Buoi1
 
IM 2015 - Chuong 2: Website
IM 2015 - Chuong 2: WebsiteIM 2015 - Chuong 2: Website
IM 2015 - Chuong 2: Website
 
Kiến thức seo
Kiến thức seoKiến thức seo
Kiến thức seo
 
Viet nam slide
Viet nam slideViet nam slide
Viet nam slide
 
Cam nang seo cho dientu
Cam nang seo   cho dientuCam nang seo   cho dientu
Cam nang seo cho dientu
 
Báo cáo thực tập tại Trung Tâm athena
Báo cáo thực tập tại Trung Tâm athenaBáo cáo thực tập tại Trung Tâm athena
Báo cáo thực tập tại Trung Tâm athena
 
Bài giảng thiết kế website - truongkinhtethucpham.com
Bài giảng thiết kế website - truongkinhtethucpham.comBài giảng thiết kế website - truongkinhtethucpham.com
Bài giảng thiết kế website - truongkinhtethucpham.com
 
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 4
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 4Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 4
Báo cáo tiến độ thực tập hàng tuần tại trung tâm athena tuan 4
 
Html coban
Html coban Html coban
Html coban
 

Chuong2@tkw

  • 2.
  • 3.  Dựa vào công nghệ phát triển, có 2 loại:  Web tĩnh: • Dễ phát triển • Tương tác yếu • Sử dụng HTML • Người làm web tĩnh thường dùng các công cụ trực quan để tạo ra trang web  Web động: • Khó phát triển hơn • Tương tác mạnh • Sử dụng nhiều ngôn ngữ khác nhau • Thường phải viết nhiều mã lệnh
  • 4. 1. Đặc tả 2. Phân tích 3. Thiết kế 4. Lập trình 5. Kiểm thử
  • 5.  Đặc tả:  Web để làm gì?  Ai dùng?  Trình độ người dùng?  Nội dung, hình ảnh?
  • 7. Ai dùng? Trình độ người dùng?  Xác định các độc giả chính của website =>thiết kế cấu trúc phù hợp với nhu cầu, mong muốn của họ  Phân loại độc giả một cách phù hợp o Các độc giả mới và độc giả không thường xuyên o Các độc giả chuyên nghiệp, thường xuyên o Các độc giả nước ngoài o Các độc giả Dạo chơi trên Web (browsing)
  • 9.  Phân tích  Mối liên quan giữa các nội dung?  Thứ tự các nội dung?
  • 10. Mối liên quan giữa các nội dung?  Chia làm nhiều chủ đề  Các bài viết liên quan với nhau phải được đặt cùng chủ đề và có thể tham khảo qua lại Thứ tự các nội dung?  Nội dung mới/hay phải được đưa lên đầu trang  Các bài viết phải sắp xếp theo ngày tháng.
  • 11.
  • 12.  Thiết kế  Sơ đồ cấu trúc website  Giao diện  Tĩnh hay động  CSDL  Nội dung từng trang  Liên kết giữa các trang …
  • 13. Sơ đồ cấu trúc website
  • 14. Sơ đồ cấu trúc website Không nên xây dựng 1 website như sau
  • 15. Sơ đồ cấu trúc website Không nên xây dựng 1 website như sau Website quá nông, chỉ một mức liên kết => không có liên kết, trật tự
  • 16. Sơ đồ cấu trúc website Không nên xây dựng 1 website như sau Website quá sâu => mở nhiều thư mục mới tới đích
  • 17. Sơ đồ cấu trúc website Cấu trúc hợp lý
  • 19. Giao diện Màu sắc: Gam màu thống nhất trong toàn bộ Website Font Tiếng việt: Chỉ dùng Unicode (Font: Arial, Times New Roman, Tahoma, …)
  • 20. Web tĩnh hay web động  Nếu thông tin không cần thay đổi thì nên dùng web tĩnh => nhanh hơn, an toàn hơn  Nếu thông tin thay đổi thường xuyên => web động
  • 21. Web tĩnh hay web động
  • 22.  Xây dựng  Cấu trúc thư mục  Các modul dùng chung …
  • 23. Cấu trúc thư mục Năm  Đặt theo phân cấp  Theo loại Tháng Ngày
  • 24.  Kiểm thử  Kiểm tra trên nhiều trình duyệt  Kiểm tra trên nhiều loại mạng  Kiểm tra tốc độ  Kiểm tra các liên kết  Thử các lỗi bảo mật …
  • 25. LOGO