7. 12. 2009 v sekci webdesign:

Konec náhrady textu obrázkem?

Nastává se všemi těmi cufóny, sIFRy a CSS podporou alternativních písem soumrak image replacementu?

Z mého pohledu je odpověď NE. Techniky image replacementu, zejména pak Gilder/Levin Method mají při kódování stále svůj význam. Je ale potřeba dopředu zvážit možný růst webu a další faktory, které umožňují specifikovat použití konkrétní technologie.

Někdy je výrazně lepší použít jednu z alternativ, které umožňují náhradu textu automatizovat – šetří tedy práci nejen při každé úpravě, ale i při vzniku nových nahrazovaných textů. Před třemi lety jsem si na jednom webu navrhl image replacement pro jeden z typů nadpisů. Později už jich bylo přes 100 a já stále přidával nové obrázky (k mé velké radosti). S cufónem nebo sIFRem nebudete něco podobného nikdy muset řešit.

Jestliže potřebujete nahradit jeden nebo více typů ryze textových nadpisů/popisků/dalších textových elementů za obrázky, použijte cufón nebo sIFR. Skalní příznivci mohou upřednostnit nativní web embeding v prohlížeči (ale bacha na vyhlazování).

Kde tedy použít image replacement?

Google radí – pro logo v hlavičce používejte tag IMG. Logotyp se bude vždy korektně zobrazovat, bude dostupný nejen při prohlížení bez stylů, ale i při tisku stránky. Z mého pohledu je to jasné a logické až do chvíle než:

  • máte logo zapracováno do komplexní hlavičky a rozhodně nechcete, aby si uživatelé tiskli všechen ten balast okolo
  • chcete logo s hover efektem a zároveň nechcete použít javascript

V takovém případě je image replacement skvělou volbou, která vám umožní logo nejen netisknout, ale zároveň i jednoduše umožnit efekt po najetí myši. Další oblast pro image replacement jsou:

  • malé weby (kde se nevyplatí rozjíždět sIFR či cufón, např. proto, že máte problém s licencí k písmu)
  • bannery s hover efektem bez JS (odkaz je text)
  • různé hrátky s písmem (zkuste si pozicovat, zmenšovat apod. text nahrazený cufonem písmenko po písmenku), popř. text, kde vám záleží na každém pixelu

Související

Komentáře

07. 12. 09, 10.15

Pekne a vystizne. Na jednom webu jsme nedavno zkombinovali sIFR a Gilder/Levina proto, ze v nekterych nadpisech byly nestandardni znaky a sIFR je nezvladl.

K logu pro tisk mel pekny tip Martin Michalek, resp. Karmi: http://kratce.vzhurudolu.cz/…ogo-pro-tisk Nic svetoborneho… jenom, na to prijit. :-)

07. 12. 09, 10.52

V zásadě souhlasím, jen myslím, že z článku není úplně jasné, že podstatným parametrem výběru metody je efektivita.

Pár nadpisů na malém webu je nejrychlejší udělat obrázkem, hodně nadpisů na větším webu pak zase sIFRem, který je ovšem enormně nepříjemný k instalaci a na menším projektu se nevyplatí. Cufón je příjemný kompromis.

Do budoucna bude nejvíce efektivní samozřejmě @font-face, jenže tam bude s masivním nasazením potřeba počkat jednak až bude vyhlazování běžné a jednak na probuzení písmolijen z medvědího spánku.

07. 12. 09, 11.33

Určitě ještě stojí za zmínku TypeKit, na FOWD 2009 to bylo velmi žhavé téma.

07. 12. 09, 12.12

[1+2] díky za doplnění
[3] těch metod je víc… třeba FLIR… :-) ale podstatou článku nebylo rozebrat podrobně přehled aktuálních metod, spíše se na to podívat komplexněji :-)

07. 12. 09, 15.17

Principiálne súhlasím, až na použitie replacementu pri logách. Obe možnosti sú riešiteľné s a neviem si predstaviť dôvod, prečo to robiť inak, dokonca ani za predpokladu, že klient nechce na printových veciach jehu webu logo (to sa ti už stalo?) :)

6. Erythros
07. 12. 09, 15.26

Nemám moc rád nahrazení textu obrázkem a snažím se mu co nejvíce vyhýbat. A to i implementacím, kdy se pomocí JS, nebo překrývání podaří „zprovoznit“ oblíbenou vymoženost označení a zkopírování textu.

Otázka je, jak často designéři opravdu potřebují, aby se text vykreslil zrovna tím jediným řezem písma a kdy je to zbytečné plýtvání energií. Pochopitelně u více designérsky hutnějších prezentací (plakátů) je jistý typ písma nutností a většina lidí obrázkový nápis překousne třeba v hlavičce, ale jsem názoru, že v okamžiku, kdy začnou být i nadpisy a podnadpisy obrázkové i v článku – textové modle – je něco špatně.

Takže, pokud už musíte nahrazovat text obrázkem – dělejte tak pouze na místech, kde uživatel intuitivně nejezdí kurzorem.

07. 12. 09, 17.17

[2] S tím vyhlazováním máš pravdu, už opadlo opojení z technologie a to vyhlazování všichni řeší. (Jen Filosof to řešil už na WebExpo ;))
[3] Typekit = @font-face, který Filosof zmiňuje. A ten má právě problémy s tím vyhlazováním..

07. 12. 09, 19.11

[7] perlička – na webexpo jsem to řešil proto, že jsem měl ve woknech nevyhlazené písmo, takže to byla první věc, co mě napadla :-) (aktuálně ho mám vyhlazené)

07. 12. 09, 23.00

Moc nevím jak se k tomu vyjádřit, ale jsem si jistý, že nic by se nemělo přehánět. Jak už tu bylo řečeno vkládat i do nadpisů takovéto náhražky písma (promiňte ten výraz) je podle mého hloupé. Pro nějaké ty obrázky v menu nebo hlavičku je to určitě dobré, ale tím to alespoň podle mého názoru končí.

10. karf
07. 12. 09, 23.52

[7][8] Vyhlazování je možná pro spoustu grafiků hlavní důvod, proč používají obrázková písma (typ písma je až podružný – kolikrát už jsem viděl vyřezávat obrázkové nadpisy Helvetikou, kterou kolikrát ani dotyčný grafik nepozná od Arialu). Což je špatně. Mě osobně nekonzistence vyhlazování písma na webu (nativní systémové vyhlazování vs. obrázkové z Photoshopu) irituje. Vyhlazování je navíc poměrně úzce vázané na hardware (subpixely, DPI), čili by se nemělo řešit na úrovni grafika. Stejně je nejlepším řešením font-family: sans-serif :)