Thiết kế & phát triển Website

Thông tin khóa học

Nội dung khóa học

Thời lượng: 150h

Mã lớp: WPM

Học phí:http://vnskills.com.vn/?option=education&task=detail&id=105

Mục đích:

Trang bị cho học viên kiến thức về thiết kế và phát triển website:
1. Khái niệm về thiết kế và phát triển website, ứng dụng đồ họa hoạt hình tương tác trên nền Flash dành cho môi trường web.
2. Phân tích cấu trúc các tiến trình thiết kế và phát triển website.
3. Xây dựng cấu trúc site, phát triển cây thư mục và quản lý tài nguyên trong quá trình thiết kế và phát triển website.
4. Thiết kế giao diện đồ họa, giao diện template và phát triển tương tác website.
5. Đưa các nội dung multimedia vào website.

Các môn học:

1. Phân loại website – các xu hướng thiết kế, các công nghệ website (Cơ sở thiết kế website).
2. Tìm hiểu các công đoạn thiết kế và phát triển website, các kiến thức và khái niệm liên ảnh hưởng đến toàn bộ quá trình thiết kế - phát triển website (Nguyên lý thiết kế website).
3. Thiết kế giao diện các thành phần đồ họa website với Adobe Photoshop.
4. Thiết kế web cơ bản với nền tảng HTML (Nhập môn HTML).
5. Thiết kế web chuyên nghiệp với Adobe Dreamweaver (Adobe Dreamweaver Design).
6. Phát triển web chuyên nghiệp với Adobe Dreamweaver Development
7. Thiết kế đồ họa động và tương tác trên web dựa trên nền Adobe Flash.
8. Thi cuối khóa
9. Đồ án

Thu hoạch sau khóa học:

Sau khi hoàn thành chương trình, học viên sẽ nắm rõ các quy chuẩn cũng như khái niệm về thiết kế và phát triển trên môi trường web, có thể phân tích hệ thống, xây dựng website với độ phức tạp, tích hợp các nội dung Multimedia như Flash, Music, Video,…

Cơ hội nghề nghiệp:

Với kiến thức sau khi hoàn thành khóa học, học viên có thể làm việc tại các công ty thiết kế và xây dựng website, các công ty cung cấp nội dung số trên môi trường mạng ở các vị trí Web Designer. Hơn nữa có thể có khả năng nhìn một cách tổng quan về toàn bộ quá trình thiết kế cũng như phát triển website. Nắm rõ được các quy trình, các thành phần tham gia vào quá trình hình thành lên một website để có thể dễ dàng phân tích và điều hướng xây dựng website phù hợp nhất.

Chương trình học

I. Adobe Photoshop

Giúp học viên nắm được quy chuẩn thiết kế giao diện website, các định dạng ảnh sử dụng trong môi trường web, các bước triển khai thiết kế giao diện website trên Photoshop, cách cắt ảnh để chuyển sang dựng giao diện trên Dreamweaver…

• Tìm hiểu giao diện Adobe Photoshop, bản chất ảnh số và điểm ảnh, vùng chọn, các công cụ chọn, công cụ Move Tool, bảng Layer, Cách cắt ghép ảnh, lệnh Transform…
• Hộp màu, lệnh tô màu, các kiểu tô màu, công cụ tô chuyển, Menu Image với các lệnh về chỉnh màu, định dạng màu. Hộp công cụ với công cụ Pen, tạo path, Shap Layer…
• Công cụ cắt xén, chia ảnh. Định dạng ảnh cho web, Save for web. Lưu thiết kế giao diện thành trang HTML với các nút bấm có chứa Link. Action, lệnh Automate/Bath
• Các vấn đề về Layer Style, Style, Filter…Adjustment Layer, các công cụ chỉnh sửa ảnh, Layer Mask…
• …

II. Nhập môn HTML

Giúp học viên nắm được bản chất cốt lõi của 1 trang web với cơ sở là ngôn ngữ HTML, để từ đó biết điều chỉnh, bổ sung, sửa chữa trang khi làm việc trên Dreamweaver.

• - Giới thiệu nguyên lý để trình duyệt hiểu và hiển thị HTML, cấu trúc HTML và các thẻ HTML định dạng cơ bản.
• - Tìm hiểu cách hiển thị hình ảnh trên trình duyệt với thẻ HTML.
• - Cách tạo các loại siêu liên kết text, hình ảnh
• - Tạo các danh sách trên web với thẻ HTML
• - Hiển thị dữ liệu dạng bảng
• - …
  

III. Adobe Dreamweaver Design

Giúp học viên làm chủ công cụ thiết kế web chuyên nghiệp nhất, biết cách xây dựng trang mẫu, định dạng các thành phần trang như bảng, text, biết cách xây dựng tệp điều khiển CSS, xây dựng Form, đưa các lệnh Javascript vào trang, xây dựng và ứng dụng Template trong việc dựng và quản lý site…

• - Làm quen giao diện Dreamweaver và phương pháp và môi trường làm việc của Dreamwaver.
• - Chế độ hiệu chỉnh và định dạng CSS
• - Tìm hiểu cách căn chỉnh văn bản, cách hiển thị các thành phần văn bản với CSS.
• - Cách định dạng khung viền cho các vùng đồ họa website dựa trên CSS.
• - Ứng dụng nền CSS làm các loại nền đồ họa template.
• - Phân tích bố cục giao diện đồ họa website từ Photoshop, phân tách các vùng bố cục website. Phác thảo bố cục và định nghĩa các vùng bố cục với thẻ
  .
• - Dựng trang với kỹ thuật – DIV Layout (không sử dụng table). Định dạng và căn chỉnh các vùng DIV với hỗ trợ của CSS.
• - Tìm hiểu về script tương tác client, hỗ trợ nâng khả năng giao diện. Bản chất ngôn ngữ DHTML (HTML + CSS + Javascript). Ứng dụng javascript vào tạo các thành phần tương tác giao giao diện website.
• - Tìm hiểu các tiện ích bảng Behavior.
• - Mang lại giao diện đồ họa cho các đối tượng form. Thiết kế các đối tượng form với hình dáng và định dạng bất kỳ với sự hỗ trợ của CSS. Sử dụng một số bộ form web 2.0 thiết kế sẵn của Dreamweaver: Spry Objects. Tạo sự kiểm duyệt client form với công cụ Validate Form.

IV. Adobe Flash

Giúp học viên làm chủ công cụ thiết kế Flash để thiết kế các thành phần của website như banner, nút bấm, các quảng cáo, logo, album giới thiệu sản phẩm bằng Flash để tăng thêm độ hấp dẫn và sự tương tác cho khách hàng với website.

• - Làm quen giao diện Flash và phương pháp và môi trường làm việc của Flash.
• - Các phương pháp diễn hoạt đối tượng trong Flash: Motion Tween, Shape Tween, Frame by Frame…
• - Đường dẫn – Motion Guidle, Mặt nạ - Mask
• - Thư viện các thành phần trong Flash
• - Các Object trong Flash: Movie, Button, Graphics..
• - Các lệnh cơ bản trong Flash
• - Xây dựng banner, album giới thiệu sản phẩm ….
• - …

V. Adobe Dreamweaver Development

Tận dụng sức mạnh của Dreamweaver trong việc hỗ trợ xây dựng website với các công cụ trực quan để quản lý và kết nối, cập nhật trực tuyến CSDL động, quản lý Remote View, hỗ trợ nhiều ngôn ngữ lập trình như ASP, PHP, XML, Javascript… để hoàn thành một website với CSDL động

• - Tìm hiểu các khái niệm liên quan đến web động bao gồm client (người dùng), server (máy chủ), database (cơ sở dữ liệu) và dynamic language (ngôn ngữ động). Cách thức hoạt động thông thường của các trang web động (tìm hiểu cách thức mà web động có thể lấy và kết hợp dữ liệu (database) với giao diện (HTML) để đưa ra web động – các trạng, cập nhật,…. Các thao tác định nghĩa website, kết nối định nghĩa dữ liệu cơ bản.
• - Tạo database cơ bản với Microsoft Access nếu dùng máy chủ windows ASP hoặc MySQL nếu sử dụng máy chủ Linux. Thiết lập môi trường phát triển web động dựa vào công cụ Site Manager có kết nối máy chủ (theo đường local và đường ftp). Tạo kết nối csdl để sử dụng chung trong môi trường phát triển web động với bảng Database của Dreamweaver.
• - Cách thức viết dữ liệu động theo từng ngôn ngữ khác nhau (PHP / ASP ) một cách trực quan dễ dàng với bảng Insert > PHP/ ASP. Tạo ra các file dùng chung với khả năng Include file đặc trưng của web động. Tạo khối chèn lệnh động và lệnh viết dữ liệu ra với công cụ chèn đơn giản Ouput.
• - Tạo điều kiện hiển thị dữ liệu web site thông qua công cụ nhóm (If … Else … End)
• - Tìm hiểu về cách thức Response (hồi đáp) dựa vào Request (yêu cầu) tạo lên môi trường động trong web site. Thông qua bảng công cụ trực quan của Dreamweaver.
• - Làm việc với dữ liệu động từ database và một số công cụ trực quan dựa trên Dialog.
• - Tạo bảng liệt kê thông tin thông qua truy vấn Record Set.
• - Tạo form bổ xung thông tin Add Record.
• - Tạo bảng liệt kê thông tin thông qua truy vấn có khả năng cho phép biên tập nội dung.
• - Tạo form sửa thông tin Edit Record.
• - Tạo bảng liệt kê thông tin thông qua cho phép xóa nội dung. Tạo form sửa thông tin Delete Record.
• - Tạo bảng liệt kê thông tin thông qua cho phép phân trang (Record Navigation Bar). Tạo bảng liệt kê thông tin thông qua cho phép sắp xếp dữ liệu (Sort).
• - Tạo bảng liệt kê thông tin thông qua cho phép chọn lọc dữ liệu (Filter).
• - Tạo trang tin hiển thị dữ liệu với sự kết hợp các thành phần. Tạo trang liệt kê tin tức (List News).
• - Tạo trang xem chi tiết thông tin (News Detail).Tạo một số thành phần phụ (Hot News, Relate News).
• - Tổng kết phần Dynamic với Dreamweaver. Hướng dẫn tạo một website đơn giản cho việc cập nhật và hiển thị dữ liệu động.

Đồ án

Sẽ có bài tập lớn cuối kỳ cho học viên, học viên đăng ký chủ đề thiết kế 1 website, giáo viên sẽ tham gia trong suốt quá trình như góp ý, phân tích, trợ giúp để học viên hoàn thành đề tài với chất lượng cao nhất.

LỊCH KHAI GIẢNG & HỌC PHÍ

• Để biết lịch khai giảng cụ thể, bạn vui lòng click vào đây

• VnSkills luôn có chính sách ưu đãi học phí cho các bạn, vui lòng liên hệ chúng tôi để biết thêm chi tiết

THÔNG TIN LIÊN HỆ

Vũ Thị Huệ
Consultant
VnSkills Academy [www.vnskills.com.vn]

INFORMATION TECHNOLOGY INSTITUTE (ITI)

VIETNAM NATIONAL UNIVERSITY (VNU)

Phone:(04).36284956 / Y!: tuvan.vnskills1

Mobile: 01636 843 493 / Email:huevt.vns@gmail.com

Backoffice: 1706-Level 17, A1 Building, 229 Pho Vong, Hai Ba Trung, HN

Nhà đào tạo