Zprávičky s nálepkou CSS

O CSS preprocesorech LESS i SASS jsme už psali (LESS: stejné CSS za méně peněz, CSS preprocesory: méně psaní, vyšší efektivita) a nedávno o nich psala i česká blogerská scéna. Pokud si je chcete vyzkoušet online, podívejte se na css2less.cc nebo… Více

O responsive designu jste mohli opakovaně slyšet nejen tady na Zdrojáku. Luke Wroblewski sestavil pět návrhových vzorů (čili jakýchsi univerzálních řešení, která můžete opakovaně používat na řadě svých projektů), se kterými se při použití… Více

Pěkný demonstrativní úvod do základních technologií z rodiny CSS3 pod názvem Vzhůru do CSS3 vytvořil Martin Michálek. Najdete v něm ukázky základního použití a odkazy pro další informace. Materiály jsou dostupné pod licencí Creative Commons By 3.0… Více

Twitter používá, stejně jako mnohé další velké weby, vlastní kodérský framework a k němu sadu pravidel pro vytváření stránek a uživatelských rozhraní (Coding standard, coding rule). Jejich CSS framework se jmenuje Bootstrap, je dostupný na Githubu… Více

Nástroj CSS Lint slouží ke statické analýze CSS stylopisu a měl by patřit do základní výbavy webkodérů. Sadu hlášených doporučení si můžete přizpůsobit vlastním potřebám, v plném nastavení hlídá CSS Lint kromě syntaktických chyb například… Více

Kodérům může přijít vhod článek Safe CSS Hacks, který sumarizuje některé známé CSS hacky pro různé verze Exploreru a vybírá z nich ty „bezpečné“. Dozvíte se, jak bezpečně rozlišit různé verze IE, „ohackovat“ vlastnosti a jaké má jaký hack výhody či nevýhody. Více

Nové „experimentální“ vlastnosti v CSS, které testují výrobci prohlížečů, shrnuje článek na Smashing Magazine. Mnohé z nich se pravděpodobně ani nerozšíří, přesto jsou zajímavé a je dobré o nich vědět. Příkladem mohou být -webkit-mask či… Více

HTML5Boilerplate a další „vzorové“ HTML5 stránky jsou, i přes brblání „pravověrných webdesignérů“, přijatelnou alternativou pro velké množství webařů. Komplexnějším bratrancem Boilerplate může být např. framework G5 – přichází s připravenými… Více

Jistě znáte Media Queries, technologii, která v CSS3 dokáže určit vlastnosti zařízení, pro které se má styl použít. Pro prohlížeče, které MQ nepodporují nebo pro specifické případy lze použít malý (756 bajtů) JS kód, který podobným způsobem… Více

LESS je populární preprocesor CSS, který do něj přináší možnost použít „proměnné“ (variables) nebo „makra“ (mixins) (abychom se drželi terminologie použité v článku o LESS na Zdrojáku). Balíček Bootstrap.less vytvořil Mark Otto, designer pracující… Více

CSS frameworky vzbuzují mezi mnoha webdesignéry kontroverzi. Na jejich klady a zápory se podíval Oleg Mokhov v článku na serveru Speckyboy. Více

Zajímavý cíl má framework Treesaver – pomocí standardních webových technologií (HTML, CSS, JS) vytvořit online podobu časopisu. Treesaver nabízí známé prohlížení „po stránkách“, listování a další funkce, které jsou většinou řešeny nějakými… Více

Na nejbližší budoucnost CSS, tedy především na CSS3, se zaměřil podrobněji článek ve známém Smashing Magazine. Popisuje novinky, které jsou už ve velké části prohlížečů implementovány, a s nimiž se webdesignéři a kodéři začínají pravidelně potkávat. Více

Pokud znáte např. LESS, není vám princip CSS preprocesorů cizí. S radikálním přístupem přichází Stylus – kromě funkcí, proměnných a operátorů zavádí i jinou syntaxi, která je založená na odsazování bloků, takže mizí složené závorky, čárky… Více

Kodéři HTML/CSS jistě znají „CSS Resety“, a mnohým nebude jistě neznámé jméno Eric Meyer. Jeho CSS Reset jistě někteří z čtenářů používají. Teď, po dvou letech, vydal Eric novou verzi, „CSS Reset 2.0“, která zohledňuje posun značkovacích jazyků v poslední době. Více

Kompatibilita prohlížečů je věc spíš vysněná než reálná. V praxi každý kodér zjistí, že se prohlížeče od sebe liší. Technicky správným způsobem, jak k těmto odlišnostem přistoupit, je detekovat možnosti prohlížečů a jim přizpůsobit zobrazované… Více

Pokud jste si už dostatečně vyhráli s uživatelským rozhraním Windows 3.1, můžete zkusit iPad Simulator. Nečekejte plnohodnotnou funkčnost, ale po vizuální stránce a ovládáním jde o poměrně věrné napodobení, které může být inspirací pro vlastní aplikace. Více

Bookmarklet cssess hledá ve stránce nepoužité CSS selektory. Kromě toho, že taková funkce může být užitečná pro ladění CSS, je zmíněný bookmarklet i zajímavou ukázkou vytváření bookmarkletů, kdy ve vlastním odkazu je jen funkce pro vložení tagu… Více

Známý online Smashing magazín přichází s inspirativními novinkami – tentokrát přinesl 50 nových rad, tipů a triků s praktickou ukázkou, a to jak v CSS, tak i v CSS3. Výklad jednotlivých položek je doplněn i praktickou ukázkou a možností stáhnout kód. Více

Server Smashing magazíne nedávno uveřejnil na svých webových stránkách pět užitečných rad a tipů pro jQuery. Tipy a rady jsou dokumentovány jednoduchým kódem, ukázkou i možností stažení. Více

JavaScriptová knihovna CSSOM funguje jako parser CSS souborů, který převede klasický zápis pravidel v CSS na „objektovou podobu“, definovanou v návrhu CSS Object model. Více

Před časem jsme si zde představili CSS preprocesor LESS. Jak jej vhodně a efektivně použít na serveru, nastavit cachování a udělat jeho použití transparentní ukazuje článek na serveru Nettuts+ Více

LESS je nadstavba nad CSS, která zavádí některé prvky známé z programovacích jazyků, jako jsou např. proměnné či makra. Na blogu Design Shack vyšel tutoriál Introducing the LESS CSS Grid, který se zabývá návrhem designérské mřížky (gridu)… Více

Addy Osmani na svém blogu zveřejnil tutorial pro vytváření efektních „kruhových“ galerií. Celý efekt je udělán pomocí CSS a frameworku jQuery. Více

Na blogu Noupe vyšel článek, v němž je vyjmenováno 40 online nástrojů pro webové designéry. Mezi nimi nalezneme i původem český nástroj Color Scheme Designer od Petra Staníčka. Více

Zkrášlování kódu („prettify“ – postup opačný k obfuskaci) není pouze záležitost estetická; hezky zapsaný kód je především lépe čitelný a tím i snáz pochopitelný. Zkrášlení souborů pomůže leckdy i odhalit pozapomenuté úpravy. Pokud chcete takto… Více

Tak trochu jako doplněk předchozí zprávičky může působit odkaz na zajímavé řešení, publikované na webu Impressive Webs. Ukazuje, jak lze udělat přepínání obsahu (zhruba funkce tabů), které běžně řešíme JavaScriptem, pomocí HTML a CSS. Tento postup… Více

S nástroji, které umí vytvořit kostru webu a patřičné HTML/CSS soubory na několik kliknutí jsme se už setkali. Dalším takovým je InstantCSSCode. Umožní vybrat z různých typů HTML, můžete si zvolit JS framework či přípony souborů. Po odeslání si… Více

Seznam nejčastějších chyb, kterých se dopouštějí kodéři při psaní CSS, přináší článek 12 Common CSS Mistakes Web Developers Make. Mezi chyby řadí nedostatečný (nebo žádný) CSS reset, příliš specifické selektory, redundantní pravidla, nerespektování… Více

Na serveru CSS Tricks vyšel článek, popisující možnosti stylování a úprav HTML elementu Textarea. Od prostého obrázku na pozadí, které zmizí, jakmile uživatel začne psát (víte že HTML5 na to má atribut „placeholder“?) až po přidání či zakázání… Více