網頁的字體渲染

Question

創建網頁時，我總是遇到同樣的問題。當我添加一個大於16-18px的字體時，它看起來很糟糕。它的鋸齒狀和像素化。我嘗試過使用不同的字體和重量，但我沒有太多運氣。

注：它只在窗戶中，它是這樣的。主要在Opera和FF中也在IE7中，但還不算差。在Linux中，字體看起來不錯。我沒有看過Mac。

你們如何解決這個問題？如果有什麼。我注意到這裏的標題也很不規則，但它們很小，不會看起來不好。

Answer 1

沒有辦法強制用戶更改操作系統呈現字體的方式。如果對你來說這是一件大事，那麼你可以用圖像替換大標題，這允許你精確地控制字體如何呈現（並確保標題看起來完全如你所願，即使用戶沒有你的建議字體安裝）。

如果您這樣做，請確保您爲沒有看到圖像的人提供替代文字表示。我傾向於使用CSS來顯示背景圖像，並隱藏標題的內容。喜歡這個。

<style> 
    h1 
    { 
     height: 32px; 
     width: 100px; 
     background: url("path/to/image") 
    } 

    h1 span 
    { 
     display: none; 
    } 
</style> 

<h1> 
    <span> 
     Heading Text 
    <span> 
</h1> 

說實話，這看起來似乎是矯枉過正，如果它是所有大型文本。並且請注意，它會增加客戶需要下載的數據量。但是，對於大標題，此方法可能會導致看起來比OS渲染文本更好的東西。

Answer 2

啓用抗鋸齒應解決顯示問題。

Answer 3

除了抗鋸齒，嘗試啓用清除類型。

Answer 4

在Windows上，啓用ClearType將解決此問題。但是，您不能強制用戶使用它。這不是瀏覽器問題;這是操作系統的字體平滑方法。