Nepoužívejte alternate stylesheet!

MyEgo.cz

home foto blogy mywindows.cz kontakt

Nepoužívejte alternate stylesheet!

Technologie 23.08.04

alternate stylesheets jsou možnost jak jednu stránku ostylovat více různýmí způsoby, možností podporovanou například Firefoxem, či Operou. Nicméně, jedná se zjevně o špatné řešení tohoto problému. Podívejme se na to blíže:

Špatné řešení pro Firefox a Operu:

<link rel='stylesheet' 
  type='text/css' href='primary.css'/>
<link rel='alternate stylesheet' 
  type='text/css' href='gray.css' title='Šedá'/>
<link rel='alternate stylesheet' 
  type='text/css' href='red.css' title='Rudá'/>
<link rel='alternate stylesheet' 
  type='text/css' href='green.css' title='Zelená'/>

V čem je toto řešení špatné?

  • Prohlížeč načítá nejen aktivní stylesheet, ale i veškeré ostatní CSS soubory, a to již při prvním zobrazení stránky (můžete si to ověřit, nainstalujte si výborný Proxomitron). Tímto se zbytečně přenáší desítky až stovky KB dat!
  • Při změně aktivního stylu a přechodu na jinou stránku neumí Firefox ani Opera tento styl udržet i nadále aktivní, čtenáři se tudíž zobrazí primární styl. Což je velice matoucí.
  • Mnoho lidí používá na trvalé přepínání alternativních stylů JavaScript, ale často špatně napsaný JavaScript (používal jej třeba Rony), který Operu identifikuje jako browser údajně nepodporující alternate stylesheet.
  • Microsoft Internet Explorer, zastaralý, ale stále používaný browser, alternativní CSS soubory nepodporuje vůbec. Jeho uživatelé uvidí jen primární styl.

Správné řešení pro veškeré browsery?

Správným řešením je samozřejmě alternate stylesheet vůbec nepoužívat, a přepínat alternativní styly třeba skriptem na straně serveru. Jedno takové řešení jsem již publikoval dříve. Na jeho praktickou realizaci se můžete podívat na demo.blogcms.com.

Komentáře

  1. 1 notfound 23.08.04, 10:08:17
    FB

    Premyslim, jestli ma takhle smysl vyrobit server-side skript pro tisk clanku. Ted tam mam "screen,projection,tv" jeden styl pro obrazovku a "print" pro tisk.

  2. 2 rony 23.08.04, 10:08:26
    FB

    [1] alternativne styly pre rozne media samozrejme MAJU byt definovane takto!!!! Ziadne "Radkovo" riesenie prepinanim dynamicky skriptom na strane servra!!!!!!! Zdoraznujem to!!!

    K clanku: nie je pravda, ze alternativne styly IE nevie - ved ten javascriptovy prepinac ich v pohode zvlada. Ak ich nenacitava pri starte, tak budiz, nenacitava ale prepinadlo funguje.

    Mne osobne je javascriptovy prepinac sympatickejsi ale je to vec priorit ;-) (prepis mi to prepinadlo z PHP do perlu a budem ta milovat) ;-)

    Opera je tam identifikovana preto, lebo cely prepinac som len prevzal a nie napisal osobne ja ;-) a predpokladal som, ze Opera ma prepinadlo stylov rovno v menu ;-) vcelku rad updatnem javascriptovu kniznicu tak, aby fungovala aj v Opere, takze mi posli novu verziu ;-) diky moc ;-)

  3. 3 Radek Hulán 23.08.04, 10:08:51
    FB

    [1] styl pro tisk má většinou jen pár set bajtů, ne?

  4. 4 notfound 23.08.04, 11:08:00
    FB

    [3] Muj styl ne, protoze byl vcera delany tak nejak na rychlo, jenom aby to tam bylo, dnes (nebo spis zitra) se do neho pustim a vyhazim z nej zbytecnosti.

  5. 5 Roman 24.08.04, 12:08:18
    FB

    Podla mna maju pravdu obe strany. Inak ale podla mna tento spot vlastne nic neriesi.

  6. 6 Radek Hulán 24.08.04, 12:08:23
    FB

    [5] hm, mraky webů používají alternate stylesheet, aniž vůbec tuší, že browsery třeba 10 CSS souborů natahují na lince, i když potřebuji jen jeden. To je nic? ;)

  7. 7 rony 24.08.04, 01:08:11
    FB

    [6] ale tento fakt je uz znamy - proste vyplyva to z podstaty - ak je style media vyhovujuce zariadeniu tak sa nacitava. ved je absolutne bezne si namiesto jedneho CSS nacitavat trebars 2-3 kvoli logickemu rozdeleniu - napriklad kostra layoutu v jednom, vyfarbenie a ide upravy vzhladu v druhom a cojaviem treti na prilis casto modifikovany obsah.

    Nakoniec - prehliadac si tie CSS stiahne do cache, co je aspon aka taka zaplata. Mozno by stalo za rec prediskutovat moznost aby prehliadace zlepsili podporu pre alternativne styly napriklad tym, ze si zapamataju, ktory si pouzivatel vybral, aby si to clovek nemusel riesit cez cookie. Ale to plati rovnako pre Operu ako pre Mozillu, IE nespominam, ti nikdy nedali na hlas webdesignerskeho ludu ;-)

  8. 8 Štefan Húska 24.08.04, 01:08:34
    FB

    Pixy má na to tiež vlastný skript, ktorý som integroval do weblogu vo Word Presse. Písal o ňom 7. listopada 2003.

    Teraz mám však Blog:cms, a tam už switcher je ;-)

  9. 9 Radek Hulán 24.08.04, 07:08:38
    FB

    [7] Rony, já tu ale nepíšu o stylesheet, ale alternate stylesheet. Ty normálně nejsou potřeba, naprostá většina uživatelů je nikdy nevyužije, přesto je prohlížeč načítá ;)

  10. 10 rony 24.08.04, 11:08:37
    FB

    Ano ale ved alternate stylesheet VIES napisat len ako diffy k povodnemu. Cize ti moc neozihaju linku ;-)
    Samozrejme pokial menis radikalne vzhlad, tak je to ine ale napriklad tvoje caste zmeny ci ponukany set vzhladov su len jednoduchucke upravy toho isteho. Na to kompletnu vymenu CSS netreba.

    Pokial by to boli zmeny v style Zen Garden, potom nic nepoviem ale takto sa len mlati zbytocne seno ;-)

  11. 11 Radek Hulán 24.08.04, 12:08:20
    FB

    [10] Rony, proč prostě neuznáš, místo těch self-promotional nesmyslů co píšeš, že obecně je alternate stylesheet dobré nepoužívat? ;)

  12. 12 Roman 24.08.04, 05:08:59
    FB

    Ja presne nechapem kam mieris. Ale dobre pouzitie pre alternativne stylesheety je trebars urcenie media. Obrazovka/Tlac, ale to si asi nemal na mysli. Takze suhlasim ze mat 5 roznych (javascriptom prepinatelnych stylov ktore je treba vzdy nahrat) len preto aby stranka bola zaujimava samozrejme (vo vseobecnosti) nema ziadny ucel a je to tudiz kontraproduktivne.

  13. 13 Vilém Málek 24.08.04, 09:08:52
    FB

    Myslím, že Honza Dudek rozebral ve svém seriálu alternativní styly dostatečně, viz http://interval.cz/serial.asp?serial=54... ;–)

  14. 14 Radek Hulán 24.08.04, 10:08:05
    FB

    [13] ten článěk Honzy Dudka, sekce PHP, byl psaný dost, ehm, špatně, pár hodin nato jsem publikoval lepší verzi ;)