Manuál stylopisů (a jednoduchost CSS můžeme zase chválit)
Jak se ve změti CSS pravidel webového projektu dobrat systému, který bude snadno přenositelný na jiného člověka? Jak to udělat s technologií, jejíž esencí je jednoduchost? Supergeeky proklínaná a amatéry zbožňovaná vlastnost kaskádových stylů.
Jednoduchost technologie špatný kód neospravedlňuje
„Ach, kdyby jen specifikace CSS obsahovala proměnné!” a další geekovské povzdechy si můžeme odpustit, protože a) právě teď nic takového CSS neobsahuje a b) není jisté, že by to CSS bordelářům skutečně pomohlo. Myslím si, že jednoduchost je velmi dobrá vlastnost jakékoliv technologie, CSS nevyjímaje.
Hezky to dříve popsal Honza Sládek, takže pro argumenty zajděte k němu. My můžeme pokračovat směrem k návrhu řešení palčivé otázky.
Jak z jednotlivých opakujících se pravidel extrahovat informaci o typech písem, barvách či layoutu obecně používaném na webu tak, aby stylopisy splňovaly alespoň základní parametr udržovatelnosti — že jim bude rozumět sám autor, když se ke své práci za tři měsíce vrátí?
Jelikož se snažím se upřednostňovat jednoduchá řešení a vyhýbat se vrstvení technologií, z našich úvah vyřazuji CSS preprocesory jako LESS, čímž ale neříkám, že pro ně nevidím uplatnění.
Poněkud tupý, přesně takový jaký jej chceme — manuál stylopisu
Po mnoha pokusech se mi nakonec obrovsky osvědčila úplně nejtupější varianta — manuál v externím souboru. V adresáři se stylopisy u každého svého projektu najdu soubor README.txt, ve kterém všechny potřebné informace jsou. Kdykoliv pak na webu vytvářím nový prvek, podívám se sem a zjistím jaké by měl mít vlastnosti.
Obsah manuálu
Pojďme se podívat co takový manuál stylopisu může obsahovat.
- Kontakty na autora
- Seznam souborů a jejich obsah
- Písma a jejich varianty
- Index z-indexů
- Barvy a jejich varianty
- Rozměry opakujících se prvků laoyutu
Než plýtvat detaily, odkážu vás na tři své manuály stylopisu, které jsou součástí projektů vyrobených v Shortcat studiu.
BioOKO
Pražské jaro
Hipposdesign.com
Jedna část manuálu tedy nahrazuje velmi málo se vyskytující manuály designu a také vizuální identity. Další část supluje nedokonalost CSS jako technologie — například pro varianty barev budeme moci brzy začít široce využívat RGBa. Index z-indexů a varianty písem zase sjednocují na jedno místo informace, které bývají rozptýlené po různých pravidlech ve stylopisu.
Manuál stylopisu v žádném případě nenahradí dobře organizovaný, komentovaný a srozumitelně psaný CSS kód. Přidává vrstvu abstrakce, kterou kaskádové styly neumožňují.
Milí čtenáři, více než jindy zde ocením váš feedback a vlastní zkušenosti se správou CSS.