《Dreamweaver CS6網(wǎng)頁(yè)設(shè)計(jì)與制作》第1章網(wǎng)站設(shè)計(jì)基礎(chǔ)PPT課件.ppt

1、網(wǎng)頁(yè)設(shè)計(jì),授課教師:,1,主要學(xué)習(xí)內(nèi)容 網(wǎng)站設(shè)計(jì)基礎(chǔ)知識(shí) Dreamweaver、Fireworks html語(yǔ)言 如何學(xué)習(xí)這門課程 多實(shí)踐，多動(dòng)手 多參考優(yōu)秀網(wǎng)站：如網(wǎng)易，sohu,2,1.1網(wǎng)頁(yè)設(shè)計(jì)相關(guān)知識(shí),www 網(wǎng)頁(yè)的概念 超文本(Hypertext) 網(wǎng)站的概念 網(wǎng)頁(yè)瀏覽原理 網(wǎng)頁(yè)組成要素 網(wǎng)頁(yè)編輯工具 網(wǎng)頁(yè)布局 網(wǎng)頁(yè)的頁(yè)面與版面,3,WWW,萬(wàn)維網(wǎng)WWW (World Wide Web)并非某種特殊的計(jì)算機(jī)網(wǎng)絡(luò)。萬(wàn)維網(wǎng)是一個(gè)大規(guī)模的、聯(lián)機(jī)式的信息儲(chǔ)藏所，英文簡(jiǎn)稱為Web。下圖說(shuō)明了萬(wàn)維網(wǎng)提供分布式服務(wù)的特點(diǎn)。,4,WWW,5,WWW,萬(wàn)維網(wǎng)是一個(gè)分布式的超媒體(hypermedia

2、)系統(tǒng)，它是超文本(hypertext)系統(tǒng)的擴(kuò)充。 萬(wàn)維網(wǎng)以客戶服務(wù)器方式工作。客戶程序向服務(wù)器程序發(fā)出請(qǐng)求，服務(wù)器程序向客戶程序返回客戶所要的萬(wàn)維網(wǎng)文檔。在一個(gè)客戶程序主窗口上顯示出的萬(wàn)維網(wǎng)文檔稱為頁(yè)面(page)。,6,網(wǎng)頁(yè)的概念,網(wǎng)頁(yè)(Web Page)：是通過(guò)WWW發(fā)布的包含有文本、圖片、聲音、動(dòng)畫等多媒體信息的頁(yè)面，它是網(wǎng)站最基本的組成單位。眾多的網(wǎng)頁(yè)有機(jī)地集合在一起就組成了網(wǎng)站。 網(wǎng)頁(yè)的主要類型 HTML(HyperText Markup Language)全稱超文本標(biāo)記語(yǔ)言，利用標(biāo)記（tag）來(lái)描述網(wǎng)頁(yè)的字體、大小、顏色及頁(yè)面布局的語(yǔ)言，使用任何的文本編輯器都可以對(duì)它進(jìn)行編輯，

3、與VB、C+等編程語(yǔ)言有著本質(zhì)上的區(qū)別。 ASP (Active Server Pages )中文名為動(dòng)態(tài)服務(wù)器主頁(yè) ,它是一種應(yīng)用程序環(huán)境，可以利用 VBscript 或 Java Script 語(yǔ)言來(lái)設(shè)計(jì)，主要用于網(wǎng)絡(luò)數(shù)據(jù)庫(kù)的查詢與管理。 JSP(Java Server Page)JSP 與 ASP 非常相似。不同之處之一在于 ASP 的編程語(yǔ)言是 VBScript 之類的腳本語(yǔ)言， 而 JSP 使用的Java 。,7,靜態(tài)網(wǎng)頁(yè)與動(dòng)態(tài)網(wǎng)頁(yè),靜態(tài)網(wǎng)頁(yè) 純粹HTML格式的網(wǎng)頁(yè) 每個(gè)網(wǎng)頁(yè)都有一個(gè)固定的URL，網(wǎng)頁(yè)URL以.htm、.html、.shtml等常見(jiàn)形式為后綴，且不含有“?” 也可以出

4、現(xiàn)各種動(dòng)態(tài)效果 動(dòng)態(tài)網(wǎng)頁(yè) 以數(shù)據(jù)庫(kù)技術(shù)為基礎(chǔ)，隨不同客戶、不同時(shí)間，返回不同的網(wǎng)頁(yè) 后綴通常是asp、aspx、jsp、php等，并且通常在URL中帶有”？”,8,靜態(tài)網(wǎng)頁(yè),9,動(dòng)態(tài)網(wǎng)頁(yè),10,MSN中國(guó)網(wǎng)站的首頁(yè),11,超文本(Hypertext),超文本(Hypertext)：具有超級(jí)鏈接功能的文本文件叫超文本。超文本文件中的某些字、符號(hào)或短語(yǔ)起著“熱鏈路”（Hotlink）的作用，在顯示出來(lái)時(shí)其字體或顏色發(fā)生變化或者標(biāo)有下橫線、以區(qū)別于一般的正文.,12,網(wǎng)站的概念,網(wǎng)站：WWW服務(wù)器上相互鏈接的一系列網(wǎng)頁(yè)組成一個(gè)網(wǎng)站（Web Site）。網(wǎng)站是WWW上的一個(gè)結(jié)點(diǎn)。如果輸入地址時(shí)僅指定W

5、WW服務(wù)器域名或IP地址，而不加路徑信息，則將打開(kāi)網(wǎng)站默認(rèn)的首頁(yè)（Home Page），也稱為主頁(yè)。首頁(yè)是一個(gè)網(wǎng)站中最重要的網(wǎng)頁(yè)，通常包含最重要的信息以及指向各分欄目的超鏈接。,13,網(wǎng)頁(yè)瀏覽原理,其工作步驟如下： （1）用戶啟動(dòng)客戶端瀏覽器，在瀏覽器地址欄輸入想要訪問(wèn)網(wǎng)頁(yè)的URL，瀏覽器軟件通過(guò)http協(xié)議向URL地址所在的Web服務(wù)器發(fā)出服務(wù)請(qǐng)求。 （2）服務(wù)器根據(jù)瀏覽器軟件送來(lái)的請(qǐng)求，把URL地址轉(zhuǎn)化成頁(yè)面所在服務(wù)器上的文件路徑，找出相應(yīng)的網(wǎng)頁(yè)文件。 （3）當(dāng)網(wǎng)頁(yè)中僅包含html文檔，服務(wù)器直接使用http協(xié)議將該文檔發(fā)送到客戶端；如果html文檔中還包含有JavaScript或VbSc

6、ript腳本程序代碼，這些代碼也將隨同html文檔一起下載；如果網(wǎng)頁(yè)中還嵌套有CGI或ASP程序，這些程序?qū)⒂煞?wù)器執(zhí)行，并將運(yùn)行結(jié)果發(fā)送給客戶端。 （4）瀏覽器解釋html文檔，并將結(jié)果在客戶端瀏覽器上顯示。,14,網(wǎng)頁(yè)包含的元素,文本 圖像 動(dòng)畫 音頻 視頻,15,文本,文本是非常重要的網(wǎng)頁(yè)元素之一，是網(wǎng)頁(yè)中信息的主要載體。文字、字母、數(shù)字和符號(hào)等都可以稱為文本。與漂亮的圖像、優(yōu)美的動(dòng)畫、悅耳的聲音和有聲有色的視頻相比，文本在網(wǎng)頁(yè)中似乎是最普通不過(guò)了，但文本卻是用戶創(chuàng)建網(wǎng)頁(yè)應(yīng)該考慮的關(guān)鍵因素，因?yàn)槲谋臼潜硎鲂畔⒌淖钔陚涞姆绞?，絕大多數(shù)信息都是通過(guò)文本傳遞給瀏覽者的。,16,圖像,圖像是站點(diǎn)

7、中比較重要的元素，網(wǎng)頁(yè)的設(shè)計(jì)和創(chuàng)意都離不開(kāi)圖像的使用和處理。一個(gè)欣賞性較好的站點(diǎn)應(yīng)有清新悅目的畫面，能夠吸引讀者有興趣瀏覽下去。同時(shí)，圖像可以傳遞文字所無(wú)法表達(dá)的特定的信息，在Web上的大多數(shù)網(wǎng)頁(yè)都使用圖像來(lái)圖文并茂地對(duì)內(nèi)容加以介紹。網(wǎng)頁(yè)中的圖像既有簡(jiǎn)單的彩色背景，也有實(shí)物的真實(shí)照片?？傊鶕?jù)不同的需要，配備不同的圖像加以說(shuō)明，但從做網(wǎng)頁(yè)的角度來(lái)講，網(wǎng)頁(yè)上的圖像可以分為兩大類。,一類純粹是網(wǎng)頁(yè)本身的需要，起增添網(wǎng)頁(yè)色彩的作用，它并不傳給讀者特定的信息，如某些網(wǎng)頁(yè)背景圖像、表格背景圖像等。另一類是行文的需要，配合文本向讀者傳遞信息，這就是所說(shuō)的圖文并茂，或者利用圖像單獨(dú)向讀者傳遞信息，如圖片新

8、聞。,17,動(dòng)畫,動(dòng)畫是現(xiàn)代網(wǎng)站的重要特色，是網(wǎng)頁(yè)制作技術(shù)的重要組成部分。在網(wǎng)頁(yè)中，常見(jiàn)的動(dòng)畫類型有GIF動(dòng)畫、Flash動(dòng)畫等，使用編程的方法也可以制作動(dòng)畫。目前，網(wǎng)頁(yè)中最流行的動(dòng)畫是Flash動(dòng)畫。Flash動(dòng)畫一般具有文件容量小、傳輸速度快、不失真、邊下載邊播放的特點(diǎn)，還具有交互性優(yōu)勢(shì)。Flash動(dòng)畫具有嶄新的視覺(jué)效果，已經(jīng)成為一種流行的藝術(shù)表現(xiàn)形式。,18,音頻,MP3具有壓縮程度高、音質(zhì)好的特點(diǎn)，是目前最為流行的一種音樂(lè)文件，在網(wǎng)上有很多可以在線收聽(tīng)或下載MP3的站點(diǎn)。 ASF和WMA都是Microsoft公司針對(duì)Real公司開(kāi)發(fā)的新一代網(wǎng)上流式數(shù)字音頻壓縮技術(shù)，同時(shí)兼顧了保真度和網(wǎng)

9、絡(luò)傳輸需求，所以具有一定的先進(jìn)性。 WAV是Microsoft Windows系統(tǒng)提供的音頻格式，由于Windows本身的影響力，這個(gè)格式已經(jīng)成為了事實(shí)上的通用音頻格式。 real格式是RealNetworks公司網(wǎng)絡(luò)音頻和視頻解決方案，具有很高的壓縮比，使用流式（streaming）播放媒體技術(shù)，從而使人們能夠在網(wǎng)上實(shí)時(shí)收聽(tīng)音頻及收看視頻。,19,音頻,20,視頻,在網(wǎng)頁(yè)中添加視頻文件可以大大增加站點(diǎn)的可讀性，已成為站點(diǎn)多媒體特性的重要體現(xiàn)?，F(xiàn)在，能夠在網(wǎng)絡(luò)上運(yùn)行的視頻文件類型也日益豐富。 AVI（.AVI）是音頻視頻交錯(cuò)（Audio Video Interleaved）的英文縮寫，它是Mi

10、crosoft公司開(kāi)發(fā)的一種符合RIFF文件規(guī)范的數(shù)字音頻與視頻文件格式。 MPEG文件（.MPEG/.MPG/.DAT）是運(yùn)動(dòng)圖像壓縮算法的國(guó)際標(biāo)準(zhǔn)，它采用有損壓縮方法減少運(yùn)動(dòng)圖像中的冗余信息，同時(shí)保證每秒30幀的圖像動(dòng)態(tài)刷新率，已被幾乎所有的計(jì)算機(jī)平臺(tái)共同支持。,21,了解網(wǎng)頁(yè)制作工具,常用的網(wǎng)頁(yè)編輯軟件有FrontPage和Dreamweaver等。Dreamweaver因其功能全面、操作靈活、專業(yè)性強(qiáng)，而受到網(wǎng)頁(yè)制作人員的青睞。 在制作網(wǎng)頁(yè)時(shí)，經(jīng)常使用的圖像處理軟件有Fireworks和Photoshop。 Flash是目前最常用的網(wǎng)頁(yè)動(dòng)畫制作軟件。用Flash制作的動(dòng)畫文件小，利于網(wǎng)

11、上發(fā)布，而且還能制作出具有交互功能的動(dòng)畫，并能很方便地與網(wǎng)頁(yè)建立鏈接。,22,網(wǎng)頁(yè)布局類型,國(guó)字型 匡字型 三字型 川字型 其他類型,23,國(guó)字型,國(guó)字型也稱同字型，即最上面是網(wǎng)站的標(biāo)題以及橫幅廣告條，接下來(lái)是網(wǎng)站的主要內(nèi)容，最左側(cè)和最右側(cè)分列一些小條目?jī)?nèi)容，中間是主要部分，最下面是網(wǎng)站的一些基本信息、聯(lián)系方式、版權(quán)聲明等。這是使用最多的一種結(jié)構(gòu)類型。,24,匡字型,匡字型也稱拐角形，這種結(jié)構(gòu)與國(guó)字型結(jié)構(gòu)很相近，上面是標(biāo)題及廣告橫幅，下面左側(cè)是一窄列的鏈接等，右側(cè)是很寬的正文，下面也是一些網(wǎng)站的輔助信息。,25,三字型,這是一種比較簡(jiǎn)潔的布局類型，其頁(yè)面在橫向上被分隔為3部分，上部和下部放置一

12、些標(biāo)志、導(dǎo)航條、廣告條和版權(quán)信息等，中間是正文內(nèi)容。,26,川字型,整個(gè)頁(yè)面在垂直方向上被分為3列，內(nèi)容按欄目分布在這3列中，最大限度地突出欄目的索引功能。,27,其他類型,常見(jiàn)的網(wǎng)頁(yè)布局類型還包括標(biāo)題文本型、框架型、封面型、Flash型等。 標(biāo)題文本型即頁(yè)面內(nèi)容以文本為主，最上面一般是標(biāo)題，下面是正文的格式。 框架型布局通常分為左右框架型、上下框架型和綜合框架型。由于兼容性和美觀等原因，專業(yè)設(shè)計(jì)人員很少采用這種結(jié)構(gòu)。 封面型基本出現(xiàn)在一些網(wǎng)站的首頁(yè)，大部分由一些精美的平面設(shè)計(jì)和動(dòng)畫組合而成，在頁(yè)面中放幾個(gè)簡(jiǎn)單的鏈接或者僅是一個(gè)“進(jìn)入”的鏈接，甚至直接在首頁(yè)的圖片上做鏈接而沒(méi)有任何提示。這種類

13、型的網(wǎng)頁(yè)布局大多用于企業(yè)網(wǎng)站或個(gè)人網(wǎng)站。 Flash型是指整個(gè)網(wǎng)頁(yè)就是一個(gè)Flash動(dòng)畫，這是一種比較新潮的布局方式。其實(shí)，這種布局與封面型在結(jié)構(gòu)上是類似的，無(wú)非使用了Flash技術(shù)。,28,29,網(wǎng)頁(yè)頁(yè)面與版塊,布局的設(shè)計(jì)通常需要注意網(wǎng)站的頁(yè)面大小以及各種版塊的安排 1網(wǎng)頁(yè)頁(yè)面大小 合理地設(shè)置頁(yè)面尺寸，可以避免用戶頻繁地拖動(dòng)滾動(dòng)條。目前國(guó)內(nèi)的上網(wǎng)者習(xí)慣使用是微軟公司的Internet Explorer瀏覽器（簡(jiǎn)稱IE瀏覽器）。 在屏幕分辨率為1024768時(shí)，不同版本的IE瀏覽器的屏幕大小是不相同的。以下是各版本IE瀏覽器頁(yè)面尺寸表。,30,30,網(wǎng)頁(yè)頁(yè)面與版塊,2網(wǎng)頁(yè)版塊構(gòu)成 網(wǎng)頁(yè)是由各種

14、版塊構(gòu)成的。Internet中的網(wǎng)頁(yè)內(nèi)容各異。然而多數(shù)網(wǎng)頁(yè)都是由一些基本的板塊組成的，包括Logo、導(dǎo)航條、Banner、內(nèi)容版塊、版尾等。,31,31,網(wǎng)頁(yè)版面布局技術(shù)分析,表格布局：簡(jiǎn)單但是下載速度慢 框架布局：兼容性不好 CSS技術(shù)：可以精準(zhǔn)定位元素但有些復(fù)雜,32,網(wǎng)頁(yè)版面布局原則,主次分明，中心突出 大小搭配，相互呼應(yīng) 圖文并茂，相得意彰,33,版面布局的步驟,草案：在白紙上將景象畫上去 粗略布局：將功能模塊安置到頁(yè)面上 定案：將粗略布局精確化，具體化,34,Logo,Logo是企業(yè)或網(wǎng)站的標(biāo)志，其作用是標(biāo)識(shí)網(wǎng)站的名稱，并為用戶提供 識(shí)別的標(biāo)記。絕大多數(shù)網(wǎng)站都有一個(gè)獨(dú)特的Logo。L

15、ogo對(duì)于網(wǎng)站而言是唯一的。,35,35,Logo的大小,一、120120，這種廣告規(guī)格適用于產(chǎn)品或新聞?wù)掌故尽?二、12060，這種廣告規(guī)格主要用于做LOGO使用。 三、12090，主要應(yīng)用于產(chǎn)品演示或大型LOGO。 四、125125，這種規(guī)格適于表現(xiàn)照片效果的圖像廣告。 五、23460，這種規(guī)格適用于框架或左右形式主頁(yè)的廣告鏈接。 六、39272，主要用于有較多圖片展示的廣告條，用于頁(yè)眉或頁(yè)腳。 七、46860，應(yīng)用最為廣泛的廣告條尺寸，用于頁(yè)眉或頁(yè)腳。 八、8831，主要用于網(wǎng)頁(yè)鏈接，或網(wǎng)站小型LOGO。,36,1.2.2 導(dǎo)航條,導(dǎo)航條是網(wǎng)站的重要組成元素。其可以索引網(wǎng)站內(nèi)容，幫助用

16、戶快速訪問(wèn)網(wǎng)站功能。 導(dǎo)航條內(nèi)包含的是網(wǎng)站功能的按鈕或鏈接，其項(xiàng)目的數(shù)量不宜過(guò)多。通常同級(jí)別的項(xiàng)目數(shù)量以3到7個(gè)為宜。一個(gè)網(wǎng)站往往可包含多個(gè)級(jí)別的導(dǎo)航條，例如主導(dǎo)航條、登錄導(dǎo)航條、友情鏈接導(dǎo)航條等。有時(shí)導(dǎo)航條也會(huì)與banner結(jié)合使用，通過(guò)圖像增強(qiáng)導(dǎo)航條的表現(xiàn)力。,37,37,Banner,Banner為網(wǎng)頁(yè)中的廣告條，又被稱作旗幟、網(wǎng)幅或橫幅，是一種可以由文本、圖像和動(dòng)畫相結(jié)合而成的網(wǎng)頁(yè)欄目。 國(guó)際廣告聯(lián)盟的“標(biāo)準(zhǔn)與管理委員會(huì)”聯(lián)合廣告支持信息和娛樂(lè)聯(lián)合會(huì)等國(guó)際組織，推出了一系列網(wǎng)絡(luò)廣告宣傳物的標(biāo)準(zhǔn)尺寸，被稱作“IAC/CASIE”標(biāo)準(zhǔn)，共包括7種標(biāo)準(zhǔn)的Banner尺寸。 在設(shè)計(jì)Banner

17、時(shí)，既可遵循以上標(biāo)準(zhǔn)，以方便網(wǎng)站的廣告用戶設(shè)計(jì)廣告。同時(shí)，也可靈活根據(jù)網(wǎng)頁(yè)的版式對(duì)其尺寸進(jìn)行調(diào)節(jié)，以符合網(wǎng)頁(yè)整體的風(fēng)格和布局。,38,38,內(nèi)容版塊,網(wǎng)頁(yè)的內(nèi)容版塊通常是網(wǎng)頁(yè)的主體部分。這一版塊可以包含各種文本、圖像、動(dòng)畫、超鏈接等。 在設(shè)計(jì)內(nèi)容欄時(shí)，用戶可以先獨(dú)立地設(shè)計(jì)多個(gè)子欄，然后再將這些子欄拼接在一起，形成整體的效果。同時(shí)，還可以對(duì)子欄進(jìn)行優(yōu)化排列，提高用戶的體驗(yàn)。如網(wǎng)頁(yè)的內(nèi)容較少，則還可以使用單獨(dú)的內(nèi)容欄，通過(guò)大量的圖像使網(wǎng)頁(yè)更加美觀。,39,39,版尾版塊,版尾，顧名思義是網(wǎng)頁(yè)頁(yè)面最底端版塊，通常放置網(wǎng)站的版權(quán)信息。 版權(quán)信息的書寫需要遵循國(guó)際通行的規(guī)范，其格式如下所示。 Copyr

18、ight dates by author/owner Copyright 可以由copyright符號(hào)“”代替 dates可以是具體的年份，也可以是由年份表現(xiàn)的的時(shí)間段 author/owner為作者或所有者，可為個(gè)人名，也可為企業(yè)名。 在作者/所有者之后，可以添加“All Rights Reserved.”表示版權(quán)所有。但“All Rights Reserved.”的大小寫和最后英文句號(hào)”.” 不可省略。如需要添加中文的“版權(quán)所有”，應(yīng)寫在英文版權(quán)所有之后。 例如，清華大學(xué)網(wǎng)站的版尾信息為“2010 Tsinghua University. All Rights Reserved.”,40,

19、1.2網(wǎng)站的規(guī)劃:實(shí)例,確定建立網(wǎng)站的目標(biāo) 確定網(wǎng)站的類型 確定網(wǎng)站主體內(nèi)容 確定網(wǎng)站風(fēng)格 確定網(wǎng)頁(yè)系統(tǒng)樹(shù) 確定網(wǎng)頁(yè)內(nèi)容 定制數(shù)據(jù)庫(kù) 考慮網(wǎng)絡(luò)的技術(shù)問(wèn)題,41,你建網(wǎng)站的目的是什么？,產(chǎn)品、服務(wù)的銷售 建立一種公益性服務(wù) 為一種思想、觀念、事業(yè)作宣傳 使自己的業(yè)務(wù)走向世界,42,網(wǎng)站的類型是什么,信息：全國(guó)性媒體，地方性媒體，商業(yè)信息，地方信息 商務(wù)：公司站點(diǎn)，銷售站點(diǎn) 組織：法律法規(guī)，教育站點(diǎn) 專題：旅游，財(cái)經(jīng)，體育，科學(xué)，食品 個(gè)人：個(gè)人展臺(tái),43,網(wǎng)站用戶的確定,網(wǎng)站的用戶是誰(shuí)？ 用戶的興趣是什么？他們需要從網(wǎng)站中得到什么信息？,44,你的主要用戶是誰(shuí)？,女性 男性 青少年 兒童 學(xué)生

20、所有人 其它,45,網(wǎng)站主題是什么,主題選材應(yīng)該小而精。 選題不要太濫，目標(biāo)定位不要太高。,46,網(wǎng)站的風(fēng)格是什么？,是活潑的如迪斯尼 平易近人的如網(wǎng)易 嚴(yán)肅的如IBM,47,樹(shù)立網(wǎng)站風(fēng)格,風(fēng)格是建立在有價(jià)值內(nèi)容之上 需要徹底清楚希望網(wǎng)站給人的印象是什么 努力加強(qiáng)印象,48,有關(guān)風(fēng)格設(shè)計(jì)的建議,使網(wǎng)站的LOGO盡可能出現(xiàn)在每個(gè)頁(yè)面上 突出網(wǎng)站的標(biāo)準(zhǔn)色彩 使用同一的語(yǔ)氣和人稱 使用同一的圖片處理效果,49,網(wǎng)頁(yè)系統(tǒng)樹(shù),確定網(wǎng)站的欄目以后，需要繪制出網(wǎng)站的結(jié)構(gòu)圖。 通過(guò)系統(tǒng)樹(shù)可以方便對(duì)網(wǎng)頁(yè)進(jìn)行維護(hù)，規(guī)劃和設(shè)計(jì)。,50,網(wǎng)頁(yè)內(nèi)容,進(jìn)一步的細(xì)化，明確網(wǎng)頁(yè)中包含的文字，圖片，網(wǎng)頁(yè)的鏈接,51,網(wǎng)絡(luò)的技術(shù)

21、問(wèn)題,帶寬： 瀏覽器與分辨率：,52,1.3網(wǎng)站的設(shè)計(jì),網(wǎng)站設(shè)計(jì)的基本原則 網(wǎng)站設(shè)計(jì)技巧 設(shè)計(jì)主頁(yè)應(yīng)避免的問(wèn)題,53,1.3.1網(wǎng)站設(shè)計(jì)的基本原則,內(nèi)容明確：圍繞網(wǎng)站功能 快速下載：網(wǎng)頁(yè)不大于60kB 點(diǎn)擊規(guī)則:瀏覽信息的點(diǎn)擊次數(shù)不超過(guò)三次 網(wǎng)站介紹：告訴瀏覽者網(wǎng)站提供什么信息 慎用特殊字體和顏色：不同系統(tǒng)平臺(tái)產(chǎn)生不同效果 少用閃爍：喧賓奪主 少用框架：,54,圖像的應(yīng)用：不要使用跨幅整個(gè)屏幕的圖像 慎用聲音：影響下載速度 空白萬(wàn)歲：吸引訪問(wèn)者的注意力,55,1.3.2 網(wǎng)站設(shè)計(jì)技巧,1.定位網(wǎng)站的CI形象 LOGO標(biāo)志：不宜過(guò)大 標(biāo)準(zhǔn)色彩：能體現(xiàn)網(wǎng)站形象的色彩（不超過(guò)3種） 2.確定網(wǎng)站的整

22、體風(fēng)格（標(biāo)志，色彩，版面布局，瀏覽方式，交互性，文字，語(yǔ)氣，價(jià)值） 3.確定網(wǎng)站的目錄結(jié)構(gòu)和命名規(guī)則（*） 4.確定網(wǎng)站的鏈接結(jié)構(gòu) 5.首頁(yè)的設(shè)計(jì),56,網(wǎng)站首頁(yè)的設(shè)計(jì),確定網(wǎng)站首頁(yè)上實(shí)現(xiàn)的主要內(nèi)容和功能 設(shè)計(jì)網(wǎng)頁(yè)的版面：先繪制出，再實(shí)現(xiàn),57,1.3.3 設(shè)計(jì)主頁(yè)應(yīng)避免的問(wèn)題,沒(méi)有聯(lián)系地址 缺乏導(dǎo)航功能 大量使用表格 大量使用動(dòng)態(tài)圖像 站內(nèi)內(nèi)容不及時(shí)更新,58,網(wǎng)站發(fā)布,發(fā)布站點(diǎn)前，必須確定網(wǎng)頁(yè)的存儲(chǔ)空間。如果自己有服務(wù)器，配置好后，直接發(fā)布到上面即可。如果自己沒(méi)有服務(wù)器，則最好在網(wǎng)上申請(qǐng)一個(gè)空間來(lái)存放網(wǎng)頁(yè)，并申請(qǐng)一個(gè)域名來(lái)指定站點(diǎn)在網(wǎng)上的位置。發(fā)布網(wǎng)頁(yè)可直接使用Dreamweaver CS3中的“發(fā)布站點(diǎn)”功能進(jìn)行上傳。對(duì)于大型站點(diǎn)的上傳一般都使用FTP軟件，如LeapFTP、CuteFTP等，使用這種方法上傳下載速度都很快。,59,網(wǎng)站推廣,網(wǎng)站推廣活動(dòng)一般發(fā)生在網(wǎng)站發(fā)布之后，當(dāng)然有一些網(wǎng)站在籌備期間就開(kāi)始進(jìn)行宣傳。網(wǎng)站推廣是網(wǎng)絡(luò)營(yíng)銷的主要