CSS嵌入在dwt與外部樣式表

Question

我創建了一個包含46頁的新網站：http://www.lampshade111.com/ 我使用Microsoft Expression Web 4採用動態Web模板。 所有的css都嵌入在dwt頁面的標題中，並更新到每個單獨的網頁。 一切看起來和完美的作品 - 沒有問題。

但是，我讀過的所有內容都建議使用外部樣式表。 因此，本着「良好實踐」的精神，我從dwt標題中刪除了css，並將外部樣式表應用於（鏈接）到dwt。 當然，單個頁面由dwt更新，鏈接的css文件顯示在每個頁面上。 再次，一切看起來和完美的作品像以前一樣。

問題：在使用外部樣式表後查看我的網站時，網站在瀏覽器中速度較慢。

我有另一個網站有256頁，所有的CSS都嵌入在主dwt的標題 - 沒有外部樣式表。 http://www.hoylelamps.com/ 它已經很好的工作了很多年。

問題： 有什麼理由不在dwt的標題中使用css？ 這是否假設比外部樣式表更高效（更快）？ 我無法找到關於此主題的任何信息。

感謝您的幫助？ - 吉姆

Answer 1

我無法想象爲什麼外部樣式表比外部樣式「慢得多」。鏈接的樣式表一旦被加載就會被緩存，並且不需要第二次加載。這意味着您加載的第二和第三頁應該更快，除非您在每個頁面上使用完全不同的格式。

嵌入樣式表一開始會運行得更快，因爲只有一個資源需要加載。但隨着時間的推移，用嵌入式樣式表維護多個頁面所需的工作將變得更加沉重。請記住，每次在任何頁面中更改一個CSS規則時，都必須在每個頁面中進行更改，然後再次上傳所有這些頁面。如果你不這樣做，你會在整個網站上有不同的格式。

外部鏈接樣式表排除了這個問題。一個樣式表，一個文件來糾正和上傳。我能想到的唯一的事情會令你的頁面加載或更慢迴應如下：

• 非常大的樣式表
• 使用「進口」，而不是「鏈接」命令（某些瀏覽器不同的反應這些命令）
• 您正在使用非標準CSS或非常密集的樣式命令。

沒有看到CSS我真的不能給你任何更多的建議。瀏覽器首先加載兩個文件的事實會導致它稍微慢一些。但很難理解爲什麼整個網站運行速度更慢。

以下是一些建議：

• 你檢查，並在其他瀏覽器和其他計算機測試網頁？也許這不是網頁。也許它是瀏覽器或你使用的計算機。
• 如果您的樣式表很大，請將其分解爲邏輯組件。我有格式表格，表單和特殊組件的樣式表，它們不會出現在每個頁面上。僅加載與該頁面相關的CSS。有一個主要樣式表，然後爲特定類型的組件提供專門的樣式表，就像上面提到的那樣。
• 檢查您正在使用的命令的類型。您是否充分利用級聯，繼承和特異性？嘗試創建儘可能高效的CSS。

保留嵌入式樣式表可能起初很容易，但更新和維護嵌入式樣式表的大型網站會更加繁瑣。

希望有所幫助。