做網(wǎng)頁(yè)

一、制作網(wǎng)站前的準(zhǔn)備

可以使用一種漢字輸入方法，快慢不拘。

會(huì)用IE點(diǎn)擊上網(wǎng)并瀏覽網(wǎng)頁(yè)

知道一些最最基本的術(shù)語(yǔ)，例如說(shuō)超級(jí)鏈接你知道點(diǎn)一下就能到別的網(wǎng)頁(yè)去，這個(gè)相信你也會(huì)吧。

你會(huì)使用office 軟件——沒(méi)聽說(shuō)過(guò)？WORD知道吧？就是你打字的東東。你肯定打過(guò)什么文稿之類的東東吧，那就得用到WORD，要不WPS也行，反正一定得會(huì)使用這樣的軟件，不然你就沒(méi)辦法實(shí)現(xiàn)制作網(wǎng)頁(yè)的那些功能。

OK，假設(shè)你上面這些東東你全都會(huì)的話，那就可以制作網(wǎng)頁(yè)啦。

二、制作網(wǎng)頁(yè)前必須了解的東東

為了使我們這個(gè)教材真正實(shí)現(xiàn)誰(shuí)都學(xué)得會(huì)，誰(shuí)都看得懂，我決定不在這個(gè)教材里說(shuō)任何專業(yè)的東東，我們是想做網(wǎng)頁(yè)而不是想當(dāng)網(wǎng)絡(luò)管理員，更不需要為考什么等級(jí)而努力。所以我將這教材定位在最最簡(jiǎn)單明了的基礎(chǔ)上，有些地方寫得恐怕你看了也會(huì)說(shuō)一聲“弱智”，不過(guò)請(qǐng)相信，網(wǎng)上一定還有比你還弱智的朋友等著這些提示呢。呵呵，那么，開始制作啦！

首先，我們需要有必要的軟件來(lái)制作網(wǎng)頁(yè)。我推薦你使用 Frontpage2003（沒(méi)聽說(shuō)過(guò)嗎？那我給你解釋一下，你去街角的賣盜版盤的老板那問(wèn)問(wèn)，有FRONTPAGE2000全版的沒(méi)有？老扳就會(huì)熱心的給你一套OFFCE2003，說(shuō)這就是了，然后要你買下），這個(gè)軟件同 WORD，EXCEL之類軟件一樣，是OFFICE系列的一員，安裝OFFICE的時(shí)候?qū)⑺惭b上，你就能做網(wǎng)頁(yè)啦，別擔(dān)心你不會(huì)用，我會(huì)手把手教你做的。如果你不會(huì)裝OFFICE，那就請(qǐng)你哪位哥哥幫你個(gè)小忙，請(qǐng)他為你裝上，其實(shí)一點(diǎn)也不難裝。

好，假設(shè)你安裝好了FRONTPAGE2003（FRONTPAGE2000也可，不過(guò)使用起來(lái)沒(méi)有FRONTPAGE2003順手），我就是用的FRONTPAGE2003，所以教材上也以此為準(zhǔn)。

喂，你先別得意，有了這個(gè)FRONTPAGE2003是可以做網(wǎng)頁(yè)，不過(guò)還得有其它一大堆軟件你才能做得和我的馨香小憩站一樣呢，你要學(xué)的東東多著呢，千萬(wàn)別得意哦。

三、正式開始啦

好，打開FRONTPAGE2003，第一次進(jìn)入左邊會(huì)有個(gè)煩人的什么視圖窗，這東東用不著，關(guān)掉它！怎么關(guān)？記好了，方法如下：

點(diǎn)擊上面那菜單條——選查看——在菜單上那個(gè)標(biāo)有“視圖欄”的小勾上點(diǎn)一下，呵呵！會(huì)了吧，為了簡(jiǎn)明起見，這個(gè)操作我將寫為 菜單——查看——視圖欄 記住了嗎？這樣你看著省心我打著省事，皆大歡喜 :-)

現(xiàn)在出現(xiàn)在我們面前的是一個(gè)空白的頁(yè)面。

1、給這個(gè)網(wǎng)面起個(gè)名字，怎么起？請(qǐng)看方法：

菜單——文件——另存為……——（選擇你想保存的文件名、網(wǎng)頁(yè)標(biāo)題、保存位置）

對(duì)了，你一定看到另存為的時(shí)候有個(gè)什么網(wǎng)頁(yè)標(biāo)題的更改按鈕了吧，

點(diǎn)一下你就可以改成你喜歡的網(wǎng)頁(yè)標(biāo)題了，例如說(shuō)“歡迎來(lái)到我的主頁(yè)”之類。記好，一定要選保存。建議你保存的文件名為 index ，因?yàn)檫@個(gè)名字的頁(yè)面是網(wǎng)站必須有的第一頁(yè)，網(wǎng)站必須有這一頁(yè)。對(duì)了，另存為的對(duì)話框最上面還有個(gè)“保存位置”，你可以選好你想保存的網(wǎng)頁(yè)路徑，一般保存在“我的文檔”里。你可以自己建個(gè)新文件夾用來(lái)存放你的主頁(yè)。

現(xiàn)在我們的網(wǎng)頁(yè)文件己經(jīng)出來(lái)了，名字叫“index.htm” 頁(yè)面標(biāo)題是“歡迎來(lái)到我的主頁(yè)”，你可以試著用IE打開這個(gè)網(wǎng)頁(yè)文件，在瀏覽器最上最左邊的藍(lán)色條上能看到這句話。你又會(huì)說(shuō)了，空空的嘛，一個(gè)網(wǎng)頁(yè)是出來(lái)了，上面上個(gè)字也沒(méi)有！別急，咱這就往里加字！

你直接輸入“歡迎來(lái)到我的主頁(yè)！”這句話。就會(huì)看到在網(wǎng)頁(yè)的左上邊出現(xiàn)了這句話，和打字一樣，對(duì)了，就和打字一樣，這么簡(jiǎn)單！點(diǎn)一下左上角那個(gè)小小的磁盤保存這個(gè)文件吧，或者用 Ctrl + S保存。

然后用瀏覽器IE打開這個(gè)文件，你就會(huì)看到你剛打的字了！其實(shí)FRONTPAGE2003頁(yè)面下有三個(gè)標(biāo)簽，分別是“普通”、“HTML”、“預(yù)覽”，用“預(yù)覽”一樣能看到。不過(guò)我自己覺得不如另外用瀏覽器打開來(lái)得實(shí)在，呵呵，個(gè)人習(xí)慣，你盡可以用預(yù)覽這個(gè)標(biāo)簽來(lái)看。

2、改變字體的大小和顏色

你可以用鼠標(biāo)在你想改變顏色的字上拖動(dòng)，使之成為反色字，就算選中啦。我想你如果會(huì)復(fù)制粘貼就該會(huì)這個(gè)吧。選好后在上面工具欄上找到“格式”工具，——沒(méi)有？那就用這個(gè)方法把它調(diào)出來(lái)！菜單——查看——工具欄——格式 ，出來(lái)了吧！

和WORD一樣，格式的操作很簡(jiǎn)單，一看就會(huì)。請(qǐng)注意，字體請(qǐng)不要設(shè)置得太怪，一般采用默認(rèn)字體或宋體。

選擇字體的大小可以從1號(hào)至7號(hào)不等。1號(hào)最小，7號(hào)最大。字符顏色選擇請(qǐng)看看那個(gè)標(biāo)有“A”字的小按鈕，點(diǎn)一下它旁邊的向下箭頭。會(huì)出現(xiàn)好多顏色，你選一下就成了。這時(shí)你會(huì)發(fā)現(xiàn)選中的字大小和顏色變了，其實(shí)這些操作和WORD是一樣的，你應(yīng)當(dāng)一看就會(huì)。

其它諸如縮進(jìn)、排列序號(hào)、段落間距之類都和OFFICE一樣，我就不多說(shuō)了，不會(huì)的話可以看看有關(guān)WORD的書或自己琢磨一下，挨個(gè)試一試，這些很容易就學(xué)會(huì)的。

3、表格

表格是網(wǎng)頁(yè)中很重要的一節(jié)，在網(wǎng)頁(yè)中為實(shí)現(xiàn)好看的效果，必須使用表格，表格不難畫，只需點(diǎn)中那個(gè)工具欄上的小小鉛筆的按鈕就能畫了。如果你的頁(yè)面上沒(méi)有表格工具，請(qǐng)使用 菜單——查看——工具欄——表格 來(lái)打開它。

表格無(wú)非就是這么橫幾道豎幾道的框框，每一個(gè)格子叫單元格，這個(gè)很重要哦，你可以通過(guò)選中單元格按鼠標(biāo)右鍵來(lái)選擇

相應(yīng)的菜單。單元格有單元格的屬性，表格有表格的屬性，網(wǎng)頁(yè)也有網(wǎng)頁(yè)的屬性，這一切都在右擊鼠標(biāo)鍵上。呵呵，學(xué)會(huì)這些做網(wǎng)頁(yè)就不愁啦。

通過(guò)拉動(dòng)表格的邊線可以改變大小，也可以通過(guò)右擊鼠標(biāo)選表格大小里直接輸入數(shù)值來(lái)指定大小，后者更精確一些。一般來(lái)說(shuō)表格寬度不應(yīng)超過(guò)790，因?yàn)榫W(wǎng)頁(yè)的大小定位在800*600格式下，超過(guò)了就會(huì)在網(wǎng)頁(yè)下面出現(xiàn)拉動(dòng)條，有點(diǎn)不好看，所以我用表格一般讓它寬度為790，當(dāng)然這要根據(jù)你想實(shí)現(xiàn)的網(wǎng)頁(yè)效果來(lái)做。

4、單元格

一般網(wǎng)頁(yè)都是由幾個(gè)表格組成的，表格里的單元格里分別放著相應(yīng)的圖片，文字和插件。所以單元格是網(wǎng)頁(yè)是最小的單位，每個(gè)單元格都有它的屬性，一般來(lái)說(shuō)，我們可以用這些屬性來(lái)做一些想做到的事。比方說(shuō)邊框的顏色、單元格內(nèi)容對(duì)齊方式，可以選擇水平和垂直屬性。這些能很方便的給實(shí)現(xiàn)單元格內(nèi)部的排版，再有就是單元格的顏色、行跨距什么的，一看就會(huì)，我想你能明白。設(shè)定這些屬性的目的就在于改變各個(gè)單元格的樣式，有了這些，單元格之間就能組成好看的頁(yè)面了，多練練這方面的東東。

5、網(wǎng)頁(yè)屬性

網(wǎng)頁(yè)的屬性有許多，你可以點(diǎn)擊右鍵選取擇網(wǎng)頁(yè)屬性進(jìn)入。和我們初學(xué)者有關(guān)的就是背景啦，選擇背景標(biāo)簽?zāi)憔蜁?huì)看到相應(yīng)內(nèi)容，分別是格式和顏色兩個(gè)內(nèi)容。里面有個(gè)背景圖片按鈕，你可以從中點(diǎn)瀏覽打一張你喜歡的圖片做背景，比方說(shuō)馨香小憩站的背景就是一張有泡泡的墻紙的樣子。它可以很方便的做到漂亮的頁(yè)面了。還有一個(gè)格式屬性，通過(guò)這個(gè)屬性你可以改變鏈接的樣式，比方說(shuō)文字默認(rèn)顏色啦，背景默認(rèn)顏色及其它一些選取項(xiàng)，你都可以試試，一看就會(huì)的。

6、插入圖片

網(wǎng)頁(yè)上沒(méi)圖片那就稱不上是網(wǎng)頁(yè)了，好看的網(wǎng)頁(yè)當(dāng)然要有圖片陪襯，不過(guò)為了能找到圖片，建議你在你的網(wǎng)頁(yè)文件路徑下設(shè)一個(gè)名為“image"的文件夾，把你這網(wǎng)頁(yè)的圖片放里面去，這樣你就可以輕松的管理圖片而不至于以后發(fā)生上傳后網(wǎng)頁(yè)上找不到圖片的現(xiàn)象了。

插入圖片操作很簡(jiǎn)單，通過(guò)下面這個(gè)方式就能做到了。 菜單欄——插入——圖片——來(lái)自文件——選擇想插入的圖片。

你最好將想插入的圖片放到 image 文件夾里，然后再插入，這樣網(wǎng)頁(yè)上所有的圖片都包含在 image文件夾里了。方便也很實(shí)用。插入后可以選擇一些圖片屬性讓它更符合你的頁(yè)面，比方說(shuō)圖片大小啦，圖片顏色優(yōu)化什么的，這些都可以在圖片上通過(guò)右擊鼠標(biāo)選圖片屬性來(lái)修改。

說(shuō)了半天你應(yīng)該明白個(gè)道理，想修改什么就可以選中它然后按右鍵選相應(yīng)的菜單，這很方便嘛，你學(xué)會(huì)這個(gè)就己

經(jīng)學(xué)會(huì)做網(wǎng)頁(yè)的一半了！

7、超級(jí)鏈接

網(wǎng)頁(yè)上沒(méi)超級(jí)鏈接那不成其為網(wǎng)頁(yè)，你想讓你的小站也擁有超級(jí)鏈接嗎？哈哈，很EASY！這樣來(lái)實(shí)現(xiàn)它！

選中你想使之成為超級(jí)鏈接的文本，比方說(shuō)是“進(jìn)入”兩個(gè)字，選取中后仍是按鼠標(biāo)右鍵，選彈出菜單上那個(gè)“超級(jí)鏈接……”就會(huì)出現(xiàn)一個(gè)對(duì)話框讓你來(lái)設(shè)定超級(jí)鏈接。你不會(huì)呀？簡(jiǎn)單極了！就是在 URL 里輸入網(wǎng)址就行了。呵呵，比方說(shuō)你輸入我的小站的地址：“http://tesoftware.126.com”保存一下網(wǎng)頁(yè)。然后選預(yù)覽或用IE打開這個(gè)網(wǎng)頁(yè)文件，你會(huì)發(fā)現(xiàn)點(diǎn)擊“進(jìn)入”兩個(gè)字就會(huì)進(jìn)入到我的小站了，當(dāng)然，你把超級(jí)鏈接改成別的網(wǎng)址點(diǎn)擊它自然是到那個(gè)網(wǎng)址了。

記著，可以設(shè)定超級(jí)鏈接點(diǎn)擊后是在新窗口打開還是在原窗口打開，這你只要在目標(biāo)框架里選一下就成了。一般是設(shè)為網(wǎng)頁(yè)默認(rèn)值，你可以改變它使之成為新建窗口。

四、設(shè)計(jì)你自己的主頁(yè)

以上提到的一些功能的使用你會(huì)了沒(méi)？用這些功能就能做出相當(dāng)漂亮的主頁(yè)了！不信？好，你看看馨香小憩的一些頁(yè)面不就是由這幾個(gè)東東組成的嗎？現(xiàn)在你就可以自己來(lái)設(shè)計(jì)一個(gè)主頁(yè)了，相信你會(huì)做得比我好看的。

哦，忘了提一些東東了。有些東西你必須注意

1、圖片不可太大，因?yàn)榫W(wǎng)絡(luò)不快，圖片一般在10K以下還能承受，超過(guò)10K就會(huì)影響瀏覽速度了，一般頁(yè)面里可以有個(gè)總量為30K的圖片，這是極限了，再多網(wǎng)頁(yè)會(huì)半天也打不開的。

2、注意配色。網(wǎng)頁(yè)好看是在于一個(gè)整體，而配色是很關(guān)鍵的，訪問(wèn)者一眼看到網(wǎng)頁(yè)的整體布局就會(huì)以它的配色產(chǎn)生一個(gè)總體感覺，如果配色不好，訪問(wèn)者就不會(huì)有什么好印象了。關(guān)于配色方面是見仁見智的事，你可以注意一些雜志、畫報(bào)之類刊物上的配色，學(xué)學(xué)別人的經(jīng)驗(yàn)。

3、總體布局。網(wǎng)頁(yè)布局要和協(xié)，不要看起來(lái)顯著頭重腳輕或虎頭蛇尾，學(xué)學(xué)報(bào)紙上的布局對(duì)你會(huì)大有幫助！

4、鏈接注意事項(xiàng)。一般你的網(wǎng)站不會(huì)只有一個(gè)頁(yè)面，你如果想使頁(yè)面可以用鏈接連起來(lái)。只需在超級(jí)鏈接里輸入文件名就行了。比方說(shuō)你的首頁(yè)文件名是 index.htm，次頁(yè)文件是 text.htm 那么只需在 URL里輸入 "text.htm"即可，記著 “http://”是網(wǎng)上才用的東東，你在本地編輯是用不著的，當(dāng)主頁(yè)上傳到網(wǎng)上時(shí)，它自動(dòng)會(huì)變成 "http://你的主頁(yè)地址"加上"text.htm"了，這不用你擔(dān)心，你只需填入你當(dāng)前目錄和當(dāng)前目錄的子目錄的路徑就行了。圖片鏈接可以填入 "image\xx.gif"之類。

5、關(guān)于圖片。可以在很多地方得到好看的圖片，不過(guò)為了使你的主頁(yè)更好看，還是有必要自己畫一些圖片的。比方說(shuō)標(biāo)志啦，美術(shù)字什么的，它會(huì)使你的

主頁(yè)更加?jì)趁膭?dòng)人。

入門可先用Frontpage2003，當(dāng)了解了基礎(chǔ)之后，再學(xué)習(xí)以dreamweaver為主的網(wǎng)頁(yè)制作三劍客，包括圖片處理和FLASH制作。如果想更專業(yè)一些，就要學(xué)習(xí)編程，但剛開始可學(xué)借用他人的程序作為模版，同時(shí)兼學(xué)程序設(shè)計(jì)原理，二者缺一不可。學(xué)網(wǎng)頁(yè)關(guān)鍵在于有興趣、有恒心、有方法，則用不了一年，你一定可以學(xué)會(huì)做網(wǎng)頁(yè)，可能談不上高手，但肯定不會(huì)被人叫做菜鳥。

其他的如網(wǎng)頁(yè)素材、gif動(dòng)畫圖片庫(kù)、網(wǎng)頁(yè)模板、、網(wǎng)頁(yè)特效、midi背景音樂(lè)、網(wǎng)頁(yè)制作軟件、字體下載、免費(fèi)搜索代碼等可參照參考資料