Aliasowanie czcionek (anty) w Photoshopie

Używam Photoshopa do projektowania stron internetowych i za każdym razem, gdy porównuję projekt Photoshopa z podglądem przeglądarki na żywo, czcionki wydają się być renderowane inaczej.

Zasadniczo każdą metodę antyaliasingu, którą wybrałem w Photoshopie, tekst zawsze sprawia wrażenie pogrubionego tekstu . Więc zawsze jestem zmuszony wyłączyć antyaliasing (dla normalnego tekstu 12px / 14px).

Czy jest jakaś metoda renderowania czcionek w Photoshopie, która jest podobna do tej, którą używa system Windows z czystym typem?

Jeśli nie, to czy są dostępne czcionki, które wyglądają lepiej niż Arial, gdy wygładzanie jest wyłączone?

Są dwa powody, dla których tekst ClearType jest tak wyraźny.

1. używa renderowania subpikseli . Nie sądzę, że Photoshop to obsługuje.
2. wykorzystuje agresywne podpowiedzi, aby dopasować linie do siatki pikseli

Możesz wpisać tekst w Notatniku, zrzut ekranu za pomocą wygodnego narzędzia i wkleić go do Photoshopa w trybie mieszania Mnożenie (ponieważ jest to czarny tekst na białym tle). Ale to nie jest wygodne. Edycja: może być prawie niemożliwe wykonanie dowolnego koloru pierwszego planu innego niż czarny.

Ten facet opisał metodę ręcznego renderowania subpikseli, a moim zdaniem poprawia ostrość czcionki, zbliżając ją do ClearType. Ale nadal korzysta z podpowiedzi Photoshopa, więc nie jest tak ostry jak ClearType.

Czy naprawdę potrzebujesz renderowania w stylu ClearType w Photoshopie? Jeśli eksportujesz grafikę zawierającą tekst do wykorzystania w twoim projekcie internetowym, nie powinny one zawierać renderowania subpikseli, ponieważ nie jest to odpowiednie dla niektórych wyświetlaczy (CRT, obrócony telefon). A jeśli nie eksportujesz tekstu, a tylko na niego patrzysz, renderowanie w Photoshopie wydaje się OK.

Photoshop nie jest programem do projektowania stron internetowych. Aby uzyskać tekst wyglądający tak samo w przeglądarce, jak na grafice (jpg, gif itp.), Musisz użyć tej samej czcionki w obu programach. Niektóre czcionki nie są używane przez wszystkie przeglądarki.

W zależności od rozmiaru tekstu dobrą czcionką średniej wielkości może być Tahoma, Helvetica, Trebuchet lub Georgia. Sprawdź tę stronę, aby znaleźć kilka dobrych pomysłów: http://www.snaphow.com/10-most-popular-web-fonts-used-in-web-safe-design/

Większe czcionki zaczynają mieć znaczenie w przypadku wygładzania.

Jeśli próbujesz połączyć tekst z tekstem na stronie, sugeruję użycie pozycjonowania CSS, aby osiągnąć swoje cele. CSS pozwala na umieszczanie tekstu ze strony internetowej ponad obrazami i wykorzystuje pozycjonowanie względne i bezwzględne, aby renderować stronę dokładnie tak, jak chcesz. Oto przykład i samouczek: http://css-tricks.com/text-blocks-over-image/

Niestety Photoshop nie obsługuje żadnego renderowania subpikseli. Żadne inne oprogramowanie Adobe - z wyjątkiem Dreamweaver . (Cóż, nie jest to dokładnie technologia Dreamweaver, ponieważ po prostu renderuje HTML, a następnie przekazuje tekst do renderowania przez system operacyjny.)

Sugerowany przepływ pracy może być taki, że utworzysz i pokroisz projekt w Photoshopie, a następnie otworzysz go w Dreamweaver. Jeśli projekt wymaga dalszych poprawek, możesz jednocześnie otworzyć plik w Photoshopie, wprowadzić zmiany, zapisać i odświeżyć widok w Dreamweaver. Dodaj ostatnią, prawdziwą kopię do Dreamweaver. Możesz także zastąpić Photoshopa Fireworks; lub nawet rozpocznij szkieletowanie w Fireworks → kontynuuj w Photoshopie → publikuj przez Dreamweaver. (Oczywiste jest, dlaczego wersje pakietu Creative Suite są zwykle kupowane w pakietach, prawda?)

Jeśli projekt wygląda inaczej w podglądzie Dreamweavera niż w przeglądarce (przeglądarkach), jest to inna, niefortunna sprawa (i nie mówię tylko o typografii, ale o renderowaniu jako całości). Im szybciej przejdziesz z programu Photoshop do wersji demonstracyjnej na żywo - czy to w programie Dreamweaver, czy nie - tym lepiej. Chciałbym , żeby Photoshop miał moc renderowania subpikseli (ale jednocześnie mam nadzieję, że nie zostanie wprowadzony w CS6, a przynajmniej mam nadzieję, że do tego czasu będę bogaty)!

Na marginesie: ClearType jest chroniony około 10 patentami, więc dokładnie takie samo renderowanie nie jest prawdopodobne. Warto również zauważyć, że OS X domyślnie używa innego renderowania (Quartz), podobnie jak interfejsy graficzne w dystrybucjach linuksowych.

Projektowanie w HTML i CSS. Jeśli MUSISZ przenieść go z powrotem do makiety PhotoShop, zrzut ekranu z przeglądarki, a następnie przenieś z powrotem do dokumentu PhotoShop.

Ustawienie typu w PhotoShop jest ogólnie uciążliwe.

Możliwym obejściem może być użycie „ostrej” metody wygładzania i ustawienie wewnętrznego połysku na głębokości 0 na warstwie tekstowej:

Do tej próbki użyłem koloru białego, krycia 85%, trybu mieszania „ekranu”, 0 dławika, 0 rozmiaru. Nie tak dobry jak Ms typu clear, ale wygląda mniej bolly ...

(pierwsza linia = brak wygładzania, ostatnia linia = ostre wygładzanie bez wewnętrznego blasku)