資源描述：
《網(wǎng)頁設(shè)計(jì)與制作教學(xué)課件.ppt》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在應(yīng)用文檔-天天文庫。
1、第1章網(wǎng)頁設(shè)計(jì)與制作基礎(chǔ)1.1學(xué)習(xí)任務(wù)：網(wǎng)頁和網(wǎng)站基本知識(shí)1.2學(xué)習(xí)任務(wù)：網(wǎng)站開發(fā)的基本流程1.5學(xué)習(xí)任務(wù)：HTML標(biāo)識(shí)語言基礎(chǔ)1.3學(xué)習(xí)任務(wù)：全面認(rèn)識(shí)DreamweaverCS41.4學(xué)習(xí)任務(wù)：創(chuàng)建和管理本地站點(diǎn)1.6應(yīng)用實(shí)例——制作一個(gè)簡單的網(wǎng)頁1.7實(shí)訓(xùn)1.1學(xué)習(xí)任務(wù)：網(wǎng)頁和網(wǎng)站基本知識(shí)1.1.1網(wǎng)頁和網(wǎng)站概述1.1.2網(wǎng)頁的主要元素1.1.3網(wǎng)頁類型1.1.4靜態(tài)網(wǎng)頁編輯軟件1.1.5網(wǎng)頁圖像與網(wǎng)頁動(dòng)畫制作軟件1.什么是網(wǎng)頁？瀏覽Web時(shí)所看到的文件稱為Web頁，又稱為網(wǎng)頁。網(wǎng)頁可以將不同類型的多媒體
2、信息（包括文字、圖像、動(dòng)畫、聲音、視頻等）組合在一個(gè)文檔中。由于這些文檔是用超文本標(biāo)記語言表示的，其文件名一般是以.html或.htm結(jié)尾，因此又稱為HTML文檔或超文本。2.什么是主頁？當(dāng)我們?yōu)g覽網(wǎng)站時(shí)看到的第一個(gè)頁面。它是整個(gè)站點(diǎn)的入口和門面，通常這樣命名：index.html。3.什么是超文本？包含文字、圖像、視頻、聲音等媒體的文本，網(wǎng)頁就是一個(gè)超文本文件，并且可以實(shí)現(xiàn)鏈接操作。超文本可以給瀏覽者帶來視覺和聽覺的享受，所以Web技術(shù)又稱為超媒體技術(shù)。注意在網(wǎng)頁上點(diǎn)擊鼠標(biāo)右鍵，選擇“查看源文件”，就能很清
3、楚地看到網(wǎng)頁的代碼結(jié)構(gòu)。用戶可以使用記事本對(duì)網(wǎng)頁中的文字、圖片、表格、多媒體等頁面內(nèi)容進(jìn)行編輯，并通過標(biāo)記語言HTML對(duì)這些元素進(jìn)行描述和控制，最后由瀏覽器對(duì)這些標(biāo)記進(jìn)行解釋并生成最終呈現(xiàn)在用戶眼前豐富多彩的網(wǎng)頁。4.什么是網(wǎng)站？根據(jù)提供服務(wù)的不同，通常把提供網(wǎng)頁服務(wù)的服務(wù)器稱為Web服務(wù)器，相關(guān)網(wǎng)站稱為Web站點(diǎn)。一個(gè)Web站點(diǎn)由一個(gè)或多個(gè)Web頁組成，這些Web頁相互連接在一起，存放在Web服務(wù)器上，以供瀏覽者訪問。網(wǎng)站是提供各種信息和服務(wù)的基地，如用戶熟悉的搜狐、新浪、雅虎等。網(wǎng)站是由很多網(wǎng)頁鏈接在一起
4、組成的。用戶瀏覽到一個(gè)網(wǎng)站時(shí)看到的第一個(gè)頁面叫做主頁。從主頁出發(fā)，可以訪問到本網(wǎng)站的每一個(gè)頁面，也可以鏈接到其他網(wǎng)站，方便地共享網(wǎng)站資源。注意網(wǎng)站由若干網(wǎng)頁組合而成。實(shí)質(zhì)上就是一個(gè)文件夾，用來存放站點(diǎn)相關(guān)信息資源的文件夾。5.網(wǎng)頁基本元素有哪些？都有什么作用？設(shè)計(jì)的時(shí)候要注意什么？網(wǎng)頁包括的主要元素有：文本、圖像、動(dòng)畫、導(dǎo)航欄、超鏈接、表格、表單等。文本是人類最重要的信息載體和交流工具，網(wǎng)頁的主體一般以文本為主。制作網(wǎng)頁時(shí)，可以根據(jù)需要設(shè)置文本的字體、字號(hào)、顏色、樣式等屬性，風(fēng)格獨(dú)特的網(wǎng)頁文本設(shè)置會(huì)給瀏覽者賞
5、心悅目的感覺。?提示：在網(wǎng)頁中應(yīng)用了某種字體樣式后，如果瀏覽者的計(jì)算機(jī)中沒有安裝該種樣式的字體，字體就以計(jì)算機(jī)系統(tǒng)默認(rèn)的字體顯示出來，此時(shí)就無法顯示出網(wǎng)頁的效果了。圖像在網(wǎng)頁中可以起到提供信息、展示作品、美化網(wǎng)頁以及體現(xiàn)風(fēng)格等功效。圖像可以用作網(wǎng)頁的標(biāo)題、網(wǎng)站Logo、網(wǎng)頁背景、鏈接按鈕、導(dǎo)航欄、網(wǎng)頁主圖等。圖像給人的視覺效果要比文字強(qiáng)烈得多，在網(wǎng)頁中靈活應(yīng)用圖像可以起到點(diǎn)綴的效果。雖然圖像在網(wǎng)頁中不可或缺，但也不能太多，因?yàn)閳D像的下載速度較慢，而且網(wǎng)頁上如果放置了過多的圖片，會(huì)顯得很亂，有喧賓奪主之勢(shì)。網(wǎng)頁
6、上的圖像文件大部分都是使用JPG和GIF格式，因?yàn)?，它們除了具有壓縮比例高外，還具有跨平臺(tái)特性。動(dòng)畫是網(wǎng)頁上最活躍的元素，通常制作優(yōu)秀、創(chuàng)意出眾的動(dòng)畫是吸引瀏覽者的最有效的方法。如果網(wǎng)頁中存有太多的動(dòng)畫，會(huì)使瀏覽者眼花繚亂，無心細(xì)看。所以，對(duì)動(dòng)畫制作的要求越來越高。在網(wǎng)頁中加入的動(dòng)畫一般是GIF格式的動(dòng)畫和Flash（.swf）動(dòng)畫等。導(dǎo)航欄是網(wǎng)站設(shè)計(jì)者在規(guī)劃網(wǎng)站結(jié)構(gòu)時(shí)必須考慮的一個(gè)問題，站點(diǎn)的每個(gè)網(wǎng)頁上均應(yīng)設(shè)置導(dǎo)航欄，并且應(yīng)將其放置在網(wǎng)頁中比較明顯的位置。設(shè)置導(dǎo)航欄的目的是使瀏覽者能夠順利地瀏覽網(wǎng)頁，方便地
7、返回主頁或繼續(xù)下一頁的訪問。導(dǎo)航欄可以是文本、按鈕或圖像的樣式。超鏈接是網(wǎng)頁中最為有用的功能之一。超鏈接是從一個(gè)網(wǎng)頁指向另一個(gè)網(wǎng)頁的鏈接，該鏈接既可以指向本地網(wǎng)站的另一個(gè)網(wǎng)頁，也可以指向世界各地的其他網(wǎng)頁。無論是文本還是圖像都可以加上超鏈接標(biāo)記，當(dāng)鼠標(biāo)指上超鏈接對(duì)象時(shí)會(huì)變成小手形狀，單擊鼠標(biāo)左鍵即可鏈接到相應(yīng)地址（URL）的網(wǎng)頁。超鏈接包括站內(nèi)鏈接和站外鏈接。站內(nèi)鏈接：若網(wǎng)站規(guī)劃了多個(gè)主題版塊，需要給網(wǎng)站的首頁加入超鏈接，讓瀏覽者可以快速地轉(zhuǎn)到感興趣的頁面。在各個(gè)子頁面也要有超級(jí)鏈接，并設(shè)有能夠回到主頁的鏈接
8、。站外鏈接：在個(gè)人網(wǎng)站上放置一些與網(wǎng)站主題有關(guān)的對(duì)外鏈接，不但可以把好的網(wǎng)站介紹給瀏覽者，而且能使瀏覽者樂意再度光臨該網(wǎng)站。(友情鏈接)表格是網(wǎng)頁中的一種用于控制網(wǎng)頁頁面布局的有效方法。為了達(dá)到理想的視覺效果，通常不顯示表格的邊框。使用表格輔助布局，可以實(shí)現(xiàn)網(wǎng)頁橫豎分明的風(fēng)格。表單是一種特殊的網(wǎng)頁元素，通常用于收集信息或?qū)崿F(xiàn)一些交互式的效果。表單的主要功能是接收瀏覽者在瀏覽器的輸入信息，然后將這些信
