web前端有哪些頁面優(yōu)化

本篇內(nèi)容主要講解“web前端有哪些頁面優(yōu)化”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學(xué)習(xí)“web前端有哪些頁面優(yōu)化”吧!

1）頁面主題優(yōu)化

實事求是的寫下自己網(wǎng)站的名字，網(wǎng)站的名字要合理，最好包含網(wǎng)站的主要內(nèi)容。

2）頁面頭部優(yōu)化

<meta name="keywords"   content="" />向搜索引擎說明你的網(wǎng)頁的關(guān)鍵詞；<meta name="description"    content=""/>告訴搜索引擎你的站點的主要內(nèi)容；

說明
1、“描述”部分應(yīng)該用近乎描述的語言寫下一段介紹你網(wǎng)站的文字，在這其中，你應(yīng)該適當(dāng)?shù)膶δ憔W(wǎng)站的特色內(nèi)容加以重復(fù)以求突出；
2、“關(guān)鍵字”部分應(yīng)該列出你認(rèn)為合適的，能突出網(wǎng)站內(nèi)容的關(guān)鍵字就可以了，關(guān)鍵字不要設(shè)置太多，可設(shè)置10---8個，搜索引擎只會瀏覽靠前的幾個關(guān)鍵字。

3）超鏈接優(yōu)化

1、采用純文本鏈接，少用，最好是別用Flash 動畫設(shè)置鏈接，因為搜索引擎無法識別Flash上的文字.
2、按規(guī)范書寫超鏈接，這個title屬性，它既可以起到提示訪客的作用，也可以讓搜索引擎知道它要去哪里.
3、最好別使用圖片熱點鏈接，理由和第一點差不多

4）圖片優(yōu)化

圖片優(yōu)化并不是修改圖片的大小、顏色，而是你應(yīng)該為每個標(biāo)簽加上alt屬性，alt屬性的作用是當(dāng)圖片無法顯示時以文字作為替代顯示出來，而對于SEO來說，它可以令搜索引擎有機會索引你網(wǎng)站上的圖片，對于一些確實沒什么意義的圖片，最好也不要省略alt，而應(yīng)該留空，即 alt=""。

5）PageRank（pr值,友情鏈接）

PR值是Google提出的一個重要參數(shù)，它標(biāo)明了某個網(wǎng)站的重要程度，那么pr值是如何確定的呢？目前普通的解釋為：假如有ABC三個網(wǎng)站，彼此互作友情鏈接，那么當(dāng)一個訪客通過A上的友情鏈接來到B時，Google就認(rèn)為A為B投了“一票”，同理，如果有人從C訪問B，那么B又得一票，如果全世界的網(wǎng)站上都有B的友情鏈接，B就是世界上最重要的網(wǎng)站了！

可以擴展：回流(resflow) & 重繪(repaint)

• 頁面的渲染流程

什么是DOM樹
什么是樣式結(jié)構(gòu)體
什么是呈現(xiàn)樹

呈現(xiàn)樹的特點

圖片整合（精靈圖、css sprites、css精靈、雪碧圖）

把網(wǎng)站里面的小圖標(biāo)有規(guī)則的整合在一起，利用 background-position 改變背景圖的位置，每個圖標(biāo)應(yīng)用。

優(yōu)點:
（1）CSS Sprites能很好地減少網(wǎng)頁的http請求，從而大大的提高頁面的性能，這是CSS Sprites最大的優(yōu)點，也是其被廣泛傳播和應(yīng)用的主要原因；
（2）CSS Sprites能減少圖片的字節(jié)；
（3）CSS Sprites解決了網(wǎng)頁設(shè)計師在圖片命名上的困擾，只需對一張集合的圖片命名，不需要對每一個小圖片進(jìn)行命名，從而提高了網(wǎng)頁制作效率。
（4）CSS Sprites只需要修改一張或少張圖片的顏色或樣式來改變整個網(wǎng)頁的風(fēng)格。

缺點:
（1）圖片合并麻煩：圖片合并時，需要把多張圖片有序的合理的合并成一張圖片，并留好足夠的空間防止版塊出現(xiàn)不必要的背景。
（2）圖片適應(yīng)性差：在高分辨的屏幕下自適應(yīng)頁面，若圖片不夠?qū)挄霈F(xiàn)背景斷裂。
（3）圖片定位繁瑣：開發(fā)時需要通過工具測量計算每個背景單元的精確位置。
（4）可維護(hù)性差：頁面背景需要少許改動，可能要修改部分或整張已合并的圖片，進(jìn)而要改動css。在避免改動圖片的前提下，又只能（最好）往下追加圖片，但這樣增加了圖片字節(jié)。

到此，相信大家對“web前端有哪些頁面優(yōu)化”有了更深的了解，不妨來實際操作一番吧！這里是億速云網(wǎng)站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！