網(wǎng)頁設(shè)計(jì)18799

1、1第5章網(wǎng)頁設(shè)計(jì)本章介紹使用網(wǎng)頁編輯工具FrontPage2003和DreamweaverMX2004制作網(wǎng)頁及使用FlashMX2004制作網(wǎng)頁動(dòng)畫的基本方法。5.15.1設(shè)計(jì)網(wǎng)站的一般步驟設(shè)計(jì)網(wǎng)站的一般步驟在設(shè)計(jì)網(wǎng)站開始階段，作好網(wǎng)站的總體規(guī)劃十分關(guān)鍵，有了好的設(shè)計(jì)規(guī)劃之后，再給出詳細(xì)的實(shí)施步驟，有了這些思路清晰的、詳細(xì)的步驟，就有一個(gè)好的開端，設(shè)計(jì)網(wǎng)站一般應(yīng)遵循以下步驟：⑴總體規(guī)劃。首先要明確建立網(wǎng)站的目的和規(guī)模；網(wǎng)站上應(yīng)該出現(xiàn)什

2、么信息；建立網(wǎng)站是個(gè)人網(wǎng)站、單位網(wǎng)站、公司網(wǎng)站還是政府網(wǎng)站；網(wǎng)站的總體結(jié)構(gòu)；包含的主題、內(nèi)容和頁面以及各個(gè)分頁之間的層次結(jié)構(gòu)和隸屬關(guān)系等；⑵準(zhǔn)備設(shè)計(jì)網(wǎng)站所需的素材。網(wǎng)頁上需要展示的材料，如文字、圖片、圖像、聲音文件等，并將文字材料用文本文件建立；⑶創(chuàng)建站點(diǎn)和制作網(wǎng)頁。根據(jù)網(wǎng)站類型，采用不同的方法建立站點(diǎn)；根據(jù)內(nèi)容制作不同頁面的網(wǎng)頁；⑷瀏覽和測(cè)試站點(diǎn)及網(wǎng)頁?？梢岳镁W(wǎng)頁編輯器的瀏覽功能瀏覽設(shè)計(jì)好的網(wǎng)站及其網(wǎng)頁，檢查文字是否正確，圖片的位置

3、是否合適，各部分的鏈接是否正確；⑸申請(qǐng)存放網(wǎng)頁空間。向收費(fèi)或者免費(fèi)的網(wǎng)頁服務(wù)站點(diǎn)申請(qǐng)網(wǎng)頁空間；⑹發(fā)布站點(diǎn)。將設(shè)計(jì)好的站點(diǎn)和網(wǎng)頁上傳到提供空間的服務(wù)器上；⑺站點(diǎn)的維護(hù)和更新。5.25.2FrontPageFrontPage200320035.2.15.2.1FrontPageFrontPage20032003啟動(dòng)啟動(dòng)35.2.35.2.3網(wǎng)頁視圖網(wǎng)頁視圖選擇“視圖”→“網(wǎng)頁”命令，進(jìn)入網(wǎng)頁視圖，如圖51所示。在網(wǎng)頁視圖的下方，有4個(gè)選項(xiàng)卡

4、，單擊不同的選項(xiàng)卡，可以進(jìn)入不同的視圖。⒈“設(shè)計(jì)”視圖。此視圖為默認(rèn)視圖，可以在此視圖中設(shè)計(jì)和編輯網(wǎng)頁。使用設(shè)計(jì)工具創(chuàng)建網(wǎng)頁時(shí)，此視圖將提供幾乎是“所見即所得”的效果。⒉“代碼”視圖。此視圖可以將網(wǎng)頁設(shè)計(jì)過程翻譯成HTML代碼。在該窗口，可以通過修改代碼對(duì)網(wǎng)頁進(jìn)行編輯。⒊“拆分”視圖。可以通過拆分屏幕，將屏幕分成上下兩部分，很方便訪問和編輯“代碼”視圖窗和“設(shè)計(jì)”視圖窗中的內(nèi)容。⒋“預(yù)覽”視圖。通過此視圖，不保存網(wǎng)頁即可看到網(wǎng)頁在web

5、瀏覽器中的顯示情況。5.2.45.2.4制作網(wǎng)頁制作網(wǎng)頁創(chuàng)建一個(gè)新的網(wǎng)頁或者打開一個(gè)已經(jīng)存在的網(wǎng)頁后，可以對(duì)網(wǎng)頁進(jìn)行一些設(shè)計(jì)操作：使用框架、表格、布局或絕對(duì)定位來定位網(wǎng)頁上的文本和圖形；使用添加文本、圖形、網(wǎng)頁橫幅、表格、表單、超鏈接等網(wǎng)頁元素來設(shè)計(jì)網(wǎng)頁；添加Flash內(nèi)容、視頻、聲音或GIF動(dòng)畫等動(dòng)態(tài)元素給網(wǎng)頁增加動(dòng)態(tài)效果；添加字幕、計(jì)數(shù)器、時(shí)間、交互式按鈕等給網(wǎng)頁增加更豐富的內(nèi)容；用顏色或圖片可以設(shè)置網(wǎng)頁背景等。制作網(wǎng)頁有一些操作方

6、法與Wd相同，相同地方本節(jié)不再介紹，例如文本的輸入、文本的刪除、文本的移動(dòng)和復(fù)制、文本的顏色、文本的字體、字型和大小等。本節(jié)只介紹使用FrontPage2003制作網(wǎng)頁的基本方法。⒈制作網(wǎng)頁的基本操作制作網(wǎng)頁的基本操作在網(wǎng)頁中可插入如下內(nèi)容：⑴插入換行符。為了使換行后的文本保存在換行前的段落中，此時(shí)的換行要使用換行符。插入換行符的方法如下：先將插入點(diǎn)置于換行符的位置，執(zhí)行“插入”→“換行符”命令，然后在出現(xiàn)的換行符對(duì)話框中作相應(yīng)的選擇，

7、最后單擊“確定”按鈕返回。⑵插入水平線。水平線主要用于分割段落。執(zhí)行“插入”→“水平線”命令，即可在光標(biāo)處插入一條水平線。如果要設(shè)置或者修改水平線的屬性，右擊水平線，執(zhí)行“水平線屬性”命令(或者雙擊水平線)，進(jìn)入“水平線屬性”對(duì)話框，利用“水平線屬性”對(duì)話框可以改變水平線的顏色、高度、寬度和位置等。⑶插入注釋。在創(chuàng)建編輯和修改網(wǎng)頁的過程中，經(jīng)常需要插入一些文字，提示設(shè)計(jì)的意圖和方法，在編輯網(wǎng)頁時(shí)作為參考和提示，但瀏覽者通過瀏覽器是看不到