bài giảng thiết kế và triển khai website chương 2 - gv. bùi quang trường

11/18/2013 Thiết kế và triển khai website
1
Thiết kế và triển khai website
Chương 2. Tổng quan về thiết kế Website
2.1. Các bước xây dựng Website
2.1.1. Khái quát chung
2.1.2. Thiết kế giao diện
2.1.3. Thiết kế nội dung
2.2. Các nguyên tắc thiết kế website
2.2.1. Các nguyên tắc chung
2.2.2. Nguyên tắc phân bố thông tin
2.2.3. Nguyên tắc sử dụng các hiệu ứng
11/18/2013 Thiết kế và triển khai website
2
2.1. Các bước xây dựng Website
2.1.1. Khái quát chung

- Mục đích của Web site cần thiết kế
- Chiến lược thiết kế
- Các ứng dụng của công nghệ Web

11/18/2013 Thiết kế và triển khai website
3
2.1.1. Khái quát chung

Mục đích của Web site cần thiết kế:
 Xác định đối tượng độc giả của web site.
 Web site có mục đích rõ ràng.
 Thiết lập các chủ đề chính của web site.
 Thiết kế các khối thông tin chủ yếu mà web site sẽ
cung cấp

11/18/2013 Thiết kế và triển khai website
4
2.1.1. Khái quát chung
Chiến lược thiết kế:
- Bạn muốn nói gì?
- Tại sao thông tin của bạn là cần thiết?
- Bạn muốn mọi người thực hiện điều gì?
11/18/2013 Thiết kế và triển khai website
5
2.1.1. Khái quát chung
Các ứng dụng của công nghệ Web:
 Đào tạo
 Dạy học
 Giáo dục
 Tham khao



11/18/2013 Thiết kế và triển khai website
6
Các ứng dụng của công nghệ Web
Dạo chơi trên Web: VD forum

11/18/2013 Thiết kế và triển khai website
7
Các ứng dụng của công nghệ Web
Dạo chơi trên Web: VD Blog

11/18/2013 Thiết kế và triển khai website
8

Các ứng dụng của công nghệ Web
Đào tạo


11/18/2013 Thiết kế và triển khai website
9
Các ứng dụng của công nghệ Web
Dạy học
11/18/2013 Thiết kế và triển khai website
10
Các ứng dụng của công nghệ Web
Giáo dục

11/18/2013 Thiết kế và triển khai website
11
Các ứng dụng của công nghệ Web
Tham khao

11/18/2013 Thiết kế và triển khai website
12
2.1. Các bước xây dựng Website

2.1.2. Thiết kế giao diện
- Khái quát
- Thiết kế giao diện cơ bản
11/18/2013 Thiết kế và triển khai website
13
2.1.2. Thiết kế giao diện

Khái quát :

- Giao diện người dùng đồ hoạ (GUI)
- Trang Web đối lập với thiết kế tài liệu thông thường
- Các tiền lệ trong in ấn
- Một số câu hỏi đặt ra:
+ Ai?
+ Cái gì?
+ Khi nào?
+ Nơi nào?

11/18/2013 Thiết kế và triển khai website
14
Khái quát
Giao diện người dùng đồ hoạ (GUI):
11/18/2013 Thiết kế và triển khai website
15
Khái quát
 Trang Web đối lập với thiết kế tài liệu thông
thường
 Các tiền lệ trong in ấn
 Một số câu hỏi đặt ra:
+ Ai?
+ Cái gì?
+ Khi nào?
+ Nơi nào?
11/18/2013 Thiết kế và triển khai website
16
2.1.2. Thiết kế giao diện

Thiết kế giao diện cơ bản:
- Thiết kế hướng tới người sử dụng

- Các giúp đỡ định hướng rõ ràng
- Không có trang cuối cùng (dead-end)
- Cho phép truy nhập trực tiếp
- Dải thông và ảnh hưởng
- Đơn giản và nhất quán
- Tính ổn định thiết kế
- Phản hồi và đối thoại
- Thiết kế cho các trình duyệt khác
- Điều khiển đồ hoạ
- Tạo ngữ cảnh
- Liên kết và điều khiển
11/18/2013 Thiết kế và triển khai website
17
Thiết kế giao diện cơ bản
Thiết kế hướng tới người sử dụng:

- Giao diện đồ hoạ cho người sử dụng
- Tìm hiểu nhu cầu và tâm lý độc giả
11/18/2013 Thiết kế và triển khai website
18
Thiết kế giao diện cơ bản

Các giúp đỡ định hướng rõ ràng:

11/18/2013 Thiết kế và triển khai website
19
Thiết kế giao diện cơ bản

Các giúp đỡ định hướng rõ ràng (tiếp):

11/18/2013 Thiết kế và triển khai website
20
Thiết kế giao diện cơ bản
Không có trang cuối cùng (dead-end):

11/18/2013 Thiết kế và triển khai website
21
Thiết kế giao diện cơ bản
Cho phép truy nhập trực tiếp:
11/18/2013 Thiết kế và triển khai website
22
Thiết kế giao diện cơ bản
Dải thông và ảnh hưởng:



11/18/2013 Thiết kế và triển khai website
23
Thiết kế giao diện cơ bản
Đơn giản và nhất quán:

11/18/2013 Thiết kế và triển khai website
24
Thiết kế giao diện cơ bản
 Tính ổn định thiết kế
 Phản hồi và đối thoại
 Thiết kế cho các trình duyệt khác:

11/18/2013 Thiết kế và triển khai website
25

Thiết kế giao diện cơ bản
Điều khiển đồ hoạ: