關(guān)于我們
書單推薦
新書推薦
|
電子商務(wù)網(wǎng)頁設(shè)計(jì)與制作(慕課版) 隨著網(wǎng)上購(gòu)物的不斷流行,電子商務(wù)成為了互聯(lián)網(wǎng)時(shí)代的新興商務(wù)模式,電子商 1.本書將職業(yè)場(chǎng)景引入課堂教學(xué),設(shè)計(jì)以米拉和領(lǐng)導(dǎo)老洪為主人公的故事情節(jié),將整本書的知識(shí)點(diǎn)串聯(lián)起來,讓讀者有貼近實(shí)際工作的體會(huì)。 2.本書采用Photoshop CS6和Dreamweaver CS6為教學(xué)軟件,舉例了電商系統(tǒng)中常用的網(wǎng)頁、商品圖、優(yōu)惠券、商家等案例,具有實(shí)際參考價(jià)值。 3.作者為重要的操作錄制了教學(xué)視頻,讀者可以通過掃碼觀看教學(xué)視頻跟隨操作。 4.本書提供了所有書中提到的案例的素材和效果文件,并附贈(zèng)了教學(xué)大綱、PPT、素材等教學(xué)資源,方便教師上課教學(xué)和讀者自學(xué)。
作者長(zhǎng)期從事電子商務(wù)專業(yè)、電子商務(wù)網(wǎng)頁設(shè)計(jì)課程教學(xué),教學(xué)經(jīng)驗(yàn)豐富,同時(shí)具有豐富的實(shí)操技能和項(xiàng)目經(jīng)驗(yàn)。
第 1章 電子商務(wù)網(wǎng)頁設(shè)計(jì)與網(wǎng)站建設(shè)基礎(chǔ)
1.1 電子商務(wù)網(wǎng)頁設(shè)計(jì)基礎(chǔ)知識(shí) 2 1.1.1 認(rèn)識(shí)網(wǎng)站與網(wǎng)頁...........................................2 1.1.2 電子商務(wù)網(wǎng)站概述.......................................2 1.1.3 電子商務(wù)網(wǎng)站的主要內(nèi)容和功能..............2 1.1.4 網(wǎng)頁常見布局結(jié)構(gòu).......................................3 1.1.5 網(wǎng)頁的基本構(gòu)成元素...................................3 1.1.6 網(wǎng)頁常用術(shù)語...............................................4 1.1.7 網(wǎng)頁色彩搭配...............................................4 1.1.8 HTML標(biāo)記語言............................................6 1.2 課堂案例:創(chuàng)建“宅家商城”網(wǎng)站 9 1.2.1 電子商務(wù)網(wǎng)站開發(fā)流程...............................9 1.2.2 網(wǎng)站制作流程.............................................10 1.2.3 Dreamweaver CS6工作界面........................12 1.2.4 創(chuàng)建本地站點(diǎn).............................................13 1.2.5 編輯站點(diǎn).....................................................13 1.2.6 管理站點(diǎn)和站點(diǎn)文件夾.............................14 1.3 項(xiàng)目實(shí)訓(xùn) 15 1.3.1 賞析營(yíng)銷類電子商務(wù)網(wǎng)站.........................15 1.3.2 規(guī)劃并創(chuàng)建“婚紗網(wǎng)”站點(diǎn)....................17 1.4 課后練習(xí) 18 練習(xí)1:規(guī)劃燈飾照明電子商務(wù)網(wǎng)站..................18 練習(xí)2:創(chuàng)建“格什溫電器”站點(diǎn)......................18 1.5 技巧提升 19 1.站點(diǎn)命名規(guī)則...................................................19 2.網(wǎng)頁設(shè)計(jì)師需要知道的網(wǎng)頁設(shè)計(jì)內(nèi)容..........19 3.網(wǎng)頁設(shè)計(jì)需要遵循的原則...............................19 4.網(wǎng)站設(shè)計(jì)時(shí)的色彩聯(lián)想...................................20 第 2章 使用Photoshop處理產(chǎn)品圖像 2.1 Photoshop基本操作 22 2.1.1 設(shè)置前景色與背景色.................................22 2.1.2 圖層的基本操作.........................................22 2.1.3 裁剪并更改圖像尺寸.................................23 2.1.4 批處理圖像.................................................24 2.2 課堂案例:調(diào)整產(chǎn)品圖像的亮度 與對(duì)比度 25 2.2.1 提高亮度與對(duì)比度.....................................26 2.2.2 調(diào)整高光、陰影和中間調(diào).........................26 2.2.3 增強(qiáng)亮度與暗度的對(duì)比.............................29 2.3 課堂案例:修飾產(chǎn)品圖像的瑕疵 30 2.3.1 矯正偏色.....................................................30 2.3.2 清除污漬.....................................................31 2.3.3 光滑材質(zhì)表面.............................................32 2.3.4 增加金屬質(zhì)感.............................................33 2.4 課堂案例:摳取并合成產(chǎn)品圖像 35 2.4.1 摳取簡(jiǎn)單背景.............................................35 2.4.2 摳取復(fù)雜圖形.............................................37 2.4.3 摳取毛發(fā).....................................................39 2.4.4 摳取半透明物體.........................................40 2.5 項(xiàng)目實(shí)訓(xùn) 44 2.5.1 為原汁機(jī)更換背景.....................................44 2.5.2 打造街拍圖像風(fēng)格.....................................45 2.6 課后練習(xí) 46 練習(xí)1:為沙發(fā)更換背景.......................................46 練習(xí)2:處理金屬材質(zhì)...........................................47 2.7 技巧提升 48 1.文字的應(yīng)用.......................................................48 2.使用調(diào)整圖層...................................................48 第3章 使用Photoshop設(shè)計(jì)網(wǎng)頁元素 3.1 課堂案例:設(shè)計(jì)網(wǎng)頁橫幅廣告 50 3.1.1 制作通欄橫幅廣告.....................................50 3.1.2 制作常規(guī)橫幅廣告.....................................54 3.2 課堂案例:設(shè)計(jì)網(wǎng)頁海報(bào) 55 3.2.1 制作全屏輪播海報(bào).....................................56 3.2.2 制作常規(guī)輪播海報(bào).....................................60 3.3 課堂案例:設(shè)計(jì)產(chǎn)品推廣圖 63 3.3.1 制作橫向產(chǎn)品推廣圖................................63 3.3.2 制作常規(guī)產(chǎn)品推廣圖................................65 3.4 項(xiàng)目實(shí)訓(xùn) 66 3.4.1 設(shè)計(jì)化妝品橫幅廣告................................66 3.4.2 設(shè)計(jì)洗衣機(jī)全屏海報(bào)................................67 3.5 課后練習(xí) 68 練習(xí)1:制作女包全屏輪播海報(bào)..........................68 練習(xí)2:設(shè)計(jì)宅家商城海報(bào)..................................69 3.6 技巧提升 70 1.網(wǎng)頁導(dǎo)航欄設(shè)計(jì)技巧.......................................70 2.電子商務(wù)網(wǎng)頁元素設(shè)計(jì)注意事項(xiàng)..................70 第4章 使用Photoshop設(shè)計(jì)網(wǎng)站界面 4.1 課堂案例:制作“宅家商城”主頁 72 4.1.1 設(shè)計(jì)網(wǎng)頁頭部.............................................73 4.1.2 網(wǎng)頁內(nèi)容設(shè)計(jì).............................................77 4.1.3 網(wǎng)頁底部設(shè)計(jì).............................................88 4.2 課堂案例:輸出“宅家商城”網(wǎng)站 主頁 90 4.2.1 創(chuàng)建切片.....................................................91 4.2.2 輸出切片.....................................................92 4.3 項(xiàng)目實(shí)訓(xùn) 93 4.3.1 制作“返場(chǎng)活動(dòng)”網(wǎng)頁效果圖................93 4.3.2 設(shè)計(jì)“矮凳詳情頁”效果圖....................96 4.4 課后練習(xí) 98 練習(xí)1:設(shè)計(jì)“墨韻婚紗”網(wǎng)站首頁..................98 練習(xí)2:設(shè)計(jì)“燈具網(wǎng)主頁”效果圖..................99 4.5 技巧提升 100 1.網(wǎng)頁效果圖設(shè)計(jì)技巧.....................................100 2.組合切片.........................................................100 3.直接輸出為HTML文件..................................100 第5章 使用Dreamweaver制作基礎(chǔ)網(wǎng)頁 5.1 課堂案例:制作“代金券說明”網(wǎng)頁 102 5.1.1 創(chuàng)建網(wǎng)頁文檔...........................................102 5.1.2 設(shè)置頁面屬性...........................................103 5.1.3 添加文字...................................................104 5.1.4 設(shè)置文字格式...........................................104 5.1.5 添加水平線...............................................107 5.1.6 保存、預(yù)覽和關(guān)閉網(wǎng)頁文檔..................108 5.2 課堂案例:美化“幫助中心”網(wǎng)頁 109 5.2.1 插入與編輯圖像.......................................109 5.2.2 優(yōu)化圖像...................................................111 5.2.3 創(chuàng)建鼠標(biāo)經(jīng)過圖像...................................112 5.2.4 插入Flash動(dòng)畫..........................................113 5.2.5 添加背景音樂...........................................114 5.3 課堂案例:網(wǎng)頁跳轉(zhuǎn)設(shè)計(jì) 115 5.3.1 認(rèn)識(shí)超鏈接...............................................116 5.3.2 插入文字超鏈接.......................................118 5.3.3 創(chuàng)建空鏈接...............................................120 5.3.4 創(chuàng)建圖像超鏈接.......................................120 5.3.5 創(chuàng)建圖像熱點(diǎn)超鏈接..............................121 5.3.6 創(chuàng)建錨點(diǎn)超鏈接.......................................121 5.3.7 創(chuàng)建電子郵件超鏈接..............................122 5.3.8 創(chuàng)建外部超鏈接.......................................123 5.3.9 創(chuàng)建腳本鏈接...........................................123 5.4 項(xiàng)目實(shí)訓(xùn) 124 5.4.1 美化“酒店預(yù)訂”網(wǎng)頁..........................124 5.4.2 為“墨韻”網(wǎng)頁設(shè)計(jì)網(wǎng)頁跳轉(zhuǎn)..............126 5.5 課后練習(xí) 128 練習(xí)1:制作“小兒郎學(xué)校簡(jiǎn)介”網(wǎng)頁............128 練習(xí)2:制作“服裝”網(wǎng)頁................................128 5.6 技巧提升 129 1.添加日期.........................................................129 2.在CSS中定義超鏈接樣式a:link、a:visited、 a:hover、a:active的順序.................................129 3.刪除鏈接圖片上的藍(lán)色邊框........................130 4.設(shè)置鼠標(biāo)移動(dòng)到文字鏈接上改變文字 的大小或顏色................................................130 5.添加滾動(dòng)文字.................................................130 6.1 課堂案例:布局“宅家商城”主頁 132 6.1.1 認(rèn)識(shí)CSS樣式............................................133 6.1.2 認(rèn)識(shí)Div+CSS布局模式............................133 6.1.3 Div+CSS布局模式的優(yōu)勢(shì)........................134 6.1.4 插入并編輯Div.........................................135 6.1.5 創(chuàng)建與編輯CSS樣式................................138 6.1.6 應(yīng)用CSS樣式............................................140 6.1.7 使用AP Div元素.......................................143 6.2 課堂案例:制作“產(chǎn)品展示”部分 145 6.2.1 創(chuàng)建表格...................................................147 6.2.2 調(diào)整表格結(jié)構(gòu)...........................................148 6.2.3 設(shè)置表格和單元格...................................149 6.2.4 在表格中插入內(nèi)容...................................151 6.3 項(xiàng)目實(shí)訓(xùn) 154 6.3.1 制作“歇山園林”網(wǎng)頁..........................154 6.3.2 制作“花店”網(wǎng)頁...................................155 6.4 課后練習(xí) 158 練習(xí)1:布局“墨韻婚紗”首頁........................158 練習(xí)2:布局“酒店預(yù)訂”網(wǎng)頁........................159 6.5 技巧提升 160 1.CSS樣式鏈接..................................................160 2.批量設(shè)置AP Div.............................................160 3.導(dǎo)入表格數(shù)據(jù).................................................160 7.1 課堂案例:制作“宅粉注冊(cè)”網(wǎng)頁 162 7.1.1 認(rèn)識(shí)表單...................................................162 7.1.2 創(chuàng)建表單...................................................163 7.1.3 插入表單對(duì)象...........................................164 7.2 課堂案例:完善網(wǎng)頁行為效果 173 7.2.1 行為的基礎(chǔ)知識(shí).......................................173 7.2.2 彈出窗口...................................................175 7.2.3 打開瀏覽器窗口.......................................176 7.2.4 檢查表單...................................................177 7.3 項(xiàng)目實(shí)訓(xùn) 179 7.3.2 制作“用戶注冊(cè)”網(wǎng)頁..........................179 7.3.2 為網(wǎng)頁添加行為.......................................180 7.4 課后練習(xí) 182 練習(xí)1:制作“寵物網(wǎng)注冊(cè)”頁面....................182 練習(xí)2:制作“學(xué)員注冊(cè)”網(wǎng)頁........................183 練習(xí)3:制作“登錄”頁面................................183 7.5 技巧提升 184 8.1 課堂案例:制作“新品體驗(yàn)”網(wǎng)頁 186 8.1.1 認(rèn)識(shí)“資源”面板...................................187 8.1.2 創(chuàng)建庫(kù)文件...............................................187 8.1.3 應(yīng)用庫(kù)文件...............................................189 8.2 課堂案例:制作“宅家優(yōu)購(gòu)”頁面 190 8.2.1 創(chuàng)建模板...................................................192 8.2.2 創(chuàng)建可編輯區(qū)域.......................................192 8.2.3 應(yīng)用與管理模板.......................................193 8.3 項(xiàng)目實(shí)訓(xùn) 196 8.3.1 利用“庫(kù)”快速制作“酒店預(yù)訂” 頁面。196 8.3.2 制作“婚紗詳情頁”網(wǎng)頁模板..............197 8.4 課后練習(xí) 199 練習(xí)1:制作“精品推廣”頁面........................199 練習(xí)2:制作“花店”網(wǎng)頁................................200 8.5 技巧提升 201 1.編輯已有的庫(kù)文件.........................................201 2.更新庫(kù)文件.....................................................201 3.分離庫(kù)文件.....................................................201 4.創(chuàng)建重復(fù)區(qū)域.................................................202 5.創(chuàng)建可選區(qū)域.................................................202 6.創(chuàng)建可編輯的可選區(qū)域................................202 4 目 錄 9.1 課堂案例:搭建動(dòng)態(tài)網(wǎng)站平臺(tái) 204 9.1.1 認(rèn)識(shí)動(dòng)態(tài)網(wǎng)頁...........................................204 9.1.2 動(dòng)態(tài)網(wǎng)頁常用的開發(fā)語言......................204 9.1.3 動(dòng)態(tài)網(wǎng)頁的開發(fā)流程..............................206 9.1.4 認(rèn)識(shí)Web服務(wù)器.......................................207 9.1.5 安裝與配置IIS..........................................207 9.1.6 使用Access創(chuàng)建數(shù)據(jù)表...........................209 9.1.7 創(chuàng)建與配置動(dòng)態(tài)站點(diǎn)..............................210 9.1.8 創(chuàng)建數(shù)據(jù)源...............................................212 9.2 課堂案例:制作“用戶登錄” 動(dòng)態(tài)網(wǎng)頁 214 9.2.1 創(chuàng)建記錄集...............................................214 9.2.2 插入動(dòng)態(tài)表格...........................................215 9.2.3 創(chuàng)建記錄集導(dǎo)航.......................................216 9.2.4 插入記錄...................................................217 9.2.5 刪除記錄...................................................219 9.3 項(xiàng)目實(shí)訓(xùn) 219 9.3.1 制作“用戶登錄”網(wǎng)頁..........................219 9.3.2 制作“發(fā)貨記錄”網(wǎng)頁..........................221 9.4 課后練習(xí) 222 練習(xí)1:制作網(wǎng)站后臺(tái)系統(tǒng)................................223 練習(xí)2:制作“注冊(cè)”動(dòng)態(tài)頁面........................223 9.5 技巧提升 224 10.1 課堂案例:電子商務(wù)平臺(tái)網(wǎng)頁制作 226 10.1.1 目前主流的電子商務(wù)平臺(tái)....................226 10.1.2 電子商務(wù)平臺(tái)網(wǎng)頁制作要求和注意 事項(xiàng).........................................................228 10.2 課堂案例:使用圖片空間 229 10.2.1 進(jìn)入圖片空間的方法............................229 10.2.2 上傳圖像到圖片空間............................229 10.2.3 移動(dòng)空間圖像.........................................231 10.2.4 刪除與替換空間圖像............................232 10.3 課堂案例:使用模塊裝修店鋪 233 10.3.1 認(rèn)識(shí)裝修模塊.........................................234 10.3.2 裝修頁頭.................................................234 10.3.3 裝修熱點(diǎn).................................................236 10.3.4 裝修其他模塊.........................................238 10.4 項(xiàng)目實(shí)訓(xùn) 240 10.4.1 裝修產(chǎn)品詳情頁.....................................240 10.4.2 裝修分類導(dǎo)航模塊.................................241 10.5 課后練習(xí) 242 練習(xí)1:裝修耳機(jī)店鋪頁頭................................242 練習(xí)2:裝修耳機(jī)詳情頁.....................................243 10.6 技巧提升 243 1.電商平臺(tái)店鋪首頁設(shè)計(jì)的注意事項(xiàng)............243 2.電商平臺(tái)店鋪首頁布局的要點(diǎn)....................244 第9章 制作動(dòng)態(tài)網(wǎng)頁鏈接網(wǎng)站后臺(tái) 第 10章 電子商務(wù)平臺(tái)的網(wǎng)頁制作與上傳 11.1 實(shí)訓(xùn)目標(biāo) 246 11.2 專業(yè)背景 247 11.3 制作思路分析 247 11.4 準(zhǔn)備工作 248 11.4.1 站點(diǎn)規(guī)劃.................................................248 11.4.2 素材收集.................................................248 11.5 操作過程 248 11.5.1 使用Photoshop設(shè)計(jì)網(wǎng)頁效果圖............248 11.5.2 使用Dreamweaver合成網(wǎng)頁...................260 11.6 項(xiàng)目實(shí)訓(xùn) 266 11.6.1 制作“微觀多肉植物”網(wǎng)頁................266 11.6.2 制作珠寶官網(wǎng)頁面.................................267 11.7 課后練習(xí) 269 練習(xí)1:制作“產(chǎn)品中心”頁面........................269 練習(xí)2:制作“聯(lián)系我們”頁面........................270 第 11章 綜合案例——綜合案例——制作墨韻箱包館網(wǎng)頁
你還可能感興趣
我要評(píng)論
|