課程簡介
Web網頁前端精品班
第.一階段(設計與軟件技能)
前端預科班Dreamweaver 講解DW的人性化功能以及在頁面架構和前端開發(fā)應用領域的使用技巧,html基礎應用,快速入門,css樣式表的應用,網站的管理和維護
Illustrator 廣泛應用于出版、多媒體和UI圖標界面設計的工業(yè)標準矢量插畫的軟件,印刷和Web網絡創(chuàng)作的專業(yè)平臺,針對Web和移動的改進、介紹多個畫板、觸摸式創(chuàng)意工具等新鮮特性
Fireworks 講解FW在網頁切片、圖層、幀、gif動畫、畫布設置中的應用以及配合其他軟件進行使用
Photoshop 熟練掌握PS在圖像編輯、圖像合成、校色調色及特效制作四大部分的技巧以及配合其他軟件的應用
培訓目標 熟練掌握PS在圖像編輯、圖像合成、校色調色及特效制作四大部分的技巧以及配合其他軟件的應用
第二階段(web前端 PC端和移動端項目開發(fā))
web前端
HTML5+CSS3 HTML標簽 1.HTML5入門與簡介
2.文本、圖像、鏈接、表格、列表、表單、框架(iframe)等標簽
3.HTML5新增的智能表單
4.HTML5新增的結構化標簽
隨堂項目:
1.文章頁面的結構化布局。包括文章標題、正文、圖片、頁面背景、作者、發(fā)表時間等信息
2.利用table標簽課程表的實現(xiàn)
3.利用form、input表單標簽實現(xiàn)簡單登錄注冊頁面
CSS基礎語法
常見樣式 1.CSS3語法規(guī)則
2.CSS3三種引入方式
3.標簽的常見屬性
4.CSS3中常見文字格式化處理
5.CSS3中常見顏色的表達方式
隨堂項目:一般導航欄的制作
CSS選擇器 1.什么是CSS選擇器
2.ID選擇器、class選擇器、元素選擇器
3.偽類選擇器、結構化偽類選擇器、屬性選擇器、兄弟選擇器、子元素選擇器
CSS盒子模型 1.什么是和盒子模型
2.盒子模型的內容區(qū)、邊框、內邊距、外邊距
3.知曉盒子模型各個屬性的使用場景
隨堂項目:導航欄的制作,利用盒子模型拉開間距、hover效果添加后的內邊距設定
浮動與定位 1.float的使用
2.利用clear 清除浮動
3.利用overflow消除float對于父容器的影響
4.position定位中的:static、fixed、absolute、relative的使用
隨堂項目:導航欄左右布局的定位、二級菜單的實現(xiàn)、回到頂部的按鈕
響應式布局與頁面優(yōu)化處理 1.移動頁面與PC端頁面布局時候需要注意點
2.響應式布局的實現(xiàn)原理
3.各種瀏覽器對于CSS樣式的支持情況
4.頁面優(yōu)化需要注意的地方
5.解決跨瀏覽器兼容性問題
隨堂項目:移動端的用戶注冊頁面、PC端的用戶注冊頁面。
實戰(zhàn)項目 1.熟悉網頁前端開發(fā)的完整流程
2.PS設計稿的切圖操作
3.導航欄的設計與實現(xiàn)
4.二級菜單的設計與實現(xiàn)
5.網頁布局中的排列技巧
6.商品列表的設計與實現(xiàn)
7.hover效果搭配陰影效果在網頁設計中的使用技巧 8.列表在網頁設計中的使用技巧
9.盒子模型的使用技巧
培訓目標:1.根據PS設計稿完成官方網頁首頁的代碼編寫
2.知曉整個團隊開發(fā)協(xié)作流程能夠獨立的擔任前端開發(fā)工作
web前端
JavaScript 開發(fā)
核心語法 1.javascript基礎語法
2.javascript的引入方式
3.javascript中的對象、數組、變量
4.流程控制(if…else switch…case while for)
隨堂項目:九九乘法表、閏年計算、誰是高富帥(if…else.. Switch…case)
BOM與DOM操作 1.熟知瀏覽器中的對象BOM,并利用javascript操作它
2.熟知文檔對象模型DOM。并利用javascript操作它
隨堂項目:網頁時鐘的制作、回到頂部
事件編程 1.javascript的事件機制
2.常見的JS事件:單擊、雙擊、移動、懸停、焦點的獲取與失去、瀏覽器的關閉與加載
隨堂項目:1.選不中的按鈕的實現(xiàn)2.簡單功能計算機的實現(xiàn)
正則表達式、面向對象編程、錯誤處理 1.正則表達式的語法基礎
2.利用正則表達式做字符匹配
3.面向對象編程
4.javascript的處理處理機制
隨堂項目:郵箱格式的驗證、編寫一個獲取常見輸入數據的格式驗證類。
JQuery 1.JQuery基礎語法
2.JQuery選擇器
3.JQuery的BOM與DOM操作
4.JQuery事件編程
4.Jquery常見動畫與自定義動畫編程
隨堂項目:打地鼠游戲、抽獎輪盤制作
JQuery
項目實戰(zhàn) 1.圖片輪播 2.利用jQuery制作拼圖 3.貪吃蛇
Ajax技術 1.什么是Ajax技術
2.json格式與XML格式詳解
3.Ajax的post與get兩種提交方式詳解
4.服務器端的數據反饋機制說明
5.如何利用jQuery實現(xiàn)Ajax提交
隨堂項目:用戶注冊、登錄的Ajax無刷新實現(xiàn)、淘寶收貨地址中省聯(lián)的實現(xiàn)