第一篇：個人網(wǎng)站設計心得

從獨立維護一個網(wǎng)站的角度出發(fā)，在技術知識上，我把需要掌握的知識劃分為五部分：

一、基礎知識

包括一定的美術創(chuàng)意，去掌握一定的美術基礎知識。

計算機基礎知識，計算機原理、計算機軟硬件配置，安裝和維護。

二、基本技能

包括：Html,Dreamweaver,s,Photoshop,Flash,Frontpage,CSS,Access

三、中級技能

包括：Javascript,Vbscript,ASP,JSP,DHTML

四、高級技能

包括：PHP,SQLServer,ActiveX,五、附加知識

包括：Ultraedit,3DMax,多媒體，CorelDraw,Illustrator,Freehand,局域網(wǎng)知識

如果你掌握了以上所有技能，那我相信你完全可以獨立地維護一個企業(yè)的動態(tài)網(wǎng)站了，你一定會成為所有公司所需要的搶手人才：）以上內(nèi)容由空間申請站長整理，轉(zhuǎn)載時請注明！

第二篇：杭州網(wǎng)站設計心得匯總

杭州網(wǎng)站設計心得匯總

對于杭州網(wǎng)站設計這一塊，大家一直關心的是怎樣設計自己的網(wǎng)站?那么杭州網(wǎng)站設計網(wǎng)站制作公司蒙特就給大家分享一下我們是如何建站的：定位網(wǎng)站的主題和名稱

網(wǎng)站的主題也就是網(wǎng)站的題材，網(wǎng)站設計開始首先遇到的問題。網(wǎng)站題材千奇百怪,琳瑯滿目，只要想的到，就可以把它制作出來。

每個大類都可以繼續(xù)細分，比如娛樂類再分為體育/電影/音樂等小類，音樂又可以按格式分為MP3，VQF，Ra等，按表現(xiàn)形式分古典，現(xiàn)代，搖滾等。同時，各個題材相聯(lián)系和交叉結(jié)合可以產(chǎn)生新得題材，例如旅游論壇(旅游+討論)，經(jīng)典入球播放(足球+影視)按這樣分下去，題材可以有成千上萬種。這么多題材，如何選擇呢?遵循的原則如下：

1、主題要小而精

定位要小，內(nèi)容要精。如果你想制作一個包羅萬象的站點，把所有你認為精彩的東西都放在上面，那么往往會事與愿違，給人的感覺是沒有主題，沒有特色，樣樣有，卻樣樣都很膚淺，因為你不可能有那么多的精力去維護它。網(wǎng)站的最大特點就是新和快，目前最熱門的個人主頁都是天天更新甚至幾小時更新一次。最新的調(diào)查結(jié)果也顯示，網(wǎng)絡上的“主題站”比“萬全站”更受人們喜愛，就好比專賣店和百貨商店，如果我需要買某一方面的東西，肯定會選擇專買店。

2、題材最好是你自己擅長或者喜愛的內(nèi)容

比如：你擅長編程，就可以建立一個編程愛好者網(wǎng)站;對足球感興趣，可以報道最新的戰(zhàn)況，球星動態(tài)等。這樣在制作時，才不會覺得無聊或者力不從心。興趣是制作網(wǎng)站的動力，沒有熱情，很難設計制作出優(yōu)秀的網(wǎng)站。

3、題材不要太濫或者目標太高。

“太濫”是指到處可見，人人都有的題材;比如軟件下載，免費信息?！澳繕颂摺笔侵冈谶@一題材上已經(jīng)有非常優(yōu)秀，知名度很高的站點，你要超過它是很困難的。

如果題材已經(jīng)確定以后，就可以圍繞題材給網(wǎng)站起一個名字。網(wǎng)站名稱，也是網(wǎng)站設計的一部分，而且是很關鍵的一個要素。你來看，“電腦學習室”和“電腦之家”顯然是后者簡練;“迷笛樂園”和“MIDI樂園”顯然是后者明晰;“兒童天地”和“中國幼兒園”顯然是后者大氣。我們都知道PIII的中文名稱“奔騰”，如果改為“奔跑”，可能就沒有今天這么“火”了。和現(xiàn)實生活中一樣，網(wǎng)站名稱是否正氣，響亮，易記，對網(wǎng)站的形象和宣傳推廣也有很大影響。杭州網(wǎng)站設計、網(wǎng)站制作公司蒙特的的建議是：004km.cn1、名稱要正

其實就是要合法，和理，和情。不能用反動的，色情的，迷信的，危害社會安全的名詞語句。

2、名稱要易記

最好用中文名稱，不要使用英文或者中英文混合型名稱。另外，網(wǎng)站名稱的字數(shù)應該控制在六個字(最好四個字)以內(nèi)，四個字的也可以用成語。字數(shù)少還有個好處，適合于其他站點的鏈接排版。

3、名稱要有特色

名稱平實就可以接受，如果能體現(xiàn)一定的內(nèi)涵，給瀏覽者更多的視覺沖擊和空間想象力，則為上品。在體現(xiàn)出網(wǎng)站主題的同時，能點出特色之處。

第三篇：網(wǎng)站設計實習心得實習心得

本次實習我主要負責的是網(wǎng)站框架的主頁部分的設計與制作，我利用面向?qū)ο蟮姆椒▽⒅黜摲殖闪宋鍌€模塊，每個模塊對應于一個子頁面，并通過超鏈接將該模塊與對應的子頁面鏈接起來。主頁是整個網(wǎng)站的基礎，它既要內(nèi)容充實豐富以致于不空洞，又要有一定的擴展空間以便于動態(tài)更新，因此主頁在整個網(wǎng)站制作上占有至關重要的地位。在這個過程中主要涉及的是網(wǎng)頁制作方面的知識，以及頁面的排版與美化。

關于餐飲娛樂頁面的制作就比主頁簡單一個，它是對主頁上的一個模塊的詳細展示。這個頁面我查閱了相關資料，利用了網(wǎng)上了部分圖片，對武漢市的餐飲娛樂方面進行了具體的介紹。涉及到的相關技術與主頁的制作一樣。

另外，我還制作了地圖導航頁面的部分功能，主要是根據(jù)ArcGIS Server從入門到精通上

第八章的內(nèi)容做的。在這個過程中，我發(fā)現(xiàn)很多功能比如放大縮小、漫游查詢等都是以前編程實現(xiàn)過的，而現(xiàn)在這些功能直接封裝在模版網(wǎng)頁里面了，這樣利用模版網(wǎng)頁就會節(jié)省很多時間。雖然最后地圖導航部分采用的是溫亞威同學制作的頁面，但是我還是學到了不少知識，學會了簡單地圖類網(wǎng)頁的制作以及模版網(wǎng)頁的制作方法。起碼現(xiàn)在能夠制作一幅簡單的武漢電子地圖了。

旅游景點頁面的制作我采用了與餐飲娛樂頁面的制作一樣的版式和結(jié)構(gòu)。不過最后還是覺得太單調(diào)了，最終采納了溫亞威同學的頁面。關于對武漢市的簡介頁面，我也查閱了很多資料，進行了相應的設計。

在這次實習的過程中，剛開始覺得無從下手，去圖書館借閱了好多資料，發(fā)現(xiàn)代碼看的是一頭霧水。后來通過查看參考網(wǎng)站上的源代碼，漸漸懂得了一些，開始制作的時候就有了一些思路?？磥韮H僅看書上的代碼是不夠的，還是要通過實踐才能發(fā)現(xiàn)問題，解決問題?？傊?，本次實習，我學到了很多課堂上根本學不到的東西，發(fā)現(xiàn)了學習和交流的重要性和必要性，深感到只靠一個人的力量是不夠的，只有大家互相交流，集思廣益，才能更好地促進學習。在實習時，感覺到自己的基礎知識還不夠扎實，溫故而知新，不僅鞏固了所學的知識，還擴展了新的知識，例如學到了不少ASP.NET的知識。希望以后能夠有更多這樣的實習。

第四篇：個人網(wǎng)站設計入門的一點小心得

目錄

第一章 網(wǎng)站內(nèi)容簡介········································ 3 1.1網(wǎng)站內(nèi)容簡介··············································· 3 1.2網(wǎng)站建設目的················································ 3 第二章 站點規(guī)劃················································ 4 2.1 軟件準備及素材收集··································· 4 2.2 確定用戶群體··············································· 4 2.3 設計結(jié)構(gòu)風格··············································· 4 第三章 網(wǎng)站的制作過程···································· 5 3.1 首頁制作過程 ············································· 5 3.2 其他頁面的制作 ········································· 5 3.3 制作體會 ····················································· 5 第四章 Web服務器搭建過程···························· 6 4.1安裝IIS ························································· 6 4.2 IIS中WEB服務器的基本配置··················· 6 第五章 虛擬主機、域名、網(wǎng)站上傳················ 7 5.1 虛擬主機 ······················································7 5.2 域名的申請和綁定 ······································ 7 5.3 網(wǎng)站的上傳···················································· 7

第一章 網(wǎng)站內(nèi)容簡介

1.1網(wǎng)站內(nèi)容簡介

本網(wǎng)站是以本專業(yè)通信工程為主題，里面主要包含專業(yè)部分介紹、考研、課件、軟件、電影、游戲、圖片、音樂等內(nèi)容。

下圖為網(wǎng)站首頁：

1.2網(wǎng)站建設目的

在接觸網(wǎng)頁設計后，本人抱著實踐與理論相結(jié)合的目的，以本專業(yè)通信工程為主題動手開發(fā)了這個網(wǎng)站，希望搭建一個能讓同學們了解專業(yè)動態(tài)、資料共享、學習娛樂相結(jié)合的平臺。

網(wǎng)站的建設不僅僅是制作主頁的問題，還需要考慮網(wǎng)站的定位、目標用戶、網(wǎng) 站內(nèi)容、服務事項、空間方案、安全性、藝術設計、數(shù)據(jù)庫技術等等。任何網(wǎng)站在 建設之前就必須明確方向、用途和服務群體等一系列的問題，寫出詳盡的建站計劃，可以說這是網(wǎng)站建設的根源和核心所在。

所以網(wǎng)站建設目的很重要，網(wǎng)站構(gòu)思之初首先就應該考慮好建設網(wǎng)站的目的。

第二章 站點規(guī)劃

2.1軟件準備及素材收集

因為本人網(wǎng)站構(gòu)造比較簡單，對網(wǎng)站制作知識也欠缺，所以軟件和素材也未做何準備，都是遇到需要什么就下什么，剛開始只采用網(wǎng)頁制作常用的Dreamweaver 8，后來涉及到加入其它元素和服務器的構(gòu)建,虛擬空間上傳就用到了Adobe Flash Cs3,PhotoShop Cs5, FileZilla Client，IIS V5.1等，素材方面都是臨時從網(wǎng)站上收集的，不過經(jīng)過本次實踐，本人已經(jīng)收集了網(wǎng)站制作必須用的各種軟件和大量素材，為以后的網(wǎng)站開發(fā)打下了良好的基礎。

2.2確定用戶群體

不同的網(wǎng)站目的要求通過不同的方式來實現(xiàn)。一個展示個人能力的網(wǎng)站與一個 以花卉種植為主題的網(wǎng)站，以及一個大型門戶網(wǎng)站和一個小型企業(yè)網(wǎng)站，其出發(fā)點和建站目的都有所不同，在整個網(wǎng)站的建設規(guī)劃方面的要求也是肯定是大不一樣的。因此在規(guī)劃我的這個網(wǎng)站時，我選擇了和大學生的生活和學習相關聯(lián)的主題。

本網(wǎng)站預計的用戶群體：對于網(wǎng)站的設計者和建設者來說，在設計規(guī)劃網(wǎng)站時 必須要明確自己網(wǎng)站的瀏覽者，也就是確定自己的用戶群體。在已經(jīng)確定了建設目的的前提下，應根據(jù)建站方向所會導致出現(xiàn)的不同用戶群體的需求來規(guī)劃設計整個 網(wǎng)站。我的這個網(wǎng)站就確定了以大學生為用戶群體。

2.3設定結(jié)構(gòu)風格

本網(wǎng)站的結(jié)構(gòu)和風格：本網(wǎng)站的結(jié)構(gòu)和風格等于以首頁為模板制作整個網(wǎng)站。

網(wǎng)站的風格反映了一個網(wǎng)站的特色，它具有很大的代表性。出色的網(wǎng)站吸引人的地方不僅僅在于其內(nèi)容，鮮明的結(jié)構(gòu)和獨特的風格往往能 起到畫龍點睛的作用。一個網(wǎng)站即使內(nèi)容再豐富，如果網(wǎng)站的結(jié)構(gòu)和風格不能吸引人，那也是毫無價值的。往往整個網(wǎng)站的風格是一個網(wǎng)站吸引瀏覽者的魅力所在，因此應當根據(jù)網(wǎng)站的主題、內(nèi)容和瀏覽者的要求來設計自己獨特的網(wǎng)站風格。那么什么是網(wǎng)站的結(jié)構(gòu)和風格呢？網(wǎng)站的結(jié)構(gòu)是連接網(wǎng)站內(nèi)容之間的支架。網(wǎng)站的結(jié)構(gòu) 是網(wǎng)站的核心和骨架，如果沒有網(wǎng)站結(jié)構(gòu)，網(wǎng)站將會變得一團糟?，F(xiàn)在，只有高度 發(fā)展、高度結(jié)構(gòu)化、易用且能獨立行走的網(wǎng)站才受瀏覽者的歡迎。

所以剛開始建設站點就應該根據(jù)主題設定好網(wǎng)站的結(jié)構(gòu)及風格。

第三章 網(wǎng)站制作過程

3.1首頁制作過程

首先展示一下首頁的布局情況 如下圖所示：

從上圖當中應可以大致看出網(wǎng)頁的布局模式，下面我簡述下，首先進入DW中設計窗口，插入表格，設定好行與列，然后進行DIV布局，1、頂部部分，其中又包括了LOGO、導航和背景音樂等；

2、內(nèi)容部分：主體內(nèi)容，鏈接；

3、底部，包括一些版權信息，聯(lián)系方式。

個人認為這個首頁做的很不好，不具有美觀性

3.2其他頁面制作過程

其他頁面基本上是以首頁為模板，然后加入相應欄目的鏈接，指向自己分享的資源。

3.3制作體會

待整個網(wǎng)站主體結(jié)構(gòu)大致建設完畢后，再進一步完善時，我這才體會到靜態(tài)網(wǎng)頁是多么的麻煩，例如要加入鏈接或資源時我需要一個個頁面打開來然后逐一添加，還有很重要的一點是交互性不強，我僅僅只是添加了一個QQ交談用來與用戶的交談，QQ交談不在線的時候留言也很不穩(wěn)定，造成用戶反饋失敗。如果是采用動態(tài)網(wǎng)頁技術的網(wǎng)站可以實現(xiàn)更多的功能，如用戶注冊、用戶登錄、在線調(diào)查、用戶管理、文章管理等等。

第四章 WEB服務器搭建過程

4.1 安裝IIS

1.首先 下載IIS 安裝包，window xp的下載iis v5.1 下載后解壓到指定文件夾。2.然后進入控制面板-添加或刪除程序-添加/刪除windows組件-勾選IIS-點擊詳細信息-選中WEB服務-確定-下一步-彈出來的對話框-把你剛剛解壓的安裝包的路徑復制進去-中間需要反復復制幾次

4.2 IIS中 Web服務器的基本配置

IIS中 Web 服務器的基本配置主要包括如下幾部分：

1.打開IIS服務器的配置窗口，選擇“開始”→“程序”→“管理工具”→“Internet服務管理器”，或者“選擇”→“控制面板”→“管理工具”→“Internet服務管理器”也可。

2.在打開的窗口中鼠標右擊“默認Web站點”，選擇“屬性”菜單。3.在出現(xiàn)的“默認Web站點屬性”窗口中，選擇“主目錄”標簽，用以設置Web內(nèi)容在硬盤中的位置，默認目錄為“C:Inetpub004km.cn域名目前個人不允許申請注冊，所以要申請則需要提供企業(yè)營業(yè)執(zhí)照。）

2、尋找域名注冊商；

3、查詢自己需要注冊域名是否能注冊；

4、查到想要注冊的域名，并且確認域名為可申請的狀態(tài)后，提交注冊，并繳納年費。

5、申請成功：正式申請成功后，即可開始進入DNS解析管理、設置解析記錄等操作。

域名綁定：國內(nèi)主機的域名綁定由于要備案，所以申請的時候，首先注冊好域名，然后提供正式的域名申請表，企業(yè)營業(yè)執(zhí)照副本復印件，介紹信和承辦人身份證復印件等材料，經(jīng)過人工審批后，一般需要一個月到兩個月的時間。一般域名注冊和虛擬主機在同一家服務商購買，方便以后的維護、續(xù)費等。

5.3網(wǎng)站的上傳

網(wǎng)站測試完畢，虛擬主機和域名注冊都已經(jīng)準備好，然后就是網(wǎng)站的上傳了，一般我們虛擬主機上傳都采用FTP工具上傳，我用的是FileZilla Client 上傳工具，在軟件中設置好站點信息（IP地址，用戶名，密碼等），然后連接，進入到你需要上傳的文件所在目錄，選中你上傳的文件上傳即可，如果是一整個網(wǎng)站上傳的話，壓縮后上傳再在虛擬主機上解壓這樣要快的多，而且不易丟失單個的文件。

第五篇：個人網(wǎng)站設計論文

秦皇島職業(yè)技術學院信息工程系

分類號： TP319

秦皇島職業(yè)技術學院 課程設計（論文）

個人博客網(wǎng)頁設計論文

學生姓專班指導教指導教師職名 王飛飛 業(yè) 計算機應用技術 級 1100103 師

稱

目錄

摘要 …………………………………………………………………………………2 前言 …………………………………………………………………………………3 第一章 關于網(wǎng)絡的知識.............................................4

秦皇島職業(yè)技術學院信息工程系

1.1 INTERNET的簡介.................................................4 1.2 WWW的簡介....................................................4 1.3網(wǎng)頁基本構(gòu)成元素..............................................5 1.4 制作網(wǎng)頁前的準備..............................................5 第二章 網(wǎng)站制作實戰(zhàn)...............................................6 2.1 站點..........................................................6 2.1.1 創(chuàng)建站點..................................................6 2.1.2 創(chuàng)建站點內(nèi)容..............................................6 2.2 首頁..........................................................7 2.2.1 設置首頁布局和頁面屬性....................................7 2.2.2 查看和編輯頭內(nèi)容..........................................9 2.2.3 插入圖像..................................................9 2.2.4 插入FLASH相冊...........................................10 2.2.5 插入文本.................................................10 2.3 創(chuàng)建其它網(wǎng)頁.................................................11 第三章 建立網(wǎng)頁鏈接..............................................12 3.1 文字鏈接.....................................................12 3.2 圖像鏈接.....................................................13 3.3在HTML語言中建立網(wǎng)頁鏈接....................................14 第四章 網(wǎng)站測試與維護 …………………………………………………………17 結(jié)論………………………………………………………………………………18 參考文獻 ……………………………………………………………………… 19 致謝………………………………………………………………………………20

摘 要

本論文主要是對個人網(wǎng)站的建立進行研究和探討。作品的主要技術指標包括：

1、制作出一個具有靜態(tài)技術的“個人網(wǎng)站”；

2、在制作的過程中，加強和 1

秦皇島職業(yè)技術學院信息工程系

深化以前所學的關于網(wǎng)頁設計的方法，同時更好的理解參考資料上的方法、理論和更好的利用Fireworks、Flash制作網(wǎng)站需要的一些圖片和影片。

本設計的主要內(nèi)容包括：

1、個人網(wǎng)站的設計思想，整體規(guī)劃及相關基礎知識；

2、個人網(wǎng)站的首頁設計，包括簡單的HTML語言及效果圖；

3、個人網(wǎng)站的調(diào)試。

網(wǎng)頁規(guī)劃包含的內(nèi)容很多，如網(wǎng)頁的結(jié)構(gòu)、欄目的設置、網(wǎng)頁的風格、顏色搭配、版面布局、文字圖片的運用等，也只有如此制作出來的網(wǎng)頁才能有個性、有特色，具有吸引力。

網(wǎng)站主題就是所要包含的主要內(nèi)容，一個網(wǎng)站必須要有一個明確的主題。特別是對于個人網(wǎng)站，不可能像單獨的網(wǎng)頁那樣做得內(nèi)容少而單一。所以必須要找準一些自己最感興趣內(nèi)容，做深、做透，辦出自己的特色，這樣才能給人留下深刻的印象。

關鍵詞：技術指標

基本設計內(nèi)容

網(wǎng)站規(guī)劃 網(wǎng)站主題

前言

隨著二十一世紀新興科技的飛速發(fā)展，如今的交流與交往不再是那么的單調(diào)，看如今不曾再有五百里加急文件的傳送，看如今已很少在出現(xiàn)寫信、寄信。人們正在運用現(xiàn)世紀的高科技來增加自己的交際圈，來發(fā)展自己的人脈關系，秦皇島職業(yè)技術學院信息工程系

同時，其它人也是通過高科技，悄悄的就能很容易地去了解，關注一個人。

正是因為人們的這些需求，所以出現(xiàn)了互聯(lián)網(wǎng)，正是因為人們的需求，所以出現(xiàn)了如今的網(wǎng)絡時代，網(wǎng)絡通訊工具。來方便人們的交往，交際與溝通。也正是因為人們的需求，所以出現(xiàn)了個人博客，通過一人簡單的網(wǎng)頁來展現(xiàn)自己的獨特魅力，自己的與眾不同。真正的做到了“足不出戶，便知天下人”。

互聯(lián)網(wǎng)加大了我們了解世界的眼界，縮緊了人與人之間的距離，這就更容易的使我們走上了信息化的道路。

我覺得一個網(wǎng)站的開始，應該有一個大體的規(guī)劃，網(wǎng)站的布局是最重要的，它起著一個網(wǎng)站成功與否的決定性作用，因為布局的好與壞，帶來的是網(wǎng)站整體上的美觀效果及應用。網(wǎng)站內(nèi)容上也能決定著網(wǎng)站成功與否，一個網(wǎng)站上的每個字眼都可能決定著這個網(wǎng)站，因為你不知道哪個字就是吸引別人的內(nèi)容，就是大家都追捧的話題，就是很潮的事物，所以內(nèi)容上一定要謹慎。再有，就是網(wǎng)站的圖片，一定要確準好路徑，以免圖像的丟失而不能再網(wǎng)站中顯示，其次就是鏈接，在Dreamweaver中提供了很簡單的鏈接命令，根據(jù)其提示操作即可。

我做了一個簡單的個人博客的網(wǎng)站，通過這個網(wǎng)站能讓大家更深的了解我，同時更重要的是鍛煉自己的實踐能力，鞏固自己學習的知識，彌補自己學習的不足。

第一章 關于網(wǎng)絡的知識

1.1什么是Internet Internet是由眾多的計算機網(wǎng)絡互聯(lián)而成的互聯(lián)網(wǎng)，它覆蓋了全世界各地，3

秦皇島職業(yè)技術學院信息工程系

它是采用開放系統(tǒng)協(xié)議的計算機通訊網(wǎng)絡。然而，Internet不僅僅是計算機的互聯(lián)網(wǎng)，它還是全球最大的信息資源寶庫，它提供了包括科研、教育、文化娛樂、商業(yè)和信息交流等各種各樣的服務，使得世界范圍內(nèi)的人與人之間的交流在時間和空間上變的更小了。

Web頁瀏覽：這是目前利用最廣泛、最直接的互聯(lián)網(wǎng)服務，通過瀏覽WWW（萬維網(wǎng)）中的網(wǎng)頁，可以了解世界各地的新聞，查看最新的股市行情，最新的娛樂動態(tài)、科技發(fā)明，找到眾多的就業(yè)信息??幾乎想找到什么樣的信息，就有什么信息。正是有了WWW、Internet才會變得如此豐富多彩，才能走進千家萬戶。1.2 WWW的簡介

WWW的全稱為World Wide Web，含義是“環(huán)球網(wǎng)”，又稱“萬維網(wǎng)”、3W、Web。WWW是一個基于超文本（Hypertext）方式的信息檢索服務工具。我們上網(wǎng)瀏覽到的網(wǎng)頁就是這樣的超文本，也就是HTML(Hypertext Mark-up Language,超文本標記語言)文件，這些網(wǎng)頁檔被放置到WWW服務器上，并且都有一定的地址。當我們想瀏覽某個網(wǎng)站時，首先要在計算機上安裝瀏覽器，如

Internet Explorer或Netscape，然后在瀏覽器中輸入網(wǎng)站的地址（網(wǎng)址），就可以進入網(wǎng)站進行瀏覽。在這些網(wǎng)頁中，都有超連接，當將鼠標指針移動到某個地方（如文本或圖像）時，鼠標指針就會變成一個小手形形狀，單擊它就可以連接到另個網(wǎng)頁中，從而使得瀏覽者能在不同的信息之間動畫和聲音等信息。通跳轉(zhuǎn)，我們之所以能在Internet的海洋中穿梭自如，正是超連接的功勞。

秦皇島職業(yè)技術學院信息工程系

1.3網(wǎng)頁基本構(gòu)成元素

要學會制作網(wǎng)頁，首先需要了解網(wǎng)頁都是由什么元素構(gòu)成的。文字：文本是構(gòu)成網(wǎng)頁的基本元素。一個最簡單的網(wǎng)頁可以只有幾行文本。圖片：正是有個各種美麗的圖片，網(wǎng)頁才變得多姿多彩。動畫：如今，網(wǎng)頁上的動畫越來越多，最常用的有GIF動畫、Flash動畫等。超連接：如上所述，超連接幾乎是必不可少的。一個沒有超連接的網(wǎng)頁，就如同汪洋大海中的一座孤島，失去了與外界的一切聯(lián)系。其它元素：還可以在網(wǎng)頁中添加聲音、視頻等元素。1.4 制作網(wǎng)頁前的準備

計算機必備：計算機速度夠快，最好能夠上網(wǎng)。操作系統(tǒng)：Windows 98/NT/Me/2000/XP.其它軟件：看圖軟件ACDSee、圖像處理軟件Photoshop、上傳工具CuteFTP、Fireworks、動畫軟件Flash等。

秦皇島職業(yè)技術學院信息工程系

第二章 網(wǎng)站制作實戰(zhàn)

2.1 站點 2.1.1 創(chuàng)建站點

要制作一個網(wǎng)站，第一步操作都是一樣的，就是要創(chuàng)造一個“站點”，從菜單中選擇“站點/管理站點”在彈出的對話框中選擇“新建”，之后再選擇其中的“站點”，再次彈出一個對話框，在文本框中輸入自己已經(jīng)企化好的網(wǎng)站名稱“my web”。填好后，單擊“下一步”，進入下一個步驟。由于我要做的是一個靜態(tài)的網(wǎng)頁，所以選擇上面的一項“否，我不想使用服務器技術。單擊“下一步”，進入下一個步驟。在此選項中有兩個選擇，選擇推薦的“編輯我的計算機上的本地副本，完成后再上傳到服務器”。底下的文本框允許在本地磁盤上指定一個文件夾，Dreamweaver將在其中儲存站點檔的本地副本。單擊該文本框后面的文件夾圖示，之后單擊“下一步“，進入下一個步驟。這一步是如何設置連接到遠程服務器，彈出式菜單中有6中選擇，這里選擇“無”。而后“下一步”再“完成”，即可。2.1.2 創(chuàng)建站點內(nèi)容

站點創(chuàng)建完成后，就可以創(chuàng)建Web頁來填充站點了。在“右側(cè)浮動面板組”中選擇“檔/檔”面板，在彈出的菜單中選擇“新建文件”，新建一個檔后將其命名為“index.htm(或index.html),它就是未來的首頁。

秦皇島職業(yè)技術學院信息工程系

2.2 首頁

2.2.1 設置首頁布局和頁面屬性

一、設置首頁布局

每個網(wǎng)站都會有一個首頁，就功能上而言，它代表著一個網(wǎng)站的風格與特色，就網(wǎng)站架構(gòu)上而言，它代表了網(wǎng)站的第一層架構(gòu)，首頁是打開網(wǎng)站后在瀏覽器中顯示的第一個頁面。它是起什么名字通常要視Server端的設置，一般的有index.htm,default.htm或home.htm等，目前主要以index.htm的居多。當然，后綴名為html也是正確的。具體設置方法是：右健單擊“檔”浮動面板中的index.htm,在彈出的菜單中選擇“設成首頁”。操作步驟：

1、在“插入快捷欄”的“布局”分類中，單擊“布局表格”按紐。

2、將變成“+”形狀的鼠標游標放到編輯中網(wǎng)頁上，在要繪制的地方進行拖動就可以進行創(chuàng)建了。（如果繪制的是第一個表格必須從網(wǎng)頁的最左上角開始繪制）?！癷ndex”表格布局如下圖：

秦皇島職業(yè)技術學院信息工程系

二、設置首頁的頁面屬性

首先雙擊“檔”浮動面板中的index.htm,進入頁面的編輯窗口。右健單擊空白區(qū)域，在菜單中選擇“頁面屬性”，之后彈出“頁面屬性”對話框，若選擇主菜單“修改/頁面屬性”項，也可以把打開該對話框。

在“頁面屬性”對話框中，左側(cè)窗口顯示“分類”，其中包括了“外觀”、“鏈接”、“標題”、“標題/編碼”、“跟蹤圖像”5項，右側(cè)區(qū)域則顯示各類中可以設置的項目

“index”首頁設置的屬性如下圖所示：

秦皇島職業(yè)技術學院信息工程系

2.2.2 查看和編輯頭內(nèi)容

一個網(wǎng)頁文件結(jié)構(gòu)上實際是由兩部分組成，頭（head）內(nèi)容和主體（body）內(nèi)容主體內(nèi)容（body）是文檔的主要部分，也是包含文本和圖像等的可見部分。頭內(nèi)容（head）是除文檔標題外的不可見部分，包含有文文件類型、語言編碼、搜索引擎的關鍵的關鍵詞和內(nèi)容指示器以及樣式定義等重要信息，這些元器并不是每個頁面都需要的，例如，可以僅為主頁提供關鍵詞。2.2.3 插入圖像

圖像是網(wǎng)頁中不可或缺的組成成份，恰當?shù)厥褂脠D像，可以使網(wǎng)站充滿生活生命力與說服力，吸引更多的瀏覽者，加深他們欣賞你網(wǎng)站的意愿。首先將游標停留在要插入圖像的位置，然后單擊“菜單欄”下面“插入快健欄”的下拉表，選擇其中的“常用”類，則右側(cè)將會顯示該類中可以插入的對象快鍵按鈕。左起第5個即為“圖像：圖像”按鈕，單擊它右側(cè)的下拉列表，選擇第1項“圖像”。隨即彈出“選擇圖像源文件”對話框。從計算機磁盤中選擇想要插入的圖像文件，下面的“相對于”下拉表框中，可選擇文件URL地址的類型，插入logo圖像，如圖所示:

秦皇島職業(yè)技術學院信息工程系

最后單擊“確定”按鈕，即可完成插入圖像的操作。2.2.4 插入FLASH相冊

在Dreamweaver 8中，除了之前講到的可以插入“圖像”外，還可插入動畫、聲音、視頻，F(xiàn)LASH相冊等媒體元素，并且還可以在Dreamweaver自身內(nèi)插入Macromedia Flash MX2004按鈕和文本對象，以及進行相關的后期處理和添加設計備注等操作。在Dreamweaver 8文文件中，可以插入媒體文件包Flash 相冊、QuickTime、AVI java、applet Active X控件以及各種格式的音頻檔。要在瀏覽器中播放放Flash 相冊，必須在瀏覽器中集成“Flash 播放器（Flash Player）”。操場作步驟：

步驟1、將游標停留在要插入Flash的位置，然后單擊菜單欄下面“插入”的下拉列表，選擇其中的“FLASH”分類，找到圖像查看器命令，單擊彈出保存對話框，選擇要保存的地方和名稱，點擊保存。

步驟

2、在Dreamweaver中將會產(chǎn)生一個flash相冊，在Dreamweaver中的最右邊將會有一個flash元素，一次將flash的屬性修改，既可完成一個flash相冊的制作。2.2.5 插入文本

文字是人類語言最基本的表達方式，在網(wǎng)頁中，文本內(nèi)容也可以說是重要的組成部分，它是最關鍵的因素。插入文本的兩種方式：一種是在網(wǎng)頁編輯窗口中直接用鍵盤敲入文本。另一種是復制文本的方式。直接使用Dreamweaver的文本復制功能，將大段的文本內(nèi)容拷貝到網(wǎng)頁的編輯窗口來進行排版的工作，10

秦皇島職業(yè)技術學院信息工程系

具體步驟如下：打開文本編輯軟件（如Microsoft Word），選中要復制的文本，它們將反白顯示，執(zhí)行菜單“編輯/復制”命令或直接用快捷鍵Ctrl+C，之后切換回Dreamweaver,將游標停留在插入文本的位置，執(zhí)行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl+v,即可將大段的文本快速粘貼到網(wǎng)頁中。這在我的“閑情逸致”中用到很多。2.3 創(chuàng)建其它網(wǎng)頁

還有其它的幾個網(wǎng)站與主頁的制作相同，一個網(wǎng)頁是圖像和文字的組合?！跋鄡浴弊禹撝械腇LASH相冊的插入和前面的介紹相同。

秦皇島職業(yè)技術學院信息工程系

第三章 建立網(wǎng)頁鏈接

網(wǎng)站實際上是由很多網(wǎng)頁組成的，那么網(wǎng)頁之間是如何聯(lián)系的呢？這就是本章要講的內(nèi)容----網(wǎng)頁的“鏈接”?！版溄印保址Q“超鏈接"（Hyperlink）,它作為網(wǎng)頁的橋梁。網(wǎng)頁中的很多對象都可以加入“鏈接”屬性。在Dreamweaver 8中，如果以“鏈接”的媒介來劃分的話，則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內(nèi)部鏈接和外部鏈接”、“E-mail鏈接”、“命名錨記鏈接”、“文件下載鏈接”和“跳轉(zhuǎn)菜單”，共8種。3.1 文字鏈接

“文字鏈接”即以文字作為媒介的鏈接，它是網(wǎng)頁中最常被使用的鏈接方式，具有“文件小、制作簡單和便于維護”的特點。接下來結(jié)合我的個人網(wǎng)站為實例，來講解如何為文字建立“鏈接”。操作步驟：

步驟1、準備好已經(jīng)制作完成的首頁的各個欄目頁面

步驟

2、在Dreamweaver 中打開首頁，之后反白選取作為“鏈接”的文字。步驟

3、觀察“屬性面板”，其中包括一個“鏈接”文本框。步驟

4、接下來需要把鏈接的位址加入到文本框中。

步驟

5、在“鏈接”文本框下面還有一個“目標”下拉列表，從中可以選擇鏈接網(wǎng)頁顯示的窗口方式，共有4種。如圖：

步驟

6、還可以設置一些“鏈接”的屬性，單擊“屬性面板”中的“頁面 12

秦皇島職業(yè)技術學院信息工程系

屬性”，選擇其中的“鏈接”分類，可以進行的設置有“鏈接字體”、“大小”、“鏈接顏色”、“變換圖像鏈接”顏色、“已訪問鏈接”顏色、“活動鏈接”顏色及“下劃線樣式”。

步驟

7、至此，第1個欄目的鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁，再按下F12預覽，測試一下，當鼠標放在“放松心情”這4個文字上時將變成手形，并且瀏覽器窗口下面的狀態(tài)區(qū)中會顯示鏈接到的網(wǎng)頁的位址，單擊文字，頁面會立即跳轉(zhuǎn)到第1個欄目中，這表示鏈接已經(jīng)制作成功了。

步驟

8、同理，按照以上步驟，再為“閑情逸致”和“個人主頁”等其它欄制作指向?qū)獧谀康逆溄印?/p>

至此，整個“文字鏈接”的實例就全就全部完成了。3.2 圖像鏈接

“圖像”也是常被使用的鏈接媒體，它和“文字鏈接”非常相似。為圖像加入鏈接，首先應該在網(wǎng)頁中插入“圖像”，有關插入“圖像”或“導航條”按鈕的內(nèi)容，接下來以我的網(wǎng)站“my web“為例，講解如何建立“圖像鏈接”。操作步驟：

步驟

1、首先仍然要準備好已經(jīng)制作完成的首頁和各個欄目的頁面 步驟

2、在Dreamweaver中打開網(wǎng)站的首頁，之后選取要制作“鏈接”的圖像。

步驟

3、觀察“屬性面板”，在“鏈接”文本框中輸入鏈接的文字位址。步驟

4、如果有需要，可以在“目標”下拉列表中選擇“鏈接”網(wǎng)頁顯示 13

秦皇島職業(yè)技術學院信息工程系 的窗口方式，分別為-blank、-parent、-self或-top。

步驟

5、至此，第1個欄目的圖像鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁，再按下F12預覽，測試一下，將鼠標放在“動畫制作”4個文字上時將變成手形，同時瀏覽器窗口下面的狀態(tài)區(qū)中會顯示出鏈接到的網(wǎng)頁的地址，并且會顯示出“替代”文本“動畫制作”，單擊文字，頁面會立即跳轉(zhuǎn)到第3個欄目中，這表示鏈接已經(jīng)制作成功了。

步驟

6、同理，按照以上步驟，再為其它幾幅圖像制作指向?qū)獧谀康逆溄印?/p>

步驟

7、在欄目頁面中制作“返回首頁”的鏈接，使得單擊后可以跳轉(zhuǎn)回首頁。

至此，整個“圖像鏈像”的實例就全部完成了。3.3在HTML語言中建立網(wǎng)頁鏈接

一、文字鏈接

在HTML語言中用超鏈接標記指向一個目標。其基本格式為：舉個簡單的“文本鏈接”的實例，該實例相對應的HTML代碼如下所示。

a href-“index2.html”target=”-blank”>平面設計（新開窗口，-blank)

相冊（原窗口，默認為空）

留言