課程平臺制作流程ppt課件

1、精品課程建立流程闡明會主講人：楊一1網(wǎng)站建立與維護(hù)興趣組培訓(xùn)一、網(wǎng)頁和網(wǎng)站的關(guān)系2二、網(wǎng)站制造的流程三、如何發(fā)布網(wǎng)站1、什么是網(wǎng)頁2、網(wǎng)頁的定義3、網(wǎng)頁的構(gòu)成4、網(wǎng)頁的分類5、網(wǎng)站制造的相關(guān)工具目錄3一、網(wǎng)頁和網(wǎng)站的關(guān)系什么是網(wǎng)頁？網(wǎng)頁(web page)，是網(wǎng)站中的一頁，通常是HTML格式文件擴(kuò)展名為.html或 .htm或 .asp或 .aspx或 .php或 .jsp等。網(wǎng)頁的定義網(wǎng)頁是構(gòu)成網(wǎng)站的根本元素，是承載各種網(wǎng)站運(yùn)用的平臺。通俗的說，您的網(wǎng)站就是由網(wǎng)頁組成的。假設(shè)您只需域名和虛擬主機(jī)而沒有制造任何網(wǎng)頁的話，您的客戶仍舊無法訪問您的網(wǎng)站。網(wǎng)頁的構(gòu)成文字與圖片是構(gòu)成一個網(wǎng)頁的兩個最根

2、本的元素。他可以簡單的了解為：文字，就是網(wǎng)頁的內(nèi)容。圖片，就是網(wǎng)頁的美觀。除此之外，網(wǎng)頁的元素還包括動畫、音樂、視頻、程序等等。文字資料圖像檔案Applet在頁面內(nèi)執(zhí)行的副程式超鏈結(jié)網(wǎng)頁的合成體為網(wǎng)站。目錄4一、網(wǎng)頁和網(wǎng)站的關(guān)系網(wǎng)站的分類？編程言語分類：asp網(wǎng)站、php網(wǎng)站、jsp網(wǎng)站、Asp. net網(wǎng)站等； 用途分類：門戶網(wǎng)站綜合網(wǎng)站、行業(yè)網(wǎng)站、文娛網(wǎng)站等； 功能分類：單一網(wǎng)站企業(yè)網(wǎng)站、多功能網(wǎng)站網(wǎng)絡(luò)商城等。 持有者分類：個人網(wǎng)站、商業(yè)網(wǎng)站、政府網(wǎng)站、教育網(wǎng)站等。 商業(yè)目的分類：營利型網(wǎng)站行業(yè)網(wǎng)站、論壇、非營利性型網(wǎng)站企業(yè)網(wǎng)站、政府網(wǎng)站、教育網(wǎng)站目錄5制造網(wǎng)站的相關(guān)工具？Dreamwea

3、ver：用與編輯HTML、ASP、JSP、PHP、javascript時的輔助工具。FLASH：網(wǎng)頁需求畫面流動時的首選擇。Photoshop：圖象處置軟件，普通網(wǎng)頁都需求有圖片相搭配，Adobe Photoshop是款很強(qiáng)大的工具。Aspmao：用于快速調(diào)試ASP網(wǎng)站程序的運(yùn)用工具。Flashfxp：發(fā)布網(wǎng)站的主要工具之一。一、網(wǎng)頁和網(wǎng)站的關(guān)系1、確定網(wǎng)站的主題2、確定網(wǎng)站的配色方案3、整理網(wǎng)站素材和內(nèi)容4、制定網(wǎng)站欄目和規(guī)劃5、謀劃網(wǎng)站并制造網(wǎng)頁及調(diào)試目錄6二、網(wǎng)站制造的流程目錄62.1 確定網(wǎng)站的主題 確定網(wǎng)站的主題,普通來說是確定網(wǎng)站的類型，如個人網(wǎng)站、新聞網(wǎng)站、游戲網(wǎng)站、房產(chǎn)網(wǎng)站、教

4、育網(wǎng)站等，不同的網(wǎng)站，其確定的主題都有一定的歸屬，網(wǎng)頁制造者設(shè)計網(wǎng)頁創(chuàng)建網(wǎng)站時，都應(yīng)該根據(jù)網(wǎng)站的類型來制造。主題是目的、內(nèi)容是根本，一個勝利的網(wǎng)站在內(nèi)容方面必需緊扣在主題的范圍之內(nèi)，才干不脫離網(wǎng)頁設(shè)計和制造的技術(shù)軌道。所以，確定網(wǎng)站的主題是制造網(wǎng)頁、創(chuàng)建網(wǎng)站的第一步，也是網(wǎng)站制造的關(guān)鍵。確定網(wǎng)站的主題可以從以下幾方面來定位：1主題定位要準(zhǔn)確2主題要小而精3題材最好是本人擅長或者喜歡的內(nèi)容4題材不要太濫或者目的太高目錄62.2 確定網(wǎng)站的配色方案 顏色搭配既是一項技術(shù)性任務(wù)，同時也是一項藝術(shù)性很強(qiáng)的任務(wù)，因此，設(shè)計者在設(shè)計網(wǎng)頁時除了思索網(wǎng)站本身的特點(diǎn)外，還要遵照一定的藝術(shù)規(guī)律，從而設(shè)計出顏色鮮明

5、、風(fēng)格獨(dú)特的網(wǎng)站。以下是一些顏色搭配的方法和技巧： 2.2.1網(wǎng)頁顏色搭配的原理2.2.2網(wǎng)頁顏色搭配的技巧2.2.3網(wǎng)頁顏色如何分配目錄62.2.1 網(wǎng)頁顏色的搭配原理顏色選用，是展現(xiàn)網(wǎng)站的風(fēng)格的重要手段之一。要學(xué)習(xí)顏色的選用，首先要了解黑白灰顏色的運(yùn)用，由于黑白灰是萬能色，可以跟恣意一種顏色搭配。當(dāng)運(yùn)用者為某種顏色的搭配苦惱的時候，不防試試用黑白灰。或者當(dāng)運(yùn)用者覺得兩種顏色的搭配不協(xié)調(diào)時，試試參與黑色或者灰色，或許會收到意想不到的效果。對一些明度較高的網(wǎng)站配以黑色，可以適當(dāng)?shù)亟档推涿鞫取０咨蔷W(wǎng)站用的最普通的一種顏色。很多網(wǎng)站甚至留出大塊的白色空間，作為網(wǎng)站的一個組成部分。 這就是留白藝術(shù)

6、。很多設(shè)計類網(wǎng)站會較多的運(yùn)用此種方式。留白，給人一個遐想的空間，讓人覺得心境酣暢。恰當(dāng)?shù)牧舭讓τ趨f(xié)調(diào)頁面的平衡起到相當(dāng)大的作用。對于顏色搭配要留意以下幾點(diǎn)：顏色鮮明：網(wǎng)頁的顏色要鮮明，容易引人注目。顏色獨(dú)特：要有與眾不同的顏色，或是點(diǎn)睛之筆，使得大家對網(wǎng)頁的印象劇烈。顏色適宜：顏色和想表達(dá)的內(nèi)容氣氛相適宜、協(xié)調(diào)。顏色聯(lián)想：不同顏色會產(chǎn)生不同的聯(lián)想，藍(lán)色想到天空，黑色想到黑夜，嚴(yán)肅，紅色想到喜事等，選擇顏色要和網(wǎng)頁的內(nèi)涵相關(guān)聯(lián)?？傊磺蓄伾{(diào)和, 都離不開色輪，色輪 是搭配顏色的根本工具。目錄62.2.1 網(wǎng)頁顏色的搭配原理色 環(huán)色環(huán)是顏色按紅、黃、綠、藍(lán)、紅依次過度漸變呈現(xiàn)出來的不同顏色，就可

7、以得到一個顏色環(huán)。色環(huán)通常包括12種不同的顏色。十二色相環(huán)每一色相間距為30度。 原色：也叫三原色。即紅、黃、藍(lán)三種根本顏色。自然界中的顏色種類繁多，變化豐富，但這三種顏色卻是最根本的原色，原色是其他顏顏色配不出來的。除白色外，把三原色相互混合，可以調(diào)和出其他種顏色。根據(jù)三原色的特性做出相應(yīng)的顏色搭配，有最迅速最有力最劇烈的傳達(dá)視覺信息效果。 間色：又叫二次色。它是由三原顏色配出來的顏色，是由2種原顏色配出來的。紅與黃調(diào)配出橙色；黃與藍(lán)調(diào)配出綠色；紅與藍(lán)調(diào)配出紫色，橙、綠、紫三種顏色又叫間色。在調(diào)配時，由于原色在份量多少上有所不同，所以能產(chǎn)生豐富的間色變化。 復(fù)色：也叫“復(fù)合色。復(fù)色是由原色與

8、間色相調(diào)而成的“三次色，復(fù)色是純度最低，含灰色成份。復(fù)色包括了除原色和間色以外的一切顏色。將一種原色和一種二次色組合， 可得到一種三次色紅+橙朱紅 橙+黃琥珀 黃+綠黃綠綠+藍(lán)碧綠 藍(lán)+紫靛青 紫+紅紫紅目錄62.2.1 網(wǎng)頁顏色的搭配原理 補(bǔ)色：是廣義上的對比色。在色環(huán)上劃直徑，正好相對即間隔最遠(yuǎn)的兩種顏色互為補(bǔ)色。如：紅色是綠色的補(bǔ)色；橙色是藍(lán)色的補(bǔ)色；黃色是紫色的補(bǔ)色。補(bǔ)色的運(yùn)用可以呵斥最劇烈的對比。 臨近色：是在色環(huán)上任一顏色同其毗鄰之色。臨近色也是類似色關(guān)系，只是范圍減少了一點(diǎn)。例如紅色和黃色，綠色和藍(lán)色，互為臨近色。 同類色：比臨近色更加接近的顏色，它主要指在同一色相中不同的顏色變

9、化。例如，紅顏色中有紫紅、深紅、玫瑰紅、大紅、朱紅、桔紅等等種類，黃顏色中又有深黃、土黃、中黃、桔黃、淡黃、檸檬黃等等區(qū)別。它起到顏色調(diào)和一致，又有微妙變化的作用。 暖色：指的是紅、橙、黃、這類顏色。暖色系的飽和度越高，其暖和特性越明顯?？梢源碳と说呐d奮性，使體溫有所升高。 冷色：指的是綠、青、藍(lán)、紫等顏色，冷色系亮度越高，其特性越明顯?？梢允谷说男木嘲察o，清新，恬雅 目錄62.2.1 網(wǎng)頁顏色的搭配原理 間色：間色是由三原色中的兩原顏色配而成的，因此在視覺刺激的強(qiáng)度相對三原色來說緩和不少。屬于較易搭配之色。間色雖然是二次色，但仍有很強(qiáng)的視覺沖擊力，容易帶來輕松、明快、愉悅的氣氛。目錄62.2

10、.1 網(wǎng)頁顏色的搭配原理 復(fù)色：復(fù)色是由兩種間色或原色與間色混合而成，因此色相傾向較微妙、不明顯，視覺刺激度緩和，假設(shè)搭配不當(dāng)，頁面便呈現(xiàn)易臟或易灰朦朦的效果，沉悶、壓制之感，屬于不好搭配之色。但有時復(fù)色加深色搭配能很好的表達(dá)奧秘感、縱深感空間感；明度高的多復(fù)色參看明度的網(wǎng)頁例圖多用來表示安靜柔和、細(xì)膩的情感，易于長時間的閱讀。 目錄62.2.1 網(wǎng)頁顏色的搭配原理 補(bǔ)色：補(bǔ)色最能傳達(dá)劇烈、個性的情感。純度稍低的綠色為背景的大面積運(yùn)用，對比并突出了前景純度明度較高的、面積較小的紅色圖形，構(gòu)成了視覺中心重點(diǎn)突出，到達(dá)主次清楚的主題效果。紅綠、橙藍(lán)、黃紫這三組補(bǔ)色中，前兩種運(yùn)用得最頻繁。這三組補(bǔ)色

11、搭配出的最終效果和目的，可以用兩個字來概括劇烈！ 目錄62.2.1 網(wǎng)頁顏色的搭配原理 臨近色：由于是相鄰色系，視覺反差不大，一致、調(diào)和，構(gòu)成協(xié)調(diào)的視覺韻律美，相較顯得安定、穩(wěn)重的同時不失活力，是一種恰到益處的配色類型。 目錄6 同類色：第一眼看上去給人溫順、雅致、安寧的心思感受，便可知該組同類色系非常調(diào)和一致。只運(yùn)用同類色系配色，是非常謹(jǐn)慎穩(wěn)妥的做法，但是有時會有單調(diào)感。添加少許相鄰或?qū)Ρ壬担梢员磉_(dá)出頁面的活潑感和強(qiáng)度。 2.2.1 網(wǎng)頁顏色的搭配原理目錄62.2.1 網(wǎng)頁顏色的搭配原理 暖色：高明度高純度的顏色搭配，把頁面表達(dá)得艷麗奪目，有非常劇烈刺激的視覺表現(xiàn)力。充分表達(dá)了暖色系的飽

12、和度越高，其暖和特性越明顯的性格。 目錄62.2.1 網(wǎng)頁顏色的搭配原理 冷色：冷色系的亮度越高，其特性越明顯。單純冷色系搭配視覺感比暖色系溫馨，不易呵斥視覺疲勞。藍(lán)色、綠色是冷色系的主要系，是設(shè)計中較常用的顏色，也是大自然之色，帶來一股清新、祥和安寧的空氣。 目錄62.2.2 網(wǎng)頁顏色的搭配技巧首先，一個網(wǎng)站假設(shè)只運(yùn)用一種顏色，會讓人覺得單調(diào)、乏味；但是假設(shè)將一切的顏色都運(yùn)用到網(wǎng)站中，也會適得其反，讓人覺得輕浮、花哨。一個網(wǎng)站必需有一種或者兩種主題色，所以確定網(wǎng)站的主題色是設(shè)計者必需思索的問題之一。在網(wǎng)頁設(shè)計上，一個頁面盡量不要超越4種顏色，用太多的顏色會讓人覺得沒有偏重。當(dāng)主題色確定以后，

13、思索其他配色時，一定要思索其他配色與主題色的關(guān)系，要表達(dá)什么樣的效果。另外要思索哪種要素占主要的位置，是明度、純度還是色相。以下是幾種快速找到網(wǎng)頁顏色搭配的最正確方案：運(yùn)用同一色系這里是指選定一種顏色，然后調(diào)整透明度或者飽和度，產(chǎn)生新的顏色，用于網(wǎng)頁的不同位置，這樣的頁面看起來顏色一致，又有層次感。巧用對比色先選定一種顏色，然后選擇它的對比色，并調(diào)整一下飽和度找一款調(diào)和的對比色，使整個頁面顏色豐富但不花哨。運(yùn)用相近色簡單的說就是用一個覺得的顏色，例如淡藍(lán)、淡黃、淡綠；或者土黃、土灰、土藍(lán)。用黑、白或灰搭配一種顏色黑、白或灰色根本可以和任何一種顏色相搭配，不會讓人覺得突兀，讓人覺得比較調(diào)和。有時

14、候又可以配出很“跳的覺得，如黑色背景配紅色的文字。在網(wǎng)頁中，有以下忌諱：網(wǎng)頁中的顏色要控制在四種以內(nèi)；背景和前文的對比盡量要大，絕對不要用花紋繁復(fù)的圖案作背景。目錄62.2.2 網(wǎng)頁顏色的搭配技巧同一色系色環(huán)上45度以內(nèi)的2個顏色就是同類色取任何一種顏色加黑加白或加灰，而構(gòu)成的顏色，所構(gòu)成的一系列色系稱為同色系。它們色相的性質(zhì)一樣。但色度有深淺之分。同色系在配色上是一種穩(wěn)定，溫暖的組合，其特點(diǎn)是主調(diào)柔和含蓄、有親和力、有層次感。目錄62.2.2 網(wǎng)頁顏色的搭配技巧巧用對比色在色相環(huán)中處于120度到150度之間的任何兩個原色，它們對比劇烈，對比色在運(yùn)用中給人以活潑、明快的覺得。能使顏色到達(dá)最鮮明

15、的程度，并產(chǎn)生劇烈的刺激感。目錄62.2.2 網(wǎng)頁顏色的搭配技巧運(yùn)用相近色色環(huán)上90度以內(nèi)的2個顏色就是相近色通常色與色之間是他中有我，我中有他。 雖然在色相上差別很大，但在視覺上卻比較接近，色與色之間可以很好的相互交融，展現(xiàn)調(diào)和的效果 。目錄6黑、白或灰搭配一種顏色2.2.2 網(wǎng)頁顏色的搭配技巧黑色：深沉，嚴(yán)肅，具有奧秘之感，灰色：高雅，簡樸，使人有現(xiàn)實感，白色：明快，無瑕，表純真之感目錄62.2.3 網(wǎng)頁顏色如何分配背景和文字LOGO和BANNER導(dǎo)航、小標(biāo)題鏈接顏色的設(shè)置(假設(shè)是企業(yè)網(wǎng)站，而且該企業(yè)又有本人的視覺識別系統(tǒng)，普通會要求用本企業(yè)的VI系統(tǒng)顏色來定義網(wǎng)站的主、輔顏色。)目錄62

16、.3 整理網(wǎng)站的素材和內(nèi)容網(wǎng)站內(nèi)容的電子文檔網(wǎng)站所需的圖片網(wǎng)站欄目的大體規(guī)劃企業(yè)的LOGO企業(yè)標(biāo)志(假設(shè)是企業(yè)網(wǎng)站，上述資料客戶都會事先預(yù)備好，交給相關(guān)業(yè)務(wù)人員，再由業(yè)務(wù)員轉(zhuǎn)交給網(wǎng)站設(shè)計師。)目錄62.4 制定網(wǎng)站欄目和規(guī)劃根據(jù)網(wǎng)站要求確定網(wǎng)站欄目( 普通情況下業(yè)務(wù)人員會提早和客戶制定好) 常用的幾種網(wǎng)頁規(guī)劃方式上下規(guī)劃構(gòu)造左右規(guī)劃構(gòu)造左中右規(guī)劃構(gòu)造半包圍規(guī)劃構(gòu)造網(wǎng)站拓?fù)鋱D目錄62.4 制定網(wǎng)站欄目和規(guī)劃上下規(guī)劃構(gòu)造目錄62.4 制定網(wǎng)站欄目和規(guī)劃左右規(guī)劃構(gòu)造目錄62.4 制定網(wǎng)站欄目和規(guī)劃左中右規(guī)劃構(gòu)造目錄62.4 制定網(wǎng)站欄目和規(guī)劃半包圍規(guī)劃構(gòu)造目錄62.5 謀劃網(wǎng)站并制造網(wǎng)頁及調(diào)試確定主

17、題決議網(wǎng)頁風(fēng)格網(wǎng)頁規(guī)劃制造的技巧向規(guī)劃完成的表格中添加內(nèi)容網(wǎng)頁的制造過程中的調(diào)試草圖實踐效果3.1、懇求域名、空間3.2、上傳網(wǎng)站內(nèi)容3.3、輸入網(wǎng)址，閱讀網(wǎng)站內(nèi)容目錄6三、如何發(fā)布網(wǎng)站目錄63.1 懇求域名、空間假設(shè)網(wǎng)頁制造完了，就去互聯(lián)網(wǎng)域名空間效力商的網(wǎng)站上懇求他本人的域名和空間，當(dāng)然這是要付費(fèi)的。假設(shè)是個人網(wǎng)站的話，也可以懇求免費(fèi)的空間和免費(fèi)的二級域名。懇求完后空間效力商會給他一個IP地址，就是他本人的效力器IP，還有他本人為該網(wǎng)站懇求的用戶名和密碼。收費(fèi)空間：中國萬網(wǎng) 新網(wǎng) 數(shù)據(jù)中國 等免費(fèi)空間：3v 等目錄63.2 上傳網(wǎng)站內(nèi)容需求Ftp軟件，這里我們用flashfxp工具，這是一款功能強(qiáng)大的FXP/FTP軟件，集成了其它優(yōu)秀的FTP軟件的優(yōu)點(diǎn)，支持目錄和子目錄的文件傳輸，刪除；支