六、網(wǎng)頁(yè)的優(yōu)化
在網(wǎng)頁(yè)設(shè)計(jì)中,網(wǎng)頁(yè)的優(yōu)化是較為重要的一個(gè)環(huán)節(jié)。它的成功與否會(huì)影響頁(yè)面的瀏覽速度和頁(yè)面的適應(yīng)性,影響觀者對(duì)網(wǎng)站的印象。
在資訊類網(wǎng)站中,文字是頁(yè)面中的構(gòu)成元素,因此字體的優(yōu)化顯得尤為重要。使用css樣式表指定文字的樣式是必要的,通常我們將字體指定為微軟雅黑,大小指定為12px,顏色要視背景色而定,原則上以能看清且與整個(gè)頁(yè)面搭配和諧為準(zhǔn)。在白色的背景上,我們一般使用黑色,這樣不易產(chǎn)生視覺(jué)疲勞,能保證瀏覽者較長(zhǎng)時(shí)間地瀏覽網(wǎng)頁(yè)。
圖片是網(wǎng)頁(yè)中的重要元素。圖片的優(yōu)化可以在保證瀏覽質(zhì)量的前提下將其size降至最低,這樣可以成倍地提高網(wǎng)頁(yè)的下載速度。利用Photoshop6或Fireworks4可以將圖片切成小塊,分別進(jìn)行優(yōu)化。輸出的格式可以為gif或jpeg,要視具體情況而定。一般我們把有較為復(fù)雜顏色變化的小塊優(yōu)化為jpeg,而把那種只有單純色塊的卡通畫式的小塊優(yōu)化為gif,這是由這兩種格式的特點(diǎn)決定的。
表格(table)是頁(yè)面中的重要元素,是頁(yè)面排版的主要手段。我們可以設(shè)定表格的寬度、高度、邊框、背景色、對(duì)齊方式等參數(shù)。很多時(shí)候,我們將表格的邊框設(shè)為0,以此來(lái)定位頁(yè)面中的元素,或者籍此確定頁(yè)面中各元素的相對(duì)位置。我們知道:瀏覽器在讀取網(wǎng)頁(yè)html原代碼時(shí),是讀完整個(gè)table才將它顯示出來(lái)的。如果一個(gè)大表格中含有多個(gè)子表格,必須等大表格讀完,才能將子表格一起顯示出來(lái)。我們?cè)谠L問(wèn)一些站點(diǎn)時(shí),等待多時(shí)無(wú)結(jié)果,按"停止"按鈕卻一下顯示出頁(yè)面就是這個(gè)原因。因此,我們?cè)谠O(shè)計(jì)頁(yè)面表格的時(shí)候,應(yīng)該盡量避免將所有元素嵌套在一個(gè)表格里,而且表格嵌套層次盡量要少。在使用Dreamweaver制作網(wǎng)頁(yè)時(shí),會(huì)自動(dòng)在每一個(gè)td內(nèi)添加一個(gè)空字符“ ”。如果單元格內(nèi)沒(méi)有填充其它元素,這個(gè)空字符會(huì)保留,在指定td的寬度或高度后,可以在源代碼內(nèi)將其刪去。
網(wǎng)頁(yè)的適應(yīng)性是很重要的,在不同的系統(tǒng)上,不同的分辨率下,不同的瀏覽器上,我們將會(huì)看到不同的結(jié)果,因此設(shè)計(jì)時(shí)要統(tǒng)籌考慮。一般我們?cè)?00*600下制作網(wǎng)頁(yè),瀏覽效果也是在800*600分辨率下,在其它情況下只要保證基本一致,不出現(xiàn)較大問(wèn)題即可。
說(shuō)了這么多,只是希望能對(duì)做“網(wǎng)頁(yè)設(shè)計(jì)”的人有所幫助,希望他們?cè)谧鼍W(wǎng)頁(yè)的時(shí)候能夠從整體著眼,無(wú)愧于“設(shè)計(jì)”這兩個(gè)字。
★建設(shè)自己的網(wǎng)站較好的步驟☆
必須注意的是:建立自己的網(wǎng)站是一件浩大的工程,一般比較麻煩。所以應(yīng)當(dāng)按照一定的步驟一步步來(lái)。
我覺(jué)得建站可以按照以下步驟進(jìn)行:
1、先在本地設(shè)一個(gè)文件夾,作為網(wǎng)站存儲(chǔ)的地方。名字取“My Sites”。
2、在網(wǎng)站文件夾里面建立一些文件夾,包括“images”等(存儲(chǔ)圖片、文件等),并且按照網(wǎng)頁(yè)內(nèi)容,再建立幾個(gè)文件夾。(也可以把存儲(chǔ)圖片、文件的文件夾在每個(gè)內(nèi)容文件夾里面各搞一些)
3、打開(kāi)你的網(wǎng)頁(yè)編輯程序(例如FP、Dreamwear等),新建網(wǎng)頁(yè),保存為“index”(主頁(yè)),重復(fù)以上步驟,在網(wǎng)站文件夾里面建立“search”(查找)、“map”(站點(diǎn)地圖)、“index02”(網(wǎng)站簡(jiǎn)介等)。
4、按照上面步驟,再在網(wǎng)站分類文件夾里面建立許多網(wǎng)頁(yè)(接著還要把內(nèi)容輸入網(wǎng)頁(yè))
5、已經(jīng)做到了這么多,我們?cè)摐?zhǔn)備內(nèi)容了吧。在硬盤上面再建立一個(gè)文件夾“File”,把準(zhǔn)備好的文檔、圖片、程式、文件和網(wǎng)頁(yè)特效等放進(jìn)去。(可以加入一些動(dòng)態(tài)網(wǎng)頁(yè))
6、慢慢把這些文件一個(gè)不漏的放進(jìn)網(wǎng)頁(yè)里面(要掌握技巧)
7、把網(wǎng)站充實(shí)了,就差不多了。這時(shí)應(yīng)該申請(qǐng)一個(gè)域名(免費(fèi)空間、附費(fèi)都可以)。并且把自己的網(wǎng)站放入搜索引擎,而且在各種留言版上面宣傳。
8、把網(wǎng)站上傳至空間里面,刪了準(zhǔn)備文件,就OK了!
不過(guò)也可以這樣使用FP建站:
1、在FP里面選擇新建站點(diǎn)。
2、然后在【導(dǎo)航】里面設(shè)置網(wǎng)頁(yè)名稱以及標(biāo)題。
3、準(zhǔn)備好文檔、圖片、程式、文件和網(wǎng)頁(yè)特效等,把它們都充實(shí)進(jìn)網(wǎng)站里面。
4、申請(qǐng)一個(gè)域名(免費(fèi)空間、附費(fèi)都可以)。并且把自己的網(wǎng)站放入搜索引擎,而且在各種留言版上面宣傳。
5、把網(wǎng)站上傳至空間里面,刪了準(zhǔn)備文件。完畢。
在網(wǎng)頁(yè)設(shè)計(jì)中,網(wǎng)頁(yè)的優(yōu)化是較為重要的一個(gè)環(huán)節(jié)。它的成功與否會(huì)影響頁(yè)面的瀏覽速度和頁(yè)面的適應(yīng)性,影響觀者對(duì)網(wǎng)站的印象。
在資訊類網(wǎng)站中,文字是頁(yè)面中的構(gòu)成元素,因此字體的優(yōu)化顯得尤為重要。使用css樣式表指定文字的樣式是必要的,通常我們將字體指定為微軟雅黑,大小指定為12px,顏色要視背景色而定,原則上以能看清且與整個(gè)頁(yè)面搭配和諧為準(zhǔn)。在白色的背景上,我們一般使用黑色,這樣不易產(chǎn)生視覺(jué)疲勞,能保證瀏覽者較長(zhǎng)時(shí)間地瀏覽網(wǎng)頁(yè)。
圖片是網(wǎng)頁(yè)中的重要元素。圖片的優(yōu)化可以在保證瀏覽質(zhì)量的前提下將其size降至最低,這樣可以成倍地提高網(wǎng)頁(yè)的下載速度。利用Photoshop6或Fireworks4可以將圖片切成小塊,分別進(jìn)行優(yōu)化。輸出的格式可以為gif或jpeg,要視具體情況而定。一般我們把有較為復(fù)雜顏色變化的小塊優(yōu)化為jpeg,而把那種只有單純色塊的卡通畫式的小塊優(yōu)化為gif,這是由這兩種格式的特點(diǎn)決定的。
表格(table)是頁(yè)面中的重要元素,是頁(yè)面排版的主要手段。我們可以設(shè)定表格的寬度、高度、邊框、背景色、對(duì)齊方式等參數(shù)。很多時(shí)候,我們將表格的邊框設(shè)為0,以此來(lái)定位頁(yè)面中的元素,或者籍此確定頁(yè)面中各元素的相對(duì)位置。我們知道:瀏覽器在讀取網(wǎng)頁(yè)html原代碼時(shí),是讀完整個(gè)table才將它顯示出來(lái)的。如果一個(gè)大表格中含有多個(gè)子表格,必須等大表格讀完,才能將子表格一起顯示出來(lái)。我們?cè)谠L問(wèn)一些站點(diǎn)時(shí),等待多時(shí)無(wú)結(jié)果,按"停止"按鈕卻一下顯示出頁(yè)面就是這個(gè)原因。因此,我們?cè)谠O(shè)計(jì)頁(yè)面表格的時(shí)候,應(yīng)該盡量避免將所有元素嵌套在一個(gè)表格里,而且表格嵌套層次盡量要少。在使用Dreamweaver制作網(wǎng)頁(yè)時(shí),會(huì)自動(dòng)在每一個(gè)td內(nèi)添加一個(gè)空字符“ ”。如果單元格內(nèi)沒(méi)有填充其它元素,這個(gè)空字符會(huì)保留,在指定td的寬度或高度后,可以在源代碼內(nèi)將其刪去。
網(wǎng)頁(yè)的適應(yīng)性是很重要的,在不同的系統(tǒng)上,不同的分辨率下,不同的瀏覽器上,我們將會(huì)看到不同的結(jié)果,因此設(shè)計(jì)時(shí)要統(tǒng)籌考慮。一般我們?cè)?00*600下制作網(wǎng)頁(yè),瀏覽效果也是在800*600分辨率下,在其它情況下只要保證基本一致,不出現(xiàn)較大問(wèn)題即可。
說(shuō)了這么多,只是希望能對(duì)做“網(wǎng)頁(yè)設(shè)計(jì)”的人有所幫助,希望他們?cè)谧鼍W(wǎng)頁(yè)的時(shí)候能夠從整體著眼,無(wú)愧于“設(shè)計(jì)”這兩個(gè)字。
★建設(shè)自己的網(wǎng)站較好的步驟☆
必須注意的是:建立自己的網(wǎng)站是一件浩大的工程,一般比較麻煩。所以應(yīng)當(dāng)按照一定的步驟一步步來(lái)。
我覺(jué)得建站可以按照以下步驟進(jìn)行:
1、先在本地設(shè)一個(gè)文件夾,作為網(wǎng)站存儲(chǔ)的地方。名字取“My Sites”。
2、在網(wǎng)站文件夾里面建立一些文件夾,包括“images”等(存儲(chǔ)圖片、文件等),并且按照網(wǎng)頁(yè)內(nèi)容,再建立幾個(gè)文件夾。(也可以把存儲(chǔ)圖片、文件的文件夾在每個(gè)內(nèi)容文件夾里面各搞一些)
3、打開(kāi)你的網(wǎng)頁(yè)編輯程序(例如FP、Dreamwear等),新建網(wǎng)頁(yè),保存為“index”(主頁(yè)),重復(fù)以上步驟,在網(wǎng)站文件夾里面建立“search”(查找)、“map”(站點(diǎn)地圖)、“index02”(網(wǎng)站簡(jiǎn)介等)。
4、按照上面步驟,再在網(wǎng)站分類文件夾里面建立許多網(wǎng)頁(yè)(接著還要把內(nèi)容輸入網(wǎng)頁(yè))
5、已經(jīng)做到了這么多,我們?cè)摐?zhǔn)備內(nèi)容了吧。在硬盤上面再建立一個(gè)文件夾“File”,把準(zhǔn)備好的文檔、圖片、程式、文件和網(wǎng)頁(yè)特效等放進(jìn)去。(可以加入一些動(dòng)態(tài)網(wǎng)頁(yè))
6、慢慢把這些文件一個(gè)不漏的放進(jìn)網(wǎng)頁(yè)里面(要掌握技巧)
7、把網(wǎng)站充實(shí)了,就差不多了。這時(shí)應(yīng)該申請(qǐng)一個(gè)域名(免費(fèi)空間、附費(fèi)都可以)。并且把自己的網(wǎng)站放入搜索引擎,而且在各種留言版上面宣傳。
8、把網(wǎng)站上傳至空間里面,刪了準(zhǔn)備文件,就OK了!
不過(guò)也可以這樣使用FP建站:
1、在FP里面選擇新建站點(diǎn)。
2、然后在【導(dǎo)航】里面設(shè)置網(wǎng)頁(yè)名稱以及標(biāo)題。
3、準(zhǔn)備好文檔、圖片、程式、文件和網(wǎng)頁(yè)特效等,把它們都充實(shí)進(jìn)網(wǎng)站里面。
4、申請(qǐng)一個(gè)域名(免費(fèi)空間、附費(fèi)都可以)。并且把自己的網(wǎng)站放入搜索引擎,而且在各種留言版上面宣傳。
5、把網(wǎng)站上傳至空間里面,刪了準(zhǔn)備文件。完畢。

