企業(yè)與個(gè)人網(wǎng)絡(luò )營(yíng)銷(xiāo)一站式服務(wù)商
網(wǎng)站建設 / SEO優(yōu)化排名 / 小程序開(kāi)發(fā) / OA
0731-88571521
136-3748-2004
136-3748-2004
一、網(wǎng)站圖片優(yōu)化
圖片我想是每個(gè)網(wǎng)站必備的，不然審美觀(guān)上過(guò)不去;小圖標，背景圖，登錄框等等。當訪(fǎng)問(wèn)一張頁(yè)面時(shí)，每一張圖片都是一樣連結數，如果你的首頁(yè)有20張的小圖，那就是一個(gè)用戶(hù)訪(fǎng)問(wèn)時(shí)，要占有用20個(gè)連接數，2千人同時(shí)在線(xiàn)時(shí)，恐怖啊。
解決圖片問(wèn)題就是把所有的小圖集成到一個(gè)大圖里面，如下圖：
這樣就把可以20變?yōu)?一個(gè)連接數，除了降低連接數，可以加快網(wǎng)頁(yè)的加載圖片，這兒我建議您保存為png-8格式化，因為它同比gif，jpg，png-32要更小，更小就意味著(zhù)你加載頁(yè)面的速度快，用戶(hù)可以更快的看到你網(wǎng)站的內容，一石兩鳥(niǎo)。
學(xué)一下如何調用這些圖片：
比如要調用會(huì )員登錄這個(gè)圖標
頁(yè)面上：
|
<a class="login" heft="#"> 會(huì )員登錄</a> |
CSS上：
| .login{background:url（"圖片.png"） 0 -100px no-repeat; height:30px; width:50px;}<!— 0 -100px；指圖片所在的位置。Height和width是圖標長(cháng)寬看圖標大小而定--> |
.login{background:url("圖片.png") 0 -100px no-repeat; height:30px; width:50px;}
這樣就完成了對圖標的調用，是不是很簡(jiǎn)單啊，趕快學(xué)一下吧。
二、網(wǎng)站的CSS優(yōu)化
在CSS優(yōu)化了，除了降低css大小，像marin，padding，font等一些常用的縮寫(xiě)外面。像上面所有說(shuō)的backgroud這個(gè)也是可以簡(jiǎn)寫(xiě)的。如下;
頁(yè)面上：
| <p><a class=”login” heft=“#”> 會(huì )員登錄</a><a class=”reg” heft=“#”> 會(huì )員注冊</a><a class=”sell” heft=“#”> 我要賣(mài)車(chē)</a><a class=”buy” heft=“#”> 我要買(mǎi)車(chē)</a></p> |
CSS上：
|
.login{background: url("../images/圖片.png") 0 -100px no-repeat; height:30px; width:50px;}
.reg{background: url("../images/圖片.png") 0 -100px no-repeat; height:30px; width:50px;}
.sell{background: url("../images/圖片.png") 0 -100px no-repeat; height:30px; width:50px;}
.buy{background: url("../images/圖片.png") 0 -100px no-repeat; height:30px; width:50px;} |
改進(jìn)后
|
.Login,.reg,.sell,.buy{background: url("圖片.png") no-repeat; }<1 .Login{background-position: 0 -100px;} .reg{background-position: 0 -100px;} .sell{background-position: 0 -100px;} .buy{background-position: 0 -100px;} |
這是css的簡(jiǎn)寫(xiě)上，可以減少CSS文件大小。
為了降低CSS連接數，會(huì )把CSS代碼直接寫(xiě)在首頁(yè)的《style》***《/style》，這種情況適合像百度，163，淘寶這種重量級的。
常用的寫(xiě)法是
|
<link href="css/index.css" rel="stylesheet" type="text/css" /> … <link href="css/top.css" rel="stylesheet" type="text/css"/> |
我們可以把共用的頭部樣式寫(xiě)到一個(gè)common.css里面，然后在首頁(yè)里的index.css里面
| @import url（"common.css"）; |
注意：不要在@import url("common.css");又導入@import url("common1.css");這樣在效果上適得其反。
因為在加載首頁(yè)就會(huì )把common.css保存下，當第二次用戶(hù)訪(fǎng)問(wèn)就直接調用本地的緩存，從而加快速度。
三、網(wǎng)站的JS優(yōu)化
為了便于管理，很多人在寫(xiě)JS時(shí)，只要是廣告就會(huì )用JS來(lái)代替，代碼如下;
文字連接的JS調用：
| <script language="javascript">document.write（"<a href='#' target='_blank'>會(huì )員廣告鏈接</a>"）;</script> |
圖片鏈接的文字調用：
| <script language="javascript">document.write（"<a href='#' target='_blank'><img src='abc.jpg‘ /></a>"）;</script> |
因為JS會(huì )把本來(lái)1行的代碼變成了三，四行，增加了一些不必要的代碼，還增加了下載請求。
總結：這是針對短期內來(lái)的高流量，等高流量穩定長(cháng)漲后，收入增加了，可以買(mǎi)臺服務(wù)器把CSS，JS，圖片這些大量文件放到新的服務(wù)器。這是種方法能起到治本的效果。
以上只是我一些經(jīng)驗，希望能為廣大站長(cháng)提供幫助，寫(xiě)的并不好，希望大家理解。
湘公網(wǎng)安備 43010302000270號 統一社會(huì )信用代碼：92430103MA4LAMB24R 網(wǎng)站ICP備案號：湘ICP備13006070號-2 
