Renderização adequada de fontes da Web no iOS

Ocasionalmente, o iOS vai lançar turbulências com suas fontes @ font-face personalizadas em seu site móvel e decidir que seria uma ideia elegante renderizá-las duplamente. Isso parece ter acontecido desde iOS4 e parece não ter rima ou motivo, mas felizmente há uma solução. Em vez de definir a espessura da fonte para negrito, carregue a fonte em negrito separadamente com um nome diferente, conforme mostrado aqui, em seguida, defina a suavização da fonte para ter suavização de serrilhado em seu CSS e Viola! Ocupa um pouco mais de espaço para a fonte extra, mas seu site agora é magicamente mais suportável em dispositivos iOS!

/* Original Font */
@font-face {
font
-family: MyFont;
src
: url(...);
}

/* Bold Font Face of Same Font */
@font-face {
font
-family: MyFontBold;
src
: url(...);
font
-weight: normal;
font
-style: normal;
font
-variant: normal;
}

/* Example Using on an element */
#myBoldElement{
font
-face: MyFontBold;
font
-weight:normal;
-webkit-font-smoothing: antialiased;
}