木桶原理很適用于
網(wǎng)站設(shè)計(jì),一個(gè)網(wǎng)站的好壞取決于網(wǎng)站服務(wù)器、網(wǎng)站程序、頁面設(shè)計(jì)、HTML代碼、網(wǎng)站內(nèi)容、維護(hù),這六大部分相當(dāng)于圍成一個(gè)木桶的六塊木板,決定網(wǎng)站性能的不是最長(zhǎng)的那塊木板,而是最短的那塊,因?yàn)?,如果網(wǎng)站服務(wù)器或?qū)拵нB通性不好,再好的網(wǎng)站放在那里也是打不開;而如果網(wǎng)站程序很糟糕,讓頁面執(zhí)行5秒以上才顯示頁面,這也讓用戶無法忍受 ;而網(wǎng)站頁面設(shè)計(jì)的不好或者網(wǎng)站無有價(jià)值的內(nèi)容,就算用戶看了你的網(wǎng)站,也會(huì)選擇立即離開; 而HTML代碼決定了網(wǎng)站最終傳遞給用戶的頁面瀏覽效果,如果做不好,則會(huì)前功盡棄。所以,創(chuàng)新互聯(lián)提醒大家不要讓HTML代碼成為網(wǎng)站設(shè)計(jì)中的短板。
影響HTML代碼的元素?zé)o外乎HTML、CSS、JS,所以需要從這三方面著手,只要這些都做好了,頁面代碼就會(huì)成為網(wǎng)站設(shè)計(jì)中的長(zhǎng)板。做好這些需要注意以下幾點(diǎn):注意頁面代碼的執(zhí)行順序
HTML頁面是從上到下執(zhí)行的,注意到這一點(diǎn),讓網(wǎng)站主要的內(nèi)容優(yōu)先顯示出來,而其他的廣告、流量統(tǒng)計(jì)代碼等則放在最后。網(wǎng)站整體布局
很多人,尤其是初學(xué)者大量使用Table標(biāo)簽,原因可能是對(duì)其他標(biāo)簽不熟悉或使用其他標(biāo)簽不能做到很好的瀏覽器兼容性,可是,有沒有發(fā)覺,一個(gè)Table所使用的代碼不但比較多、加載比較慢、不易控制而且修改維護(hù)難,所以盡量使用DIV來構(gòu)架整體布局。HTML標(biāo)簽的選用
標(biāo)簽是HTML的基本元素,創(chuàng)新互聯(lián)呼吁用最適合的標(biāo)簽表達(dá)相應(yīng)的內(nèi)容,如網(wǎng)站的名稱用H1標(biāo)簽,列表用UL或OL標(biāo)簽等, 很多人對(duì)DIV+CSS布局存在誤解,認(rèn)為DIV+CSS布局的網(wǎng)站不能用Table,其實(shí)上面所說的是整體布局,如果內(nèi)容是表格,當(dāng)然用Table比較好。樣式都應(yīng)放在單獨(dú)的CSS文件里
當(dāng)HTML代碼和樣式都混在一起的時(shí)候,對(duì)網(wǎng)站的修改維護(hù)會(huì)帶來非常大的麻煩,而把樣式放在單獨(dú)的CSS文件里調(diào)用,可以提高樣式的重用性、讓HTML代碼非常清晰有條理,而且CSS文件是有緩存的,打開第二個(gè)頁面就不用重新下載,可以提高頁面打開速度。
Javascript代碼應(yīng)盡量放在頁面底部
同CSS文件一樣,JS文件也好放在單獨(dú)的文件里調(diào)用。因?yàn)镠TML頁面是順序解析,中間加載JS代碼,會(huì)導(dǎo)致頁面加載的速度變慢,如果沒有必要,好把JS代碼放在頁面底部,尤其是流量統(tǒng)計(jì)代碼、在線客服代碼、分享代碼等。盡量合并CSS和JS文件
頁面引用一個(gè)CSS文件或JS文件需要建立一個(gè)請(qǐng)求,而請(qǐng)求越多,頁面加載越慢,所以,盡量減少頁面請(qǐng)求數(shù)量,合并頁面的CSS文件和JS文件可以加快頁面加載速度。壓縮CSS和JS文件
網(wǎng)上有很多相應(yīng)的CSS文件和JS文件壓縮工具,主要是去掉其中的空格和換行,可以減少文件的大小,從而減少寬帶流量,加快頁面顯示。圖片大小聲明
如果圖片大小不做定義,則頁面需要重新渲染,會(huì)影響頁面加載速度,所以給頁面的每個(gè)圖片加上大小吧。注意瀏覽器兼容性
現(xiàn)在國(guó)內(nèi)使用的瀏覽器主要是IE系列(IE6、IE7、IE8、IE9)和FireFor瀏覽器,當(dāng)網(wǎng)站代碼寫完后,應(yīng)盡量測(cè)試多個(gè)瀏覽器,如果發(fā)現(xiàn)不兼容,可以采用CSS HACK手段使其兼容,一般只要寫法規(guī)范,注意一些特殊標(biāo)簽的使用,都會(huì)兼容。用JS加載需要點(diǎn)擊或者過段時(shí)間才顯示的內(nèi)容
很多情況下,如圖片切換,幾張大圖,如果頁面打開時(shí)就加載,速度會(huì)大打折扣,而如果開始只加載第一張,然后等其他元素都加載完后才加載其他圖片,則可以讓頁面打開速度增快很多。使用圖片ALT屬性
搜索引擎只識(shí)別文字,不能識(shí)別圖片,不過能識(shí)別圖片標(biāo)簽的ALT屬性,為了讓頁面對(duì)搜索引擎更友好,給每個(gè)圖片加上ALT屬性說明吧。不要忘記Keywords和Description屬性
這兩個(gè)標(biāo)簽雖然對(duì)頁面瀏覽無影響,但是對(duì)搜索引擎很重要,跟前面圖片的alt屬性一樣,都是為了讓網(wǎng)站對(duì)搜索引擎更友好。
文章名稱:HTML代碼書寫不要成為網(wǎng)站設(shè)計(jì)中短板
本文網(wǎng)址:http://muchs.cn/news47/238647.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供定制網(wǎng)站、搜索引擎優(yōu)化、移動(dòng)網(wǎng)站建設(shè)、品牌網(wǎng)站設(shè)計(jì)、營(yíng)銷型網(wǎng)站建設(shè)、建站公司
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源:
創(chuàng)新互聯(lián)