- 相關(guān)推薦
網(wǎng)頁設(shè)計(jì)的規(guī)則經(jīng)驗(yàn)談
隨著網(wǎng)頁設(shè)計(jì)技術(shù)的發(fā)展,豐富多彩的個(gè)人網(wǎng)頁越來越多地出現(xiàn)在網(wǎng)上,但是,網(wǎng)頁下載速度受到帶寬和通訊線路等因素的制約。網(wǎng)頁設(shè)計(jì)者應(yīng)該知道,客戶是用昂貴的通訊費(fèi)用在換取您的信息,除了網(wǎng)頁的內(nèi)容要受益于客戶外,對(duì)下載速度的考慮也應(yīng)該放在網(wǎng)頁設(shè)計(jì)規(guī)劃時(shí)的重要位置。如果您正在做網(wǎng)頁,那么下面的一些規(guī)則與技巧或許對(duì)您有所幫助。
方法/步驟
1
控制頁面的總規(guī)模
----要想把網(wǎng)頁做得精彩,內(nèi)容必定要豐富,但不要把所有的內(nèi)容都放在一個(gè)頁面上,應(yīng)控制頁面的總規(guī)模。首先統(tǒng)計(jì)頁面中的每個(gè)對(duì)象,如文字、圖像、ActiveX或Java代碼以及HTML文本的大小。用28.8Kbps的Modem粗略地估計(jì)一下,按每秒3KB的速度下載整頁所需的時(shí)間,如果整頁有5KB的HTML代碼和30KB的圖像,下載該頁大約需要12秒,這一般能滿足訪問者的要求。
2
分解大型表格
----盡可能避免用大型表格,因?yàn)闉g覽器必須等待整個(gè)表格的內(nèi)容全部到達(dá)客戶端,才能顯示這個(gè)表格的內(nèi)容,而文本或圖像則是一邊下載一邊顯示。如果頁面中必須使用表格,可將大表格分解成若干小表格,瀏覽器下載后面的表格時(shí),客戶可以閱讀已經(jīng)下載完的前一個(gè)表格。用客戶瀏覽信息的時(shí)間去代替等待下載的時(shí)間,這一技巧在任何時(shí)候都適用。
3
不用圖片來敘述內(nèi)容
----為了解決不同的語言平臺(tái)上不能正常顯示本國(guó)文字的問題(比如簡(jiǎn)體中文平臺(tái)不能顯示BIG5碼的文字信息),有些設(shè)計(jì)者將本國(guó)文字的敘述內(nèi)容用圖像文件來表示,而不用文本,這樣雖然解決了因內(nèi)碼不同導(dǎo)致的亂碼問題,但卻給頁面增加了負(fù)擔(dān),因?yàn)橥瑯拥奈淖謨?nèi)容,用文本存儲(chǔ)比圖片文件小得多。另外,一些文字性的圖像按鈕也盡量少用,如果必須要用,也應(yīng)包含Alt解釋文本,這樣即使客戶關(guān)閉了瀏覽器的圖像顯示功能,也可以明白按鈕的意思。
4
標(biāo)記圖像的大小
----在HTML代碼中,最好標(biāo)記出圖像的顯示高度和寬度,在下載頁面時(shí),瀏覽器會(huì)按這個(gè)高度和寬度留出圖像的位置,在圖像下載完畢之前及時(shí)地顯示其周圍的文字內(nèi)容。否則,讓瀏覽器按圖像本身的高度和寬度顯示,那么只能等待圖像全部下載完畢后,才顯示圖像及其周圍的其他文字信息,無疑造成客戶的等待。
5
重用圖像
----如果多次使用同一圖像文件,客戶端瀏覽器的C e對(duì)此有所幫助。瀏覽器將從它的Cache中找出先前下載的那個(gè)圖像文件并調(diào)入顯示,而無需再?gòu)腤eb站點(diǎn)上下載,即使它們不在同一頁面中,這樣調(diào)入圖像就不受帶寬的約束。因此各頁面的背景圖案可使用同一圖像文件,既統(tǒng)一了頁面的風(fēng)格,又可節(jié)省圖像下載的時(shí)間。如果您再次調(diào)入的圖像文件只有尺寸有點(diǎn)變化,那么使用圖像高度和寬度標(biāo)記(Tags)即可改變圖像的大小。
----順便談一下客戶端,從技術(shù)上講,增大瀏覽器的Cache,可提高瀏覽的速度,但是,事實(shí)并非如此。有時(shí),我們清除Cache中的內(nèi)容后下載的速度則快些。原因是每次下載頁面文本或圖像時(shí),瀏覽器總要到Cache中去搜索相應(yīng)的頁面或圖像,這樣Cache中的內(nèi)容越多,搜索的時(shí)間就越長(zhǎng),如果比下載更費(fèi)時(shí),那么這時(shí)應(yīng)該及時(shí)清除Cache中的內(nèi)容。
6
選擇合適的格式
----JPEG格式是網(wǎng)上非常流行的圖像格式,它對(duì)于大型圖像的壓縮率特別高,而GIF格式更適合小圖像和藝術(shù)線條一類的圖像。對(duì)于同樣內(nèi)容的4KB以下的圖像文件,GIF格式比JPEG格式效果更好,如果不信,您可比較一下兩種格式的小圖像文件的大小和質(zhì)量。
7
減少圖像的數(shù)目
----不要使用太多的圖像文件。圖像文件的數(shù)量和大小對(duì)頁面是很重要的,因?yàn)槊肯螺d一個(gè)圖像文件,瀏覽器都將向Web服務(wù)器請(qǐng)求一次連接,所以圖像文件越多意味著頁面下載的時(shí)間越長(zhǎng)。可以嘗試用一個(gè)圖像代替多個(gè)分散的小圖形(如多個(gè)按鈕),從而盡可能地減少圖像文件的數(shù)目。
8
對(duì)大型圖像的處理
----當(dāng)頁面必須有大型圖像時(shí),有兩種處理方案可供參考:其一,建立一個(gè)縮圖圖像文件置于主頁中,將它鏈接到原始的大型圖像;其二,先創(chuàng)建一個(gè)同原始圖像一樣大小的但降低了色彩和分辨率的圖像文件,使用低源標(biāo)記,讓該圖像文件首先下載。這種方法的優(yōu)點(diǎn)是使客戶不需下載大型圖像文件,就能快速地了解到圖像的大概內(nèi) 容。
9
使用JavaScript
----能用HTML和JavaScript完成的事情,最好不用JavaApplet和ActiveX來做。很少的JavaScript代碼就可在4.0以上版本的Internet Explorer和Navigator瀏覽器上做出驚人的效果來,它比同樣大小的Java/ActiveX或動(dòng)態(tài)GIF文件要節(jié)省更多的下載時(shí)間。
10
少用背景音樂
----雖然目前版本的HTML語言具有在網(wǎng)頁中加入背景音樂的功能,但奉勸諸位少用為妙,它會(huì)降低您的網(wǎng)頁下載到客戶端的速度,除非您正在創(chuàng)建一個(gè)有關(guān)音樂的網(wǎng)站,否則只會(huì)給人以華而不實(shí)的感覺。如果非要加入背景音樂,那么音樂文件最好使用MIDI格式,而不用WAV格式。
注意事項(xiàng)
總之,網(wǎng)頁設(shè)計(jì)者應(yīng)該對(duì)自己的頁面精雕細(xì)刻,盡可能減少每一個(gè)字節(jié),以提高網(wǎng)頁下載的速度,千萬不要用龐大的網(wǎng)頁去愚弄客戶的耐性。牢記魯迅先生的名言:浪費(fèi)別人的時(shí)間,無異于謀財(cái)害命。
【網(wǎng)頁設(shè)計(jì)的規(guī)則經(jīng)驗(yàn)談】相關(guān)文章:
網(wǎng)頁設(shè)計(jì)總結(jié)11-09
網(wǎng)頁設(shè)計(jì)報(bào)告07-31
普通網(wǎng)頁設(shè)計(jì)與淘寶網(wǎng)頁設(shè)計(jì)有什么不同?07-09
網(wǎng)頁設(shè)計(jì)求職信 個(gè)人求職網(wǎng)頁設(shè)計(jì)02-21
網(wǎng)頁制作教學(xué)設(shè)計(jì)02-25
網(wǎng)頁設(shè)計(jì)實(shí)習(xí)報(bào)告07-16
網(wǎng)頁設(shè)計(jì)實(shí)踐報(bào)告08-12