Transcript Module 1: OverView of Web Developtment
TẬP HUẤN CÔNG NGHỆ THÔNG TIN WEB - THIẾT KẾ WEB
Lecture: Email: Website: Nguyễn Đức Cương - FIT [email protected]
http://www.nguyenduccuong.com
http://www.longcuong.com.vn
Tại sao lại là WEB?
Văn phòng di động 24/24 Thông tin liên lạc mọi lúc, mọi nơi Giới thiệu quảng bá hình ảnh nhà trường, công ty,..
Thực hiện dịch vụ mua bán nhanh, thuận tiện,..
Mục tiêu
Nắm vững kiến thức cơ bản về www – internet.
Hiểu được thế nào là web, Web tĩnh, Web động Hiểu được các kiến thức cơ bản thiết kế web: HTML, CSS,..
Biết được công dụng, ý nghĩa của một số công cụ thiết kế, lập trình web: MS Front Page, Dreamweaver 8, MS Expression Web, VS Studio 2005,..
http://nguyenduccuong.com Slide 3 http://longcuong.com.vn
Nội dung
Các thuật ngữ cơ bản Giới thiệu các kiến thức cơ bản thiết kế web: HTML, CSS,..
Giới thiệu một số công cụ thiết kế web: MS Front Page, Dreamweaver 8, MS Expression Web, VS Studio 2005,..
http://nguyenduccuong.com Slide 4 http://longcuong.com.vn
Tài nguyên
Phần cứng: Máy tính chạy Win 2000 hoặc cao hơn.
Phần mềm: Phần mềm TK Web: Dreamweaver MX, VS Studio,..
Trình duyệt: IE, Fire Fox,..
http://nguyenduccuong.com Slide 5 http://longcuong.com.vn
Nguồn tham khảo
Giáo trình thiết kế web – trường ĐH Công nghiệp Tp HCM Principle web design - Joel Sklar http://www.google.com
http://w3c.org
… http://nguyenduccuong.com Slide 6 http://longcuong.com.vn
Các thuật ngữ cơ bản
Internet : TCP/IP:(Transfer Control Protocol/Internet Protocol) Mô hình Client-Server: Internet Server: là các Server cung cấp các dịch vụ Internet (Web Server, Mail Server, FTP Server…) Internet Service Provider (ISP): Internet Protocol : Phương thức truyền tin trong internet – thông qua gateway http://nguyenduccuong.com Slide 7 http://longcuong.com.vn
http://nguyenduccuong.com Slide 8 http://longcuong.com.vn
Các thuật ngữ cơ bản
World Wide Web (WWW):dịch vụ truy xuất tài liệu trên các máy.
Web Browser : Internet Explorer, Mozilla FireFox, Nestcape, … Hosting provider: DNS: Domain Name Service Publish: làm cho trang web chạy trên internet URL(Unioform resource locator): một địa chỉ chỉ đến một file cụ thể trong nguồn tài nguyên mạng. http://nguyenduccuong.com Slide 9 http://longcuong.com.vn
Các thuật ngữ cơ bản
Web: Một ứng dụng chạy trên mạng (Client-Server) tương tự ứng dụng khác. Nhưng được chia sẻ toàn cầu thông qua mạng Internet và các dịch vụ của nó.
Web Page: tập tin được lưu với phần mở rộng là .html, htm (web tĩnh); aspx, php,.. (web động). Website: Một tập hợp nhiều web page, thể hiện thông tin của một tổ chức hoặc một chủ đề nào đó http://nguyenduccuong.com Slide 10 http://longcuong.com.vn
Tổng quan HTML
HTML (HyperText markup Language) gồm các thẻ (tag), đoạn mã đặc biệt – là sự định dạng để báo cho trình duyệt Web biết cách hiển thị.
Cho phép liên kết các loại âm thanh, hình ảnh bên trong trang web.
HTML không phải là ngôn ngữ lập trình Trình soạn thảo trang web :Notepad, ..
Hỗ trợ thiết kế: FrontPage, Dreamweaver,...
MS VS Studio,..
http://nguyenduccuong.com Slide 11 http://longcuong.com.vn
Tổng quan HTML
Cú pháp:
, Object : văn bản, ảnh,..
ListPropeties: danh sách thuộc tính của Tag http://nguyenduccuong.com Slide 12 http://longcuong.com.vn
Cấu trúc trang web
Nội dung thông tin của trang web Nội dung hiển thị trên trình duyệt http://nguyenduccuong.com Slide 13 http://longcuong.com.vn
Một số các ví dụ
Hiển thị tiêu đề web:
HTML là gì?
Ngắt đoạn ,
Kẻ đường ngang
http://nguyenduccuong.com Slide 14 http://longcuong.com.vn
Một số các ví dụ
Định dạng văn bản: đậm, nghiêng,..
Văn bản Định dạng font chữ Định dạng toàn trang http://nguyenduccuong.com Slide 15 http://longcuong.com.vn
Một số các ví dụ
Cho đối tượng chuyển động: Chèn ảnh vào trang web Chèn âm thanh
Thao tác trên trình duyệt
Refresh (Reload) – F5 Chỉnh kích cỡ - View/Text size (Zoom) Bảng mã – View/Encoding (Character Encoding) Xem mã nguồn – View/Source (Page Source) Lưu lại trang ưa thích- Favorites (Bookmark),..
http://nguyenduccuong.com Slide 17 http://longcuong.com.vn
Một số phần mềm thiết kế web
Phần mềm không hỗ trợ giao diện TK: Notepad, Text pad,..
PM hỗ trợ thiết kế FrontPage: 2000, 2003, Expression Web (2007) Macromedia Dreamweaver: MX, 8,..
MS VS Studio 2000, 2003, 2005,..
PHP Designer Các ví dụ http://nguyenduccuong.com Slide 18 http://longcuong.com.vn
Tạo siêu liên kết
object _seft _top Tên cửa sổ http://nguyenduccuong.com Slide 19 http://longcuong.com.vn
Web tĩnh – động
Website tĩnh: Được thiết kế bằng kỹ thuật HTML (Hypertext Mark up Language). Chỉ đáp ứng được việc giới thiệu thông tin cho người dùng xem.
Sử dụng thêm các kỹ thuật như Java Script, Flash Macromedia hay Animation Gif.
Web động (dynamic web): ASP (Active Server Pages) chạy Windows PHP (PHP Hypertext Preprocessor) với Linux. JSP (Java Server Page) – Linux, Window http://nguyenduccuong.com Slide 20 http://longcuong.com.vn
Web site động
Người sử dụng không cần có nhiều kỹ thuật web Tin tức (CMS) Inner search: Member account: Shopping Cart: Online Payment: Forum: E-learning (học trực tuyến) http://nguyenduccuong.com Slide 21 http://longcuong.com.vn
Web site động
Quảng bá công ty, nhà trường, cá nhân,..
Thương mại Điện Tử (E-Commerce): Quản lý từ xa (Remote Management): phù hợp công ty có nhiều chi nhánh ở các vị trí khác nhau Công cụ cho nguời quản lý web: cho phép cập nhật thông tin mà không cần có kiến thức nhiều về TK web Diễn đàn trực tuyến: tạo tính chuyên nghiệp. http://nguyenduccuong.com Slide 22 http://longcuong.com.vn
Web site động
Gồm 2 phần: Phần Front-End – phần dành cho phía người sử dụng – xem nội dung Phần Back – End: phần quản trị dành cho nhà quản lý web site http://nguyenduccuong.com Slide 23 http://longcuong.com.vn
Điều kiện thiết lập web động
Hiểu biết HTML, CSS,..
Cơ sở dữ liệu: MS Access, Sql Server, MySql..
Ngôn ngữ lập trình: Asp.Net, PHP..
Web Server: IIS, Apache,..
http://nguyenduccuong.com Slide 24 http://longcuong.com.vn