Come posso far apparire il mio testo di Photoshop come sul web?


11

Devo davvero progettare tutto in Photoshop con l'antialiasing impostato su "none"? Sono sicuro che c'è un modo migliore.

Mi piacerebbe avere un'impostazione in modo che quando scelgo una base sicura per il web (come Tahoma) in Photoshop in modo da poter vedere come sarà effettivamente quando sul web.

Ad esempio: la differenza tra Tahoma e l'antialiasing impostato su "nitido" in Photoshop e il modo in cui viene visualizzato in Firefox è notevole. Sembra bello e fluido in Photoshop e sembra una schifezza sul web.

Esiste una scelta anti-aliasing che è meglio iniziare (che ha il risultato più simile) quando si pianifica di pubblicare i contenuti sul Web?


1
L'aspetto di un carattere "sul Web" dipende interamente dal browser, dalle impostazioni del browser, dal sistema operativo e dalle impostazioni del sistema operativo. In altre parole, sembra diverso per persone diverse.
DA01,

Risposte:


10

La maggior parte dei sistemi operativi e browser esegue il rendering con antialias o antialiasing sotto pixel. L'antialiasing sub-pixel è comune su piattaforme desktop, come Windows (con ClearType) e OS X. L'antialiasing monocromatico standard è comune su piattaforme mobili, dove l'ordine dei sub-pixel del dispositivo può cambiare con l'orientamento del dispositivo e dove il rendering dei sub-pixel non è ' È fondamentale, perché spesso hanno schermi con densità di pixel più elevata.

Il rendering del testo con alias è comune su Windows XP, dove ClearType è disabilitato per impostazione predefinita. Windows Vista e versioni successive hanno ClearType attivato per impostazione predefinita.


Il rendering in Photoshop vs Windows vs OS X vs iOS vs Android vs WebKit vs Firefox (Gecko) sono in genere tutti diversi. Quindi non è assolutamente possibile creare qualcosa in Photoshop e sapere che il rendering del testo sarà lo stesso, a meno che non si faccia uno screenshot e lo si aggiunga al documento come un livello bitmap.


2
Da quando ha risposto a questa domanda, Adobe ha aggiunto le opzioni "Mac" e "Mac LCD" a Photoshop (più equivalenti su Windows) che utilizzano il rendering dei caratteri di sistema. Adesso è spesso molto vicino o identico a Safari.
Marc Edwards,

8

No. La nuova linea di pensiero è quella di evitare Photoshop per il layout e il design tipografico e iniziare nel browser il prima possibile.

Passando al client un URL reale rispetto a una composizione Photoshop, eviti che le aspettative del cliente vengano tratteggiate quando il prodotto finale diventa leggermente diverso nel browser di sua scelta rispetto alle composizioni Photoshop.

In definitiva, è nostra responsabilità educare il client e renderli consapevoli delle inevitabili discrepanze tipografiche che si verificano tra browser e sistemi operativi.


1
Nella mia azienda, creo disegni e li consegno a uno sviluppatore front-end. Non tocco mai il codice. Detto questo, ho bisogno di una soluzione che non implichi effettivamente la costruzione della pagina Web per vedere come appare il testo.
jonn_g,

2

In Photoshop CC, abbiamo aggiunto nuove modalità di aliasing per i tuoi caratteri. Invece di "nitido", o "forte", prova il nuovo "Mac LCD". Otterrai un design web sicuro al 100%.


1
Non esiste un "100% design sicuro per il web" dato che non esiste una coerenza al 100% tra browser, caratteri e sistemi operativi.
DA01,

1

Risposta breve: non puoi.

Photoshop non è mai l'ideale per sapere come verranno renderizzati i caratteri tipografici al di fuori di esso, ma non è l'ideale per lavorare con i caratteri in generale. (Quando lavoravo in uno studio di progettazione / negozio di stampa, tutto ciò che era stato progettato in PS doveva essere esportato come PDF per lo stesso motivo). Poi arriva il problema del web, sono i browser e il sistema operativo che esegue quei browser. Finora, per quanto ne so, OS X è il migliore in termini di rendering dei caratteri in modo appropriato, mentre Linux è al secondo posto e Windows, ovviamente, è l'ultimo. La realtà è che usano tutti algoritmi diversi per il rendering dei caratteri e non otterrai lo stesso risultato ovunque. Se ci fosse una soluzione, sarebbe che passiamo tutti a Linux, Mac o aspettiamo che Microsoft riesca la prossima volta con Windows Metro (mi dispiace, odio chiamarlo Windows 8) o lo soffia totalmente,

Solo i miei 2 centesimi,

toppa


0

A mio avviso, il rendering in un browser è a metà tra Photoshop "Sharp" e "Crisp" su un Mac e tra "Crisp" e "Strong" su Windows. Suggerisco di usare "Crisp" per il testo dal vivo per i grafici con cui lavoro. L'impostazione predefinita "Forte" li imposta sempre per la delusione. ;)

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.