如何在網(wǎng)站優(yōu)化中優(yōu)化瀏覽器渲染，多年seo云優(yōu)化經(jīng)驗(yàn)的優(yōu)幫云今天向大家講解了關(guān)于網(wǎng)站優(yōu)化，如何從代碼上渲染瀏覽器，從而加快網(wǎng)站的速度和網(wǎng)站優(yōu)化。
1： HTML和CSS中的圖像大小規(guī)范
圖像大小公式：所有圖像的寬度和高度都是在網(wǎng)頁(yè)設(shè)計(jì)中指定的，這樣通過(guò)消除不必要的回流和重畫(huà)可以更快地呈現(xiàn)網(wǎng)頁(yè)。
當(dāng)瀏覽器執(zhí)行頁(yè)面布局時(shí)，它需要可替換的元素，例如圖像。在瀏覽器開(kāi)始呈現(xiàn)呈現(xiàn)的頁(yè)面之前，它會(huì)下載圖像。如果包含的文檔中沒(méi)有指定大小，或者指定的圖像與這些實(shí)際圖像不匹配，瀏覽器將要求對(duì)下載的圖像進(jìn)行一次回流和重畫(huà)。
為了防止回流，可以使用HTML中的所有圖像img標(biāo)記，也可以使用CSS中指定的寬度和高度。
2： 指定字符集
瀏覽器使用的字符編碼？信息。屏幕上顯示的字符被轉(zhuǎn)換成字節(jié)流。由于瀏覽器無(wú)法正確呈現(xiàn)頁(yè)面，也不知道如何構(gòu)建頁(yè)面的字符，因此大多數(shù)瀏覽器都會(huì)緩沖一定數(shù)量的字節(jié)，然后執(zhí)行任何Java或呈現(xiàn)頁(yè)面，Internet Explorer版本6、7、8是一個(gè)例外。
但是，一旦緩沖所需的字節(jié)數(shù)可用并呈現(xiàn)頁(yè)面，如果遇到不符合默認(rèn)字符集規(guī)范的輸入和重畫(huà)頁(yè)面，則需要重新解析它們。有時(shí)可能有一個(gè)請(qǐng)求資源。如果存在不匹配，則外部資源的URL將受到影響。
3： 文檔標(biāo)題中的CSS
嵌入的樣式和文檔體鏈接元素被放置在頭部，從而提高了渲染性能。
當(dāng)在HTML正文中指定外部樣式表和內(nèi)聯(lián)樣式時(shí)，瀏覽器的呈現(xiàn)性能將受到負(fù)面影響。因此，外部樣式表和內(nèi)聯(lián)樣式都放在頁(yè)面的頂部。通過(guò)確保首先下載并分析樣式表，您可以讓瀏覽器逐步呈現(xiàn)頁(yè)面。
4： 避免使用CSS表達(dá)式
CSS表達(dá)式通過(guò)用其他替代品替換ie用戶(hù)的瀏覽器來(lái)降低渲染性能。CSS表達(dá)式僅適用于Internet Explorer 5到7，并且支持CSS表達(dá)式。Internet Explorer 8中的CSS表達(dá)式已棄用，不支持其他瀏覽器。
從IE5開(kāi)始，CSS表達(dá)式成為在響應(yīng)事件中更改文檔屬性的一種方法。他們經(jīng)常被用來(lái)提供一個(gè)動(dòng)態(tài)的風(fēng)格和更耀眼的效果。此外，它還可以使CSS更加緊湊和方便，實(shí)現(xiàn)功能和效果。
我們使用CSS表達(dá)式，比如每小時(shí)切換一個(gè)背景。
背景顏色：表達(dá)式（（newDate（））.getHours（）%2？“B8D4FF”：“F08A00”）；
表達(dá)式中使用Java表達(dá)式。CSS屬性是根據(jù)Java表達(dá)式的求值設(shè)置的。expression方法在其他瀏覽器中不起作用，因此在跨瀏覽器設(shè)計(jì)中單獨(dú)設(shè)置Internet Explorer時(shí)非常有用。不僅當(dāng)頁(yè)面顯示和縮放時(shí)，而且當(dāng)頁(yè)面滾動(dòng)甚至移動(dòng)鼠標(biāo)時(shí)，都將重新計(jì)算。向CSS表達(dá)式添加計(jì)數(shù)器可以跟蹤它的計(jì)算頻率。
一種減少CSS表達(dá)式次數(shù)的方法是使用一次性表達(dá)式，該表達(dá)式在初次運(yùn)行時(shí)將結(jié)果分配給指定的樣式屬性，并用此屬性替換CSS表達(dá)式。如果必須使用CSS表達(dá)式，請(qǐng)記住它們會(huì)被計(jì)算數(shù)千次，并且會(huì)對(duì)頁(yè)面的性能產(chǎn)生影響。
5： 使用有效的CSS選擇器
首先：刪除未使用的CSS是提高渲染性能的***個(gè)重要步驟。頁(yè)面呈現(xiàn)從右到左、從右邊的選擇器（稱(chēng)為“鍵”）計(jì)算每個(gè)CSS規(guī)則，并通過(guò)每個(gè)選擇，直到找到匹配項(xiàng)或放棄CSS規(guī)則。