Come posso migliorare l'aspetto dei caratteri in google chrome?

Controlla le impostazioni di ClearType - lo screenshot di Chrome sembra che sia forzato a rendere non-anti-alias. Questo ucciderà quasi tutti i font web, dal momento che non hanno suggerimenti monocromatici (per ragioni di dimensioni, tra le altre cose). Ero solito vedere questo riportato come “IE rende meglio il testo”, perché ignora le impostazioni ClearType a livello di OS e lo attiva di default.

Tutte queste risposte sono sbagliate! Questo è un grosso bug in Google Chrome, si prega di vedere il bug report/thread ufficiale che include molti screenshot qui: Official bug report on Chrome Code

Attualmente il miglior workaround è semplicemente dare al tuo elemento/titolo questa semplice regola:

-webkit-text-stroke: 1px

Addition from Dr John: ho trovato un suggerimento che anche html { -webkit-text-stroke: 0.25px} potrebbe funzionare - l'ho trovato qui https://groups.google.com/forum/?fromgroups#!topic/mathjax-users/dV_TmJ1QMO4

Chrome sta leggendo l'impostazione ClearType che su Windows XP è disattivata di default.

1. Per risolvere il problema, prima chiudi il browser Chrome.

2. Ora clicca con il tasto destro del mouse su un punto qualsiasi del desktop e seleziona ‘Proprietà’ dal menu a tendina.

3. Clicca sulla scheda ‘Aspetto’ che si trova in alto nella nuova finestra.

4. E clicca sul pulsante ‘Effetti’.

5. La seconda opzione in basso dovrebbe dire: “Usa il seguente metodo per smussare i bordi dei caratteri dello schermo”.

6. Seleziona l'opzione “ClearType”.

7. Clicca su Applica e riapri il tuo browser Chrome.

D'ora in poi Chrome renderà i tuoi font con un buon anti-alias per quell'effetto liscio.

Mettete il file SVG più in alto nella regola css del font-face, o il 1° o il 2° per esempio:

@font-face {
font-family: 'gothbook';
src: url('fonts/gothamrnd-book-webfont.eot');
src: url('fonts/gothamrnd-book-webfont.eot?#iefix') format('embedded-opentype'),
     url('fonts/gothamrnd-book-webfont.svg#GothamRoundedBookRegular') format('svg'),
     url('fonts/gothamrnd-book-webfont.woff') format('woff'),
     url('fonts/gothamrnd-book-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

Invece di:

@font-face {
font-family: 'gothbook';
src: url('fonts/gothamrnd-book-webfont.eot');
src: url('fonts/gothamrnd-book-webfont.eot?#iefix') format('embedded-opentype'),
     url('fonts/gothamrnd-book-webfont.woff') format('woff'),
     url('fonts/gothamrnd-book-webfont.ttf') format('truetype'),
     url('fonts/gothamrnd-book-webfont.svg#GothamRoundedBookRegular') format('svg');
font-weight: normal;
font-style: normal;
}

Esempi di questa correzione possono essere visti qui: Esempi di FontSpring Esempi di Adtrak

Avete l'accelerazione GPU abilitata in Google Chrome? Digita about:flags e cerca GPU Accelerated Canvas 2D, disabilitala se abilitata. I caratteri su alcuni siti appaiono davvero frastagliati quando ho navigato con l'accelerazione abilitata.

All'interno di Google Chrome clicca sulla chiave inglese > Opzioni > Sotto il cappuccio > [accanto a Contenuto web] clicca su Personalizza caratteri.

Cambia le impostazioni in modo che la tua pagina assomigli alla mia

Poi clicca sulla x, e vedi se il tuo problema è risolto.

Se questo non risolve il problema, potrebbe esserci un'altra cosa… ma aspetterò che tu provi questo.

Chrome prende il valore clearType di sistema per i font. In Windows 7 si spiega meglio. Su un Mac, l'anti-aliasing è abilitato per tutti i font sopra la dimensione 8, suppongo. Prova a attivare o a cambiare il clearType della tua macchina Windows

Update : Sembra che Chrome 22 e successivi ignorino le impostazioni di sistema per clearType

Ho avuto esattamente lo stesso problema, rendendo i webfont da http://www.google.com/webfonts in Chrome. Ho provato tutti i suggerimenti su questo e un paio di altri siti e nessuno di essi ha funzionato.

Alla fine ho iniziato a ispezionare le proprietà CSS del testo interessato, si è scoperto che era il colore del carattere a causare il problema. Un titolo dato color:#454545 rendeva male, ma lo stesso titolo dato il seguente: color:#333 funzionava bene. Grazie a Dio per i fogli di stile specifici dell'agente utente!

Chrome non rende bene i web font al momento. Ci sono diversi bug sul loro issue tracker per questo. Si prega di asteriscare qualsiasi rilevante a voi loro di dare loro più attenzione.

In Windows XP, ho appena cambiato l'opzione anti-alias da “Default” a “Clear Type” in Display → Proprietà → Aspetto → VisualEffects.

Per me non era l'impostazione ClearType in Windows 10.1 x64, ma è risultato essere un'impostazione nel mio browser Chrome chiamata DirectWrite.

1. Nella tua barra degli indirizzi in Chrome digita: chrome://flags/#directwrite
2. E attiva DirectWrite, il titolo di questa impostazione dice Disabilita DirectWrite e assicurati che il pulsante sotto di esso mostri la parola: Abilita

Questo ha risolto il problema per me.

Ho avuto questo problema così gravemente in Windows XP SP3 che ha reso Chrome inutilizzabile a tutti gli effetti. Ho notato che avevo installato Clear Type Tuning nel pannello di controllo e ho provato a deselezionare “Enable Font Smoothing” nella scheda avanzata. Dopo aver riavviato Chrome. era ok, anche dopo aver attivato di nuovo Font Smoothing. Ho deciso di spuntare la casella “Apply all settings to defaults for new users and system”.

Vai a chrome://flags/ (o about:flags) e Disabilita l'opzione Override software rendering list.

Anche l'opzione Accelerated 2D canvas dovrebbe essere disabilitata.

Questa combinazione mi ha aiutato.

premi il tasto windows + r poi scrivi cttune.exe lì dentro

metodo alternativo è premere il tasto windows poi digitare cleartype poi selezionare Adjust ClearType Text

e seguire le istruzioni, se hai ancora problemi prova alcuni degli altri esempi

questo ha funzionato per me, devi provare i diversi esempi, è molto simile alla calibrazione del contrasto/luminosità ma per il testo invece

FYI: disabilitare l'accelerazione 2d potrebbe aiutare a far giocare chrome con lo strumento windows cleartype tune

Sembra che la risposta lunga e difficile sia che non puoi. Ci sono molte discussioni e suggerimenti nell'aiuto di Chrome , ma non vedo nulla che valga la pena suggerire.

La grande domanda è come fai a farlo sembrare così brutto! Sto usando Chrome per scrivere in questa casella… Ho anche fatto un bel po’ di zoom e non vedo niente come te. Se hai ancora domande dopo questo dovresti spiegare la tua configurazione alla comunità.

Anche se Chrome è “utilizzabile” per i caratteri, sembra sottile e slavata dove rende le linee diagonali specialmente. IE rende molto meglio ma IE è un browser più lento e anche FireFox.

Credo che questo sia inerente al codice di chrome.

BTW, HackToHell, dove devo andare per cambiare il colore del rendering?

Proverò così.

Se vuoi che i web font siano leggibili mentre hai ancora lo smoothing/cleartype disabilitato, allora la soluzione è disabilitare i web font in Google Chrome. In tal caso il browser userà i font standard del sistema operativo che sono resi correttamente quando cleartype/smoothing è disabilitato. Per farlo passate il flag /disable-remote-fonts a chrome.exe. Fai clic sulla scorciatoia di Google Chrome sul desktop, seleziona Proprietà, vai alla scheda Scorciatoia e imposta Destinazione a:

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" /disable-remote-fonts

Ci può essere un problema con i web font disabilitati. Se il sito web sta usando le icone dei web font, allora non verranno visualizzate.

Il problema corrispondente nel tracker di Chromium:

“System-wide ClearType setting not respected for web fonts https://code.google.com/p/chromium/issues/detail?id=319429

Vai su chrome://flags/ e imposta “LCD text antialiasing” su enabled. Riavvia il browser.