個人網(wǎng)站的設(shè)計及其實現(xiàn)

1、 HYPERLINK / 屆本科畢業(yè)設(shè)計（論文）題目：個人網(wǎng)站的設(shè)計與實現(xiàn)班 級：04級計算機班 學(xué) 號： 2 姓 名： 指導(dǎo)教師： 個人網(wǎng)站的設(shè)計與實現(xiàn)個人網(wǎng)站的設(shè)計與實現(xiàn)前 言 隨著國際互聯(lián)網(wǎng)的普及，專門多人差不多不滿足僅僅在Internet上的掃瞄信息，而是希望更深入的參與其中，擁有自己的Web網(wǎng)站，這大概差不多成為一種潮流。假如講個人建立網(wǎng)站是為了追求時尚，那么企業(yè)建立網(wǎng)站確實是必定的選擇了。 不管是專業(yè)的，依舊業(yè)余的，專門多人對網(wǎng)頁制作頗感興趣。事實上制作一個簡單的網(wǎng)頁并不困難，會使用Word的人都能夠勝任。但想做出超凡脫俗的網(wǎng)頁就不那么容易了，而Dreamweaver卻能夠滿足你的

2、愿望，它是Macromedia公司開發(fā)的集網(wǎng)頁制作和網(wǎng)站治理于一身的所見即所得的網(wǎng)頁編輯器。 同樣出自Macromedia公司的Flash,Fireworks在制作網(wǎng)站的過程中起到了錦上添花的作用，是個人網(wǎng)站實現(xiàn)的好幫手，在制作網(wǎng)站的時候經(jīng)常會用到這些軟件。 本文有五章，我來由淺到深介紹個人網(wǎng)站的設(shè)計與實現(xiàn)。摘 要在互聯(lián)網(wǎng)走進我們的生活之前，沒有人敢夢想擁有自己的報紙、雜志、電臺、電視臺。除了政策上的制約外，一個人也全然沒有操作一份傳播媒體的能力?，F(xiàn)在不同了，互聯(lián)網(wǎng)給我們提供了一個“表達自我”的自由天地,你能夠擁有自己的新聞郵件，你能夠建立自己的個人網(wǎng)站。只要你辦得成功也能夠吸引成千上萬的訂戶

3、、讀者,并建立自己在眾多參與者中的權(quán)威地位。建立個人網(wǎng)站的差不多過程能夠分為以下七個環(huán)節(jié) :1 了解中國網(wǎng)絡(luò)個人主頁研究背景與進展現(xiàn)狀2 系統(tǒng)需求分析與總體設(shè)計3 熟悉網(wǎng)站開發(fā)模式、工具及環(huán)境4把自己的作品和想要展示的內(nèi)容制作成網(wǎng)頁。5 使用動態(tài)網(wǎng)頁技術(shù)(ASP) ，實現(xiàn)動態(tài)內(nèi)容更新。6 認(rèn)真地選取測試用例，進行交叉測試7 網(wǎng)站的后期完善、宣傳及進展方向其中 ,網(wǎng)頁制作和使用動態(tài)網(wǎng)頁技術(shù)(ASP) 實現(xiàn)動態(tài)內(nèi)容更新是網(wǎng)站開發(fā)的核心內(nèi)容。關(guān)鍵詞：網(wǎng)頁、制作、訪問、鏈接Abstract Enters before our life in the Internet, nobody dares to

4、vainly hope for has own newspaper, the magazine, the broadcasting station, the television station. Besides the policy in restriction, a person simply has not also operated dissemination media the ability. Now has been different, Internet has provided to us the expression free world,You may have own

5、news mail, you may establish own individual website.So long as you also manage the success to be possible to attract the tens of thousands of subscribers, the reader,And establishes oneself in the multitudinous participants authoritative status. Establishes individual website the unit process to be

6、possible to divide into following seven links:1 、understands the Chinese network individual main page research background and the development present situation2 systems demands analysis and system design3 familiar websites developments pattern, tool and environment4 and wants own work the content wh

7、ich demonstrated to manufacture the homepage.5 uses dynamic homepages technology (ASP), realization dynamic content renewal.6 earnestly selects measured the test example, carries on the overlapping test7 websites later periods consummate, the propaganda and the development direction Among them,The h

8、omepage manufacture and the use dynamic homepage technology (ASP) realizes the dynamic content renewal is the website development core content.Key word: Homepage, manufacture, visit, link目 錄 第一章 引言1.1什么是Internet1.2Internet有哪些功能1.3www簡介1.4網(wǎng)頁差不多構(gòu)成元素1.5軟件的安裝與啟動1.5.1軟件的安裝1.5.2軟件的啟動1.5.3創(chuàng)建快捷方式1.6制作網(wǎng)頁前的預(yù)備

9、1.7Dreamweaver的操作環(huán)境1.7.1標(biāo)題欄1.7.2菜單欄1.7.3快捷工具欄1.7.4屬性面板第二章 網(wǎng)站制作實戰(zhàn)2.1 站點2.1.1創(chuàng)建站點2.1.2 創(chuàng)建站點內(nèi)容 2.2 首頁2.2.1 設(shè)置首頁布局2.2.2 設(shè)置首頁的頁面屬性2.2.3 查看和編輯頭內(nèi)容2.2.4 插入圖像2.2.5 插入多媒體2.2.6 插入文本2.3 創(chuàng)建其它網(wǎng)頁第三章 建立網(wǎng)頁鏈接3.1 文字鏈接3.2 圖像鏈接3.3 E-Mail鏈接3.4 文件下載鏈接3.5 在HTML語言中建立網(wǎng)頁鏈接3.5.1 文字鏈接3.5.2 圖像鏈接3.5.3 E-Mail鏈接3.6.4 文件下載鏈接第四章 結(jié)論致

10、謝參考文獻 第一章 預(yù)備知識1.1 什么是Internet Internet的中文名為“國際互聯(lián)網(wǎng)”，又稱“因特網(wǎng)”。 Internet是由眾多的計算機網(wǎng)絡(luò)互聯(lián)而成的互聯(lián)網(wǎng)，它覆蓋了全世界各地，它是采納開放系統(tǒng)協(xié)議的計算機通訊網(wǎng)絡(luò)。然而，Internet不僅僅是計算機的互聯(lián)網(wǎng)，它依舊全球最大的信息資源寶庫，它提供了包括科研、教育、文化娛樂、商業(yè)和信息交流等各種各樣的服務(wù)，使得世界范圍內(nèi)的人與人之間的交流在時刻和空間上變的更小了。 要了解Internet，就必須先了解局域網(wǎng)。我們能夠?qū)⑼坏攸c的許多計算機使用網(wǎng)線連接在一起，構(gòu)成一個高效率的計算機網(wǎng)絡(luò)，所有處于網(wǎng)絡(luò)內(nèi)的終端機或電腦都能享受網(wǎng)絡(luò)內(nèi)所

11、有的資源，比如程序，圖文資料等。這種計算機網(wǎng)絡(luò)因為一般都局限在一定區(qū)域中，我們稱之為“局域網(wǎng)”（Local Area Network,簡稱LAN）,它是在日常工作中用得最多的一種小型計算機網(wǎng)絡(luò)。局域網(wǎng)所覆蓋的地理范圍比較小，通常不超過幾十公里，甚至只在同一座建筑物內(nèi)或者鄰近的幾座建筑內(nèi)。像常見的校園網(wǎng)，一座寫字樓內(nèi)部的網(wǎng)絡(luò)等都屬于局域網(wǎng)。 而Internet則不是指單個區(qū)域范圍內(nèi)的網(wǎng)絡(luò)，而是指將全世界的各中不同類型的計算機網(wǎng)絡(luò)連接起來的一個全球性的網(wǎng)絡(luò)。Internet上有取之不盡，用之不竭的信息資源。關(guān)于Internet中各種各樣的信息，所有的人都能夠通過網(wǎng)絡(luò)的連接來共享和使用。1.2 In

12、ternet有那些功能 Web頁掃瞄：這是目前利用最廣泛、最直接的互聯(lián)網(wǎng)服務(wù)，通過掃瞄WWW（萬維網(wǎng)）中的網(wǎng)頁，能夠了解世界各地的新聞，查看最新的股市行情，最新的娛樂動態(tài)、科技發(fā)明，找到眾多的就業(yè)信息幾乎想找到什么樣的信息，就有什么信息。正是有了WWW、Internet才會變得如此豐富多彩，才能走進千家萬戶。 信息公布：通過Internet，不僅能夠掃瞄不人公布在Web頁上的信息，也能夠?qū)⒆约阂嫉男畔⒅谱鞒蒞eb頁，也即網(wǎng)頁，然后公布到Internet上，供全世界的人掃瞄。 電子郵件：不同于傳統(tǒng)郵件，電子郵件(E-mail)通過Internet傳輸，寫信，發(fā)信，收信都在計算機上完成，一封電

13、子郵件最短在一秒之內(nèi)就能夠發(fā)送出去，其效率是傳統(tǒng)郵件無法比擬的。而且發(fā)送與接收電子郵件幾乎是免費的，因此比傳統(tǒng)郵件既節(jié)約時刻又經(jīng)濟的多。 網(wǎng)上談天：通過談天軟件（如QQ、ICQ等）或不同網(wǎng)站的談天室，能夠和世界各地的網(wǎng)友談天。網(wǎng)友可能是遠在天邊的異國朋友，也可能是與你一起工作的餓同事，或者是一起生活的家人，在那個地點沒有年齡、性不、身份、職業(yè)、國籍、膚色的限制，完全突破了交友的傳統(tǒng)方式，人們可通過Internet互相了解對方，進行各種各樣的交流。 電子商務(wù)：現(xiàn)在網(wǎng)上交易差不多成為現(xiàn)實，網(wǎng)上購物、網(wǎng)上商品銷售、網(wǎng)上拍賣、企業(yè)級電子商務(wù)、網(wǎng)上貨幣支付等電子商務(wù)活動差不多搞的有聲有色，幾乎所有的專家

14、都預(yù)測，在以后的幾年內(nèi)，電子商務(wù)會飛速進展。在不久的今后，您能夠做在電腦前進行各種各樣的商務(wù)活動。 網(wǎng)絡(luò)游戲：通過Internet，能夠與全世界的玩家一起進行游戲?qū)?zhàn)，也能夠協(xié)同作戰(zhàn)。網(wǎng)絡(luò)游戲差不多成為信息產(chǎn)業(yè)全新的經(jīng)濟增長點，每年都為開發(fā)商帶來巨額的利潤。通過網(wǎng)絡(luò)游戲，能夠充分享受Internet給我們帶來的樂趣。 網(wǎng)絡(luò)電話：網(wǎng)絡(luò)電話也稱IP電話。它采納Internet技術(shù)，利用專門的網(wǎng)絡(luò)電話軟件，只需支付特不低廉的話費就可通話。Internet在電信市場上的應(yīng)用將越來越廣泛。1.3 WWW的簡介 WWW的全稱為World Wide Web，含義是“環(huán)球網(wǎng)”，又稱“萬維網(wǎng)”、3W、Web。

15、WWW是一個基于超文本（Hypertext）方式的信息檢索服務(wù)工具。我們上網(wǎng)掃瞄到的網(wǎng)頁確實是如此的超文本，也確實是HTML(Hypertext Mark-up Language,超文本標(biāo)記語言)文件，這些網(wǎng)頁文件被放置到WWW服務(wù)器上，同時都有一定的地址。當(dāng)我們想掃瞄某個網(wǎng)站時，首先要在電腦上安裝掃瞄器，如Internet Explorer或Netscape，然后在掃瞄器中輸入網(wǎng)站的地址（網(wǎng)址），就能夠進入網(wǎng)站進行掃瞄。在這些網(wǎng)頁中，都有超連接，當(dāng)將鼠標(biāo)指針移動到某個地點（如文本或圖象）時，鼠標(biāo)指針就會變成一個小手形形狀，單擊它就能夠連接到另個網(wǎng)頁中，從而使得掃瞄者能在不同的信息之間跳轉(zhuǎn)，我

16、們之因此能在Internet的海洋中穿梭自如，正是超連接的功勞。 WWW 為我們帶來的是世界范圍的超級文本服務(wù)：只須操縱鼠標(biāo)，就能夠通過Internet從世界各地調(diào)來你所希望的文本、圖像、動畫和聲音等信息。通過使用WWW，一個不熟悉網(wǎng)絡(luò)使用的人也能夠成為Internet的行家。1.4網(wǎng)頁差不多構(gòu)成元素 要學(xué)會制作網(wǎng)頁，首先需要了解網(wǎng)頁差不多上由什么元素構(gòu)成的。 文字：文本是構(gòu)成網(wǎng)頁的差不多元素。一個最簡單的網(wǎng)頁能夠只有幾行文本。 圖片：正是有個各種漂亮的圖片，網(wǎng)頁才變得多姿多彩。 動畫：現(xiàn)在，網(wǎng)頁上的動畫越來越多，最常用的有GIF動畫、Flash動畫等。 超連接：如上所述，超連接幾乎是必不可少

17、的。一個沒有超連接的網(wǎng)頁，就如同汪洋大海中的一座孤島，失去了與外界的一切聯(lián)系。 其它元素：還能夠在網(wǎng)頁中添加聲音、視頻等元素。1.5軟件的安裝與啟動 要使用網(wǎng)站設(shè)計軟件，自然先要將這些軟件安裝到自己的電腦中。安裝完畢，還需要如何啟動，如何創(chuàng)建快捷方式。下面就讓我們來詳細(xì)地看一看具體的操作步驟。1.5.1軟件的安裝 安裝之前，需要先了解軟件對系統(tǒng)的要求。以Windows為例，系統(tǒng)要求如下： Intel Pentium II處理器或等效處理器，主頻300MHz或更高。 Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windows

18、Me或Windows XP. Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer. 96MB的可用內(nèi)存（RAM），建議采納128MB內(nèi)存。 分辨率可達 800600像素的256色顯示器（建議顏色為百萬顏色，分辨率達到1024768像素）。 CD-ROM 驅(qū)動器。 檢查一下您的計算機，看是否具備了以上條件。假如具備，將“Macromedia Studio MX”程序會自動運行。假如不能自動運行，能夠找到光盤放入光驅(qū)，安裝程序會自動運行。能夠找到光盤中的“Install Macromedia Studio MX”程序或“Autorun”

19、程序并雙擊運行。 Dreamweaver的安裝比較容易，幾乎能夠自動完成。下面簡要講明一下安裝步驟。操作步驟： 1、將安裝光盤放入光驅(qū)，安裝程序自動運行，并出現(xiàn)安裝界面。假如單擊安裝界面上的“Macromedia STUDIO MX安裝”，那么將會安裝其下方所列出的軟件。所有的安裝會自動完成。2、單擊Dreamweaver MX,開始安裝過裝過程.先是出現(xiàn)解壓縮文件窗口,等待一會兒,便會出現(xiàn)安裝向?qū)υ捒?。單擊“下一步”按鈕，接著安裝過程。3、出現(xiàn)“選擇目的地位置”對話框，默認(rèn)的盤是C盤，假如想安裝到不同的位置，能夠單擊目的文件夾右邊的“掃瞄”按鈕，并在彈出的“選擇文件夾”對話框選擇不同的文件

20、，如要安裝在D盤則可直接將路徑中的“C：”改為“D:”。也能夠在下面的“目錄”中選擇其它的文件夾，設(shè)置完后，單擊“確定”，回到“選擇目的地址”對話框，單擊“下一步”接著。4、而后會出現(xiàn)“默認(rèn)編輯器”的對話框，默認(rèn)為全選。假如希望讓Dreamweaver MX成為下面所列文件類型的默認(rèn)編輯器，那么能夠在那個地點做選擇。選擇完畢，單擊“下一步”按鈕。5、出現(xiàn)“開始復(fù)制文件”對話框，單擊“下一步”安裝程序開始復(fù)制文件，過幾分鐘后，安裝結(jié)束，單擊“結(jié)束”按鈕，結(jié)束安裝。1.5.2 軟件啟動 軟件安裝完畢后，我們就能夠使用它了。安裝程序差不多自動在“開始”菜單中加入了快捷方式。 單擊“開始”菜單，將鼠標(biāo)

21、指針依次指向“程序”|“Macromedia”|“Macromedia MX”,并在上面單擊鼠標(biāo)左鍵。1.5.3 創(chuàng)建快捷方式 使用“開始”菜單啟動程序的過程比較煩瑣。能夠在Windows桌面或快速啟動欄上創(chuàng)建快捷方式，如此能夠快速的啟動程序。 具體實現(xiàn)方法是：在“開始”菜單中找到相應(yīng)程序的快捷方式，只是這是不要用鼠標(biāo)左鍵單擊，而是用右鍵按住向桌面拖動，然后松開右鍵，會出現(xiàn)一個快捷菜單，在其中能夠選擇不同的命令，比如選擇“在當(dāng)前位置創(chuàng)建快捷方式”或“復(fù)制到當(dāng)前位置”。 如此以后在運行程序時，就方便快捷的多了。1.6 制作網(wǎng)頁前的預(yù)備電腦必備：電腦速度夠快，最好能夠上網(wǎng)。操作系統(tǒng)：Windows

22、 98/NT/Me/2000/XP.軟件可選：其它軟件：看圖軟件ACDSee、圖像處理軟件Photoshop、上傳工具CuteFTP、Fireworks、動畫軟件Flash等。1.7 Dreamweaver MX的操作環(huán)境 我們將工作界面分成了“標(biāo)題欄”、“菜單欄”、“快捷工具欄”、“屬性面板”、“浮動操縱面板”5個部分來分不介紹。 1.7.1 標(biāo)題欄 Dreamweaver MX的“標(biāo)題欄”中將顯示文字“Macromedia Dreamweaver MX”假如打開網(wǎng)頁的話，在后面還會顯示該網(wǎng)頁的一些信息，如網(wǎng)頁標(biāo)題、所在位置及網(wǎng)頁名稱，右邊有三個鈕，分不對應(yīng)Dreamweaver MX的最大

23、化最小化和關(guān)閉的操作。1.7.2 菜單欄 “標(biāo)題欄”下面確實是“菜單欄”，欄中提供了“文件”、“編輯”、“查看”、“插入”、“修改”、“文本”、“站點”、“窗口”、“關(guān)心”10項菜單。單擊其中任意一項菜單，隨即就會出現(xiàn)一個下拉式指令菜單。有些指令的右邊會有鍵盤的代碼，這是該指令的快捷鍵，熟練使用快捷鍵將會有助于提高工作效率。有些指令的右邊會有一個小黑三角的標(biāo)記，它代表該指令還包含下一級的指令，鼠標(biāo)停留片刻即可顯示。1.7.3 快捷工具欄 “快捷工具欄”指的是“菜單欄”下邊的3排按鈕，選擇菜單“查看/工具欄”，勾選里面的“插入”、“文檔”和“標(biāo)準(zhǔn)”3項，完整的快捷工具欄就顯現(xiàn)出來了。1.7.4

24、屬性面板 在網(wǎng)頁編輯窗口的下面還有一個面板，它是有名的“屬性面板”，它在那個軟件中起到舉足輕重的作用。屬性面板顧名思義，確實是顯示，調(diào)整屬性的面板，依照鼠標(biāo)所選中對象的不同，“屬性面板”在界面上也會有所差異，用戶能夠分不對不同的對象進行調(diào)整。第二章 網(wǎng)站制作實戰(zhàn)2.1 站點2.1.1 創(chuàng)建站點 要制作一個網(wǎng)站，第一步操作差不多上一樣的，確實是要制造一個“站點”，如此能夠使整個網(wǎng)站的脈絡(luò)結(jié)構(gòu)清晰地展現(xiàn)在面前，幸免了以后再進行紛雜的治理。 從菜單中選擇“站點/治理站點”在彈出的對話框中選擇“新建”，之后再選擇其中的“站點”，再次彈出一個對話框，在文本框中輸入自己差不多企化好的網(wǎng)站名稱“追夢人”。

25、填好后，單擊“下一步”，進入下一個步驟。由于我要做的是一個靜態(tài)的網(wǎng)頁，因此選擇上面的一項“否，我不想使用服務(wù)器技術(shù)。”單擊“下一步”，進入下一個步驟。 在此選項中有兩個選擇，選擇推舉的“編輯我的計算機上的本地副本，完成后再上傳到服務(wù)器”。底下的文本框同意在本地磁盤上指定一個文件夾，Dreamweaver將在其中儲存站點文件的本地副本。單擊該文本框后面的文件夾圖標(biāo)，新建并指定一個空的文件夾“E:/ding”。之后單擊“下一步“，進入下一個步驟。 這一步是如何設(shè)置連接到遠程服務(wù)器，彈出式菜單中有6中選擇，那個地點選擇“無”。而后“下一步”再“完成”，即可。2.1.2 創(chuàng)建站點內(nèi)容 站點創(chuàng)建完成后，

26、就能夠創(chuàng)建Web頁來填充站點了。在“右側(cè)浮動面板組”中選擇“文件/文件”面板，現(xiàn)在整個網(wǎng)站中沒有任何內(nèi)容。用鼠標(biāo)右擊面板中的本地根目錄文件夾。 在彈出的菜單中選擇“新建文件”，新建一個文件后將其命名為“index.htm(或index.html),它確實是以后的首頁。 由于“追夢人”網(wǎng)站分為“平面設(shè)計”、“動畫制作”、“網(wǎng)文精品”、“經(jīng)典回憶”、“個人講明“這五個大欄目，因此接著用鼠標(biāo)右擊右側(cè)，在彈出的菜單中選擇第二項“New Folder（新建文件夾）”。執(zhí)行五次操作，新建五個文件夾，并把它們重命名為graph、anim、books、music、letter，分不對應(yīng)上面的五個大欄目。存放它

27、們各自的內(nèi)容。之后再次新建1個文件夾，命名為images,用來存放“所有的圖象文件”的內(nèi)容。 之后在個欄目的文件夾里還要建立想相應(yīng)的欄目網(wǎng)頁。 2.2 首頁2.2.1 設(shè)置首頁布局每個網(wǎng)站都會有一個首頁，就功能上而言，它代表著一個網(wǎng)站的風(fēng)格與特色，就網(wǎng)站架構(gòu)上而言，它代表了網(wǎng)站的第一層架構(gòu)，至于網(wǎng)站上其他Web頁，原則上都必須通過首頁來連接散播出去，可見首頁是多么的重要。首頁是打開網(wǎng)站后在掃瞄器中顯示的第一個頁面。它是起什么名字通常要視Server端的設(shè)置，一般的有index.htm,default.htm或home.htm等，目前要緊以index.htm的居多。因此，后綴名為html也是正確

28、的。具體設(shè)置方法是：右健單擊“文件”浮動面板中的index.htm,在彈出的菜單中選擇“設(shè)成首頁”。首頁的布局有專門多方法，在那個地點我所用到的是表格的“布局模式”?！安季帧蹦Ｊ街械谋砀穹Q為布局表格，單元格稱為布局單元格。在繪制布局表格和布局單元格時，必須從“標(biāo)準(zhǔn)”模式切換到“布局”模式。直接單擊“布局”按鈕即可。操作步驟：1、 在“插入快捷欄”的“布局”分類中，單擊“布局表格”按紐。2、 將變成“+”形狀的鼠標(biāo)光標(biāo)放到編輯中網(wǎng)頁上，在要繪制的地點進行拖動就能夠進行創(chuàng)建了。（假如繪制的是第一個表格必須從網(wǎng)頁的最左上角開始繪制）。3、 在那個地點要繪制多個表格，能夠再次單擊“布局表格”按紐進行繪

29、制，也能夠按住Ctrl鍵繪制多個表格。追夢人”網(wǎng)站首頁的布局如圖所示： 2.2.2設(shè)置首頁的頁面屬性首先雙擊“文件”浮動面板中的index.htm,進入頁面的編輯窗口。右健單擊空白區(qū)域，在菜單中選擇“頁面屬性”，之后彈出“頁面屬性”對話框，若選擇主菜單“修改/頁面屬性”項，也能夠把打開該對話框。在“頁面屬性”對話框中，左側(cè)窗口顯示“分類”，其中包括了“外觀”、“鏈接”、“標(biāo)題”、“標(biāo)題/編碼”、“跟蹤圖像”5項，右側(cè)區(qū)域則顯示各類中能夠設(shè)置的項目?！白穳羧恕笔醉撛O(shè)置的屬性如下圖所示：2.2.3查看和編輯頭內(nèi)容一個網(wǎng)頁文件結(jié)構(gòu)上實際是由兩部分組成，頭（head）內(nèi)容和主體（body）內(nèi)容主體內(nèi)容

30、（body）是文檔的要緊部分，也是包含文本和圖像等的可見部分。頭內(nèi)容（head）是除文檔標(biāo)題外的不可見部分，包含有文檔類型、語言編碼、搜索引擎的關(guān)鍵的關(guān)鍵字和內(nèi)容指示器以及樣式定義等重要信息，這些元器并不是每個頁面都需要的，例如，能夠僅為主頁提供關(guān)鍵字。下面就以首頁為例，講明如何樣插入較常用的頭（ head）內(nèi)容。單擊“菜單攔”下面“插入快捷”的下拉列表，選擇其中的HTML類，現(xiàn)在右側(cè)將會顯示該類中能夠插入的對象快捷按鈕，再次單擊第2個按鈕“文件頭”旁邊的下拉箭頭，會彈出菜單，該項列出的便是立即插入的頭內(nèi)容。 2.2.4 插入圖像圖像是網(wǎng)頁中不可或缺的組成成份，恰當(dāng)?shù)厥褂脠D像，能夠使網(wǎng)站充滿生

31、活生命力與講服力，吸引更多的掃瞄者，加深他們觀賞你網(wǎng)站的意愿。另一方面，網(wǎng)頁的容量大小是網(wǎng)站成功與否的一大關(guān)鍵因素。由于網(wǎng)絡(luò)在傳輸上的限制，導(dǎo)致了下載的速度不可能太快，因此，網(wǎng)頁的大小就不能太大，其中關(guān)鍵就在于圖像的大小了，否則掃瞄者會失去等待的耐心，不管你的網(wǎng)站多么精彩也無濟于事了。因此，在網(wǎng)面容量大小的問題上一定要重視。下面就來詳細(xì)介紹對網(wǎng)頁圖像進行處理的操作步驟，以使得它們在保持圖形漂亮與網(wǎng)站風(fēng)格搭配的基礎(chǔ)上，圖片文件能夠變的更小。1、 首先將光標(biāo)停留在要插入圖像的位置，然后單擊“菜單欄”下面“插入快健欄”的下拉表，選擇其中的“常用”類，則右側(cè)將會顯示該類中能夠插入的對象快鍵按鈕。左起第

32、5個即為“圖像：圖像”按鈕，單擊它右側(cè)的下拉列表，選擇第1項“圖像”。2、隨即彈出“選擇圖像源文件”對話框。從計算機磁盤中選擇想要插入的圖像文件，或在URL編輯框中輸入圖像的路徑和名稱。下面的“相關(guān)于”下拉表框中，可選擇文件URL地址的類型，假如選擇“文檔”選項，表示圖像地址相關(guān)于當(dāng)前文檔；假如選擇“站點根目錄”選項，表示地址相關(guān)于根目錄。在那個地點我要插入的是網(wǎng)站標(biāo)志logo，插入logo圖象，如圖所示：最后單擊“確定”按鈕，即可完成插入圖像的操作。2.2.5插入多媒體在Dreamweaver MX2004中，除了之前講到的能夠插入“圖像”外，還可插入動畫、聲音、視頻等媒體元素，如Flash

33、,Shockwave,Applets,ActieX及格Midi聲音文件等，同時還能夠在Dreamweaver自身內(nèi)插入Macromedia Flash MX2004按鈕和文本對象，以及進行相關(guān)的后期處理和添加設(shè)計備注等操作。在Dreamweaver MX 2004文檔中，能夠插入媒體文件包括Flash Shockwave影片、QuickTime 、AVI java、 applet Active X控件以及各種格式的音頻文件。要在掃瞄器中播放放Flash 動畫，必須在掃瞄器中集成“Flash 播放器 （Flash Player）”。其中，Internet Explorer通過ActiveX操縱來

34、實現(xiàn)，Netscape Navigator則是通過相應(yīng)的插件來實現(xiàn)的。在最新的Netscape Navigator和Internet Explorer掃瞄器中，均已集成了 Flash動畫播放功能。操場作步驟：步驟1 將光標(biāo)停留在要插入Flash的位置，然后單擊菜單欄下面“插入快捷欄”的下拉列表，選擇其中的“常用”分類，右側(cè)將會顯示該類中能夠插入的對象快捷按鈕。左起第6個即為“媒體”按鈕，單擊它右側(cè)的下拉列表，選擇第1項Flash圖標(biāo)。步驟2 在彈出的對話框中選擇擴展名為swf 的Flash文件，即可將其插入到Dreamwe aver的“網(wǎng)頁編輯窗口”中，能夠看到，在那個窗口中Flash文件的大

35、小。在 那個地點我的主頁插入的一個動畫，如圖所示：2.2.6插入文本文字是人類語言最差不多的表達方式，在網(wǎng)頁中，文本內(nèi)容也能夠講是重要的組成部分，一個網(wǎng)站成功與否，它是最關(guān)鍵的因素。在這最關(guān)鍵的因素?？韶S富網(wǎng)站的文字內(nèi)容，并以最最美觀、最整齊的方式放入到網(wǎng)頁中。插入文本的兩種方式網(wǎng)頁中需要大量的文本，我們或以通過以下兩種方式插入它們。一種是在網(wǎng)頁編輯窗口中直接用鍵盤敲入文本。這能夠確實是最差不多的輸入方式了，和一些文本編輯軟件（如Microsoft Word）的使用方法一樣，選擇好適應(yīng)的輸入法，就能夠運指如飛了。另一種是復(fù)制文本的方式。有些讀者可能不喜愛使用Dreamweaver MX2004

36、來進行打字的工作，而更適應(yīng)在專門的文本編輯軟件中快速打字，如Microsoft Word和 Windows自帶的記事本等，又或者讀者差不多預(yù)備好了要放入網(wǎng)頁的文本的電子版本，那么我們就能夠直接使用Dreamweaver的文本復(fù)制功能，將大段的文本內(nèi)容拷貝到網(wǎng)頁的編輯窗口來進行排版的工作，具體步驟如下。打開文本編輯軟件（如Microsoft Word），選中要復(fù)制的文本，它們將反白顯示，執(zhí)行菜單“編輯/復(fù)制”命令或直接用快捷鍵Ctrl+C，之后切換回Dreamweaver,將光標(biāo)停留在插入文本的位置，執(zhí)行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl+v,即可將大段的文本快速粘貼到網(wǎng)頁中。這在

37、我的“網(wǎng)文精品”中用到專門多，全部是在word軟件中排好ctrl+c,然后點擊要粘貼的位置，crtl+v到Dreamweaver即可。2.3創(chuàng)建其它網(wǎng)頁 還有其它的幾個網(wǎng)站與主頁的制作相同，一個網(wǎng)頁是圖象和文字的組合。 “平面設(shè)計”中的圖象插入和前面的介紹相似，并能夠在屬性攔中調(diào)節(jié)圖象的大小。 在Dreamwerver中常常會用到Firework、Flash，它們是相輔相成，在主頁中的主體部分確實是用Firework,如圖所示： 在“個人講明”中也用到這點，首先定好需要尺寸，在屬性中設(shè)好背景，顏色等等，插入圖象，輸入文字，也word里的操作雷同。第三章 建立網(wǎng)頁鏈接網(wǎng)站實際上是由專門多網(wǎng)頁組成

38、的，那么網(wǎng)頁之間是如何聯(lián)系的呢？這確實是本章要講的內(nèi)容網(wǎng)頁的“鏈接”?！版溄印?，又稱“超鏈接（Hyperlink）,它作為網(wǎng)頁的橋梁，起著相當(dāng)重要的作用。網(wǎng)頁中的專門多對象都能夠加入“鏈接”屬性。在Dreamweaver MX2004中，假如以“鏈接”的媒介來劃分的話，則“鏈接”能夠分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內(nèi)部鏈接和外部鏈接”、“E-mail鏈接”、“命名錨記鏈接”、“文件下載鏈接”和“跳轉(zhuǎn)菜單”，共8種。其中部分內(nèi)容在之前的章節(jié)中可能接觸過，那個地點將對其進行更深入的講解。3.1文字鏈接“文字鏈接”即以文字作為媒介的鏈接，它是網(wǎng)頁中最常被使用的鏈接方式，具有“文件

39、小、制作簡單和便于維護”的特點。接下來結(jié)合我的個人網(wǎng)站為實例，來講解如何為文字建立“鏈接”。具體操作步驟如下所述。操作步驟步驟1 預(yù)備好差不多制作完成的首頁的各個欄目頁面（假設(shè)除了“鏈接”，其他內(nèi)容都差不多制作完成了），該網(wǎng)站包含6個欄目，那個地點的5個欄目“平面設(shè)計”、“動畫制作”和“網(wǎng)文精品”、“經(jīng)典回憶”、“個人講明”為例來進行講解。步驟2 在Dreamweaver 中打開首頁，之后反白選取作為“鏈接”的文字。實例中要做到單擊不同的欄目的網(wǎng)頁。因此為第1個欄目“平面設(shè)計”設(shè)置鏈接，首先要反白選中“平面設(shè)計”4個文字。步驟3 觀看“屬性面板”，其中包括一個“鏈接”文本框。步驟4 接下來需要

40、把鏈接的地址加入到文本框中，方法有3種。那個地點我用到的是直接點擊文件夾圖標(biāo)，在文件夾中找到要鏈接的對象graph.htm。如此就建立了超鏈接。只是有點專門重要，由于大多數(shù)服務(wù)器都不支持中文文件名，而且對大小寫敏感，因此采納英文文件名并統(tǒng)一大小寫。如圖所示：步驟5 在“鏈接”文本框下面還有一個“目標(biāo)”下拉列表，從中能夠選擇鏈接網(wǎng)頁顯示的窗口方式，共有4種。如圖：實例中沒有選擇任何選項，保持空白，表示在原窗口中打開鏈接網(wǎng)頁。步驟6 還能夠設(shè)置一些“鏈接”的屬性，這是前面講過的內(nèi)容。單擊“屬性面板”中的“頁面屬性”，選擇其中的“鏈接”分類，能夠進行的設(shè)置有“鏈接字體”、“大小”、“鏈接顏色”、“變

41、換圖像鏈接”顏色、“已訪問鏈接”顏色、“活動鏈接”顏色及“下劃線樣式”。步驟7 至此，第1個欄目的鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁，再按下F12預(yù)覽，測試一下，當(dāng)鼠標(biāo)放在“平面設(shè)計”這4個文字上時將變成手形，同時掃瞄器窗口下面的狀態(tài)欄中會顯示鏈接到的網(wǎng)頁的地址，單擊文字，頁面會立即跳轉(zhuǎn)到第1個欄目中，這表示鏈接差不多制作成功了。步驟8 同理，按照以上步驟，再為“動畫制作”和“網(wǎng)文精品”“經(jīng)典回憶“等其它欄制作指向?qū)?yīng)欄目的鏈接。步驟9 通常在欄目頁面中還需要有“返回首頁”的鏈接，單擊其后能夠跳轉(zhuǎn)回首頁，因此在各個欄目中還要插入“網(wǎng)站首頁”的文字，同時制作指向首頁index.html的

42、鏈接，制作方法不變。至此，整個“文字鏈接”的實例就全就全部完成了。通過對那個實例的講解，讀者不僅應(yīng)該學(xué)會如何為文字制作鏈接，還應(yīng)用對“鏈接”有了更加深刻的理解，鏈接的目的何在？它到底能夠在網(wǎng)頁的網(wǎng)站中發(fā)揮什么樣的作用？如何樣才能更好地使用它？這些是網(wǎng)頁制作者更應(yīng)該考慮的問題。下面接著介紹其他類型的鏈接。3.2圖像鏈接“圖像”也是常被使用的鏈接媒體，它和“文字鏈接”特不相似。為圖像加入鏈接，首先應(yīng)該在網(wǎng)頁中插入“圖像”，有關(guān)插入“圖像”或“導(dǎo)航條”按鈕的內(nèi)容，接下來以我的網(wǎng)站“追夢人“為例，講解如何建立“圖像鏈接”。操作步驟步驟1 首先仍然要預(yù)備好差不多制作完成的首頁和各個欄目的頁面（假設(shè)除了“

43、鏈接”，其他內(nèi)容都差不多制作完成了），該網(wǎng)站包含6個欄目，下面我們就動手為這6個欄目分不制作它們的鏈接。步驟2 在Dreamweaver中打開網(wǎng)站的首頁，之后選取要制作“鏈接”的圖像。實例中先為第3個欄目“動畫制作”設(shè)置鏈接，因此選中包含“動畫制作”4個字的圖像。步驟3 觀看“屬性面板”，在“鏈接”文本框中輸入鏈接的文字地址。能夠使用之前講過的“指向文件”和“選擇文件”的方法。步驟4 假如有需要，能夠在“目標(biāo)”下拉列表中選擇“鏈接”網(wǎng)頁顯示的窗口方式，分不為-blank 、-parent 、-self或 top。實例中使用了默認(rèn)出的保留空白選項的方式。 步驟5 另外，讀者還能夠為圖像增加“替代

44、”文本。實例中為第1個欄目增加欄目名稱的“替代”文本。步驟6 至此，第1個欄目的圖像鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁，再按下F12預(yù)覽，測試一下，將鼠標(biāo)放在“動畫制作”4個文字上時將變成手形，同時掃瞄器窗口下面的狀態(tài)欄中會顯示出鏈接到的網(wǎng)頁的地址，同時會顯示出“替代”文本“動畫制作”，單擊文字，頁面會立即跳轉(zhuǎn)到第3個欄目中，這表示鏈接差不多制作成功了。步驟7 同理，按照以上步驟，再為其它幾幅圖像制作指向?qū)?yīng)欄目的鏈接。步驟8 在欄目頁面中制作“返回首頁”的鏈接，使得單擊后能夠跳轉(zhuǎn)回首頁，其制作方法不變。至此，整個“圖像鏈像”的實例就全部完成了。3.3E Mail的鏈接E-Mail鏈接

45、，是指當(dāng)掃瞄者單擊該鏈接之后，不是打開一個網(wǎng)頁文件，而是啟動用戶的E- Mail客戶端軟件（如Outlook Express）,并打開一個空白的新郵件，供掃瞄者撰寫內(nèi)容來與網(wǎng)站聯(lián)系人聯(lián)系，這是一種最方便的互動方式。結(jié)合“個人講明”網(wǎng)頁，建立E-Mail鏈接的步驟如下所述。操作步驟步驟1 將光標(biāo)停留在頁面右下角要插入E-mail鏈接的位置。步驟2 選擇“插入快捷欄”中的“常用”分類，單擊左側(cè)第2個“電子郵件鏈接”按鈕。步驟3 在彈出的“電子郵件鏈接”對話框中有兩個輸入項，分不是“文本”和“E-Mail” 。在“文本”項中輸入鏈接的文字，中文、英文均可，在E-Mail項中輸入網(wǎng)站聯(lián)系有的電子郵件地

46、址，如實例中的 HYPERLINK mailto:ding_ ding_。步驟4 單擊“確定”按鈕，具有“E-Mail鏈接”屬性的文本就 HYPERLINK mailto:ding_ ding_。插入到光標(biāo)所在位置了，按下 Ctrl+S保存網(wǎng)頁，再按下F12預(yù)覽查看實際效果。上面的方法只適用于文本的“E-Mail鏈接”，假如想在其它的對象（如圖像）上也加入這種鏈接，該怎辦呢？下面介紹第2種建立“E-Mail鏈接”的方法。事實上專門簡單，與前面講過的圖像加入鏈接的方法差不多一樣。先在頁面中需要的地點插入圖像，之后選中圖像，并在“屬性面板”的“鏈接”文本框中輸入如下語句即可mailto: HYPE

47、RLINK mailto:ding_ ding_ ?subject=網(wǎng)站的建議與第1種方法不同的是，E-Mail 地址前面增加了mailto:字樣。用這種方法就能夠給圖像等其他對象建立“E-Mail鏈接”了。3.4文件下載鏈接“文件下載鏈接”的原理專門簡單，只要鏈接文件屬于掃瞄無法識不的關(guān)型，便都會使用IE掃瞄器直接進行下載，并保存到本地計算機中。掃瞄器無法識不的文件類型有專門多，那個地點就介紹一個最常用的，以zip或rar為后綴名的壓縮格式文件，這種文件能夠使用主流的壓縮軟件（如winzip、winrar）來制作。下面我們就業(yè)以實例來講明。在前面“插入多媒體”一章中，我們曾經(jīng)講過直接鏈接文件的方式來插入“視頻”，即直接在“鏈接”文本框中輸入“文件名+名后綴名”，如olympus.wmv。單日擊那個鏈接，通過數(shù)據(jù)下載后，Windows系統(tǒng)將啟動自帶的媒體播放器Windows Media Play