網(wǎng)頁設(shè)計與制作教程(教程全集)

《網(wǎng)頁設(shè)計與制作教程(教程全集)》由會員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在教育資源-天天文庫。

1、網(wǎng)頁設(shè)計與制作教程本章要點網(wǎng)頁素材的搜集工具軟件簡介網(wǎng)站標(biāo)志的制作系列圖片和動畫素材的制作動畫與頁面動態(tài)廣告的制作第2章網(wǎng)頁素材的搜集與制作快速導(dǎo)讀本章以銷售汽車的“超越”網(wǎng)站為例，逐步學(xué)習(xí)搜集和制作汽車銷售網(wǎng)站所涉及的各種不同的素材。如收集各個品牌汽車的相關(guān)基本素材，制作網(wǎng)站標(biāo)志Logo、導(dǎo)航背景與按鈕，使用模板處理汽車品牌標(biāo)志和網(wǎng)站標(biāo)志，制作各網(wǎng)頁頭部動態(tài)廣告素材，制作gif和swf動畫。2.1搜集網(wǎng)頁素材2.1.1廣泛搜集網(wǎng)頁素材準(zhǔn)備素材包括：網(wǎng)站的Logo、Banner、圖片、Flash動畫、各

2、種按鈕、聲音文件和視頻文件等。材料既可以從圖書、報紙、光盤或多媒體上獲取，也可以從互聯(lián)網(wǎng)上搜集，然后把搜集的材料去粗取精，去偽存真，作為自己制作網(wǎng)頁的素材。需要強(qiáng)調(diào)的是，不論是文字素材還是圖片（動畫）素材，都應(yīng)該注意其來源是否注明版權(quán)所有，以免違反知識產(chǎn)權(quán)的有關(guān)規(guī)定。2.1搜集網(wǎng)頁素材2.1.2緊扣網(wǎng)站主題，搜集并制作素材廣泛搜集網(wǎng)頁素材最終要為網(wǎng)站主題服務(wù)，因而在建設(shè)“超越”網(wǎng)站時，搜集網(wǎng)站素材很大程度上要搜集整理本公司資料和品牌代理公司資料。2.1搜集網(wǎng)頁素材2.1.3整理素材把搜集的原始素材分門別

3、類存放在一個文件夾中，比如chaoyue網(wǎng)站根文件夾。把編輯好的各類素材文件存放在網(wǎng)站根文件夾中的各類子文件夾中；images子文件夾中存放不同欄目的頁面都要使用的公共圖片素材文件。2.1搜集網(wǎng)頁素材2.1.4明確素材命名規(guī)范在剛開始搜集素材時，應(yīng)該制定一套明確的命名規(guī)則，以最少的字母表達(dá)出最容易理解的意義。2.2工具軟件簡介2.2.1平面制作軟件PhotoshopCS4Photoshop軟件主要用于平面圖像畫面的制作和處理，PhotoshopCS4版是目前最流行的版本。使用Photoshop可以制作顏

4、色豐富、表現(xiàn)力強(qiáng)的精美畫面。1、關(guān)于Photoshop工作區(qū)域2、關(guān)于工具3、幫助和支持2.2工具軟件簡介2.2.2網(wǎng)頁效果圖設(shè)計軟件fireworksCS4Fireworks軟件是一款創(chuàng)建與優(yōu)化Web圖像和快速構(gòu)建網(wǎng)站與Web界面原型的理想工具。1、關(guān)于工作區(qū)域2、屬性檢查器3、幫助和支持2.2工具軟件簡介2.2.3動畫制作軟件FlashCS4Flash軟件主要用于網(wǎng)頁平面動畫的制作，F(xiàn)lashCS4版是目前最流行的版本。使用Flash可以制作變化靈活、表現(xiàn)生動的動畫影片。1、關(guān)于工作區(qū)域2、時間軸3

5、、幫助和支持2.2工具軟件簡介2.2.4在Internet上查找所需信息通過Internet連接和MicrosoftInternetExplorer，可以查找和瀏覽Web上的所有信息。在Web中查找信息的方法有很多，單擊工具欄上的“搜索”按鈕可以訪問多個搜索提供商。在“搜索”框中鍵入單詞或短語，鍵入go、find或?，后跟單詞或詞組，按Enter鍵之后InternetExplorer將使用提供商預(yù)置的搜索開始搜索。進(jìn)入網(wǎng)頁后，單擊“編輯”菜單，然后單擊“查找（在當(dāng)前頁）”，可以搜索指定的文本。2.2工具

6、軟件簡介2.2.5屏幕捕獲工具SnagIt7和中華神捕1.521、屏幕捕獲工具SnagIt7是一個非常優(yōu)秀的屏幕、文本和視頻捕獲與轉(zhuǎn)換軟件?？梢圆东@Windows屏幕、DOS屏幕；RM電影、游戲畫面；對象、菜單、窗口、客戶區(qū)窗口、最后一個激活的窗口或用鼠標(biāo)定義的區(qū)域及延時捕獲的圖像。圖像可被存為BMP、PCX、TIF、GIF或JPEG格式，也可以存為系列動畫。2、中華神捕2.62是一款超級方便的屏幕抓圖、做圖以及圖片瀏覽工具。2.3制作背景與按鈕2.3.1制作金灰色漸變背景漸變色的背景在網(wǎng)頁中十分常見，

7、可通過使用PhotoShop來制作一款非常有代表性的網(wǎng)頁背景圖像效果。2.3制作背景與按鈕2.3.2制作素材色漸變背景漸變色的背景很常見，但是顏色的選取確是個大問題，其實有一個非常簡單的技巧就可以輕松獲得適當(dāng)?shù)纳?，就是從圖像中直接選取所需要的顏色。2.3制作背景與按鈕2.3.3制作冰雪花邊背景在制作特殊背景效果的時候，使用PhotoShop軟件所自帶的濾鏡，往往可以給人意外的驚喜。下面使用PhotoShop的濾鏡來制作冰雪花邊的背景效果。2.3制作背景與按鈕2.3.4制作首頁按鈕網(wǎng)頁中的按鈕是網(wǎng)頁上使

8、用頻率最高的頁面元素，當(dāng)然按鈕的設(shè)計也是多種多樣，下面將使用PhotoShop來設(shè)計一款比較實用的按鈕效果。2.3制作背景與按鈕2.3.5制作主頁背景圖像很多網(wǎng)站的主頁都會添加背景圖像，下面將使用PhotoShop來制作一款能夠平鋪的背景圖像效果。2.4制作網(wǎng)站標(biāo)志2.4.1新建圖像文件2.4.2處理道路素材2.4.3處理汽車素材2.4.4導(dǎo)入素材圖像2.4.5變換道路圖像2.4.6填充漸變背景2.4.7調(diào)整汽車圖像2.4.8書寫文字2.4