WebExpo 2021 obrazem
Po roční nucené přestávce se letos v Praze konal třináctý ročník největší konference o webu ve střední Evropě. Novinkou byla hybridní forma akce, jíž se část návštěvníků i přednášejících účastnila online.
Browserslist: užitečný nástroj, který funguje jinak, než jste si možná mysleli
Jako frontendoví vývojáři se u každého projektu rozhodujeme, které prohlížeče (a v kterých verzích) budeme podporovat a jaké technologie tím pádem můžeme použít. Dohoda se vytesá do kamene zvaného Browserslist. Ten ale možná funguje jinak, než jste čekali.
Jak se ze mě stal front-end developer
Určitě znáte nejednoho developera, který přešel do vývoje z jiného oboru. V mém případě to byl design. Zvolila jsem kombinaci několika přístupů, které se nakonec osvědčily a dovedly mě k vytoužené pozici front-end developera. Doufám, že můj příběh pomůže někomu dalšímu ke stejně zdárnému konci.
Bootstrap 5: první dojmy
Vyšel Bootstrap 5. Zatím sice jen v beta verzi, ale i ta už by měla být použitelná na vážněji míněných projektech. Podívejme se, co pátá verze nejpopulárnějšího CSS frameworku přináší.
Jak zlepšit kvalitu kódu pomocí 5 jednoduchých principů
Dost už bylo špagety kódu. Vydejte se vstříc udržitelnosti a mějte své projekty na úrovni s využitím Software Design Principles. Název může znít vznešeně, ale nenechte se zmást. Nejedná se o nic jiného než aplikování selského rozumu v programování.
Co jsou Sass moduly a jak @use a @forward zlepší váš kód
Sass moduly mění způsob práce se soubory. Nejsou novinkou, představeny byly před více než rokem. Nově je však Dart Sass jedinou oficiální implementací Sassu. Nucená migrace je příležitostí s moduly začít. Přinášíme podrobného průvodce migrací, zapojením Sass modulů a řešením nejčastějších chytáků.
Jak funguje CSS Box Model
Věděli jste, že existuje mezinárodní den box-sizingu? Vlastnosti padding, border a margin sice nejsou raketová věda, ale některé jejich kombinace a chování v určitých situacích dokáží zamotat hlavu i zkušeným kodérům. Pojďme si proto připomenout definici těchto základních stavebních prvků CSS.
Hledá se kodér! Co vše by měl umět?
Shánět v dnešní době kodéra není jen tak. Nástroje, metodiky, ale i standardy, které by měl znát, kvapem přibývají. Co ve skutečnosti tato pozice obnáší a co dělá z dobrého kodéra ještě lepšího?
Progresivní webové aplikace, díl II. — Jak zlepšit performance metriky a fungovat i offline?
I s elementárními znalostmi JavaScriptu můžete během chvíle vylepšit svůj web a poskytnout uživatelům prožitek, který znají z nativních aplikací. V pokračování minisérie o PWA se dozvíte, jak umožnit instalaci aplikace na domovskou obrazovku nebo jak začít web vykreslovat výrazně rychleji.
Budoucnost je v no-code aneb Proč květinářství nepotřebuje web na míru
Většina lidí nepotřebuje drahý web na míru, ale levné hotové řešení. Jejich potřeby a zadání se totiž stále opakují. A co se opakuje, to je výhodné dělat sériově. Vítejte v no-code webdesignu.
Proč je ITCSS nejpokročilejší metodika organizace CSS
Psát CSS je snadné. Díky tomu dokážeme snadno nastylovat malé dokumenty a nemusíme se zdržovat formalitami. Na velkých projektech si ale s tím samým přístupem vylámeme zuby. Potřebujeme řád a organizaci. Jak zorganizovat CSS, aby i ve velkém měřítku fungovalo stejně úžasně jako v tom malém?
Bootstrap v předvečer páté verze
Aktualizováno 9. 12. 2020 | Bootstrap je bezkonkurenčně nejpoužívanější frontendový framework. Vydání jeho páté verze se blíží a kromě evolučního posunu přinese i jednu dlouho očekávanou přelomovou změnu.
Nejméně 4 důvody, proč začít používat Variable Fonts
Pokud se alespoň okrajově zajímáte o typografii, asi vám v poslední době neunikl nový technologický mezník v podobě Variable Fonts. Od jejich oficiálního uvedení uběhly více než tři roky, ale kam se poděly?
Webdesign bez kódu
Webdesign se za posledních 20 let několikrát podstatně změnil. Dlouhou dobu byla tvorba webů doménou technicky zaměřených lidí, to se však postupně mění. Vznikají nové nástroje, které zásadně mění pravidla hry, protože umožňují i méně technickým lidem tvořit stejně kvalitní weby, bez kódu.
Progresivní webové aplikace — co to je a kdy má smysl se o to zajímat?
Až 53 % uživatelů opustí web, pokud jeho načtení trvá déle než tři sekundy. Chcete zlepšit uživatelský prožitek z webové aplikace a zvýšit její návštěvnost? PWA může být řešením, které šetří čas i peníze.
Komentáře v CSS kódu: kdy pomáhají a kdy škodí
Na počátku každého komentáře bývá ušlechtilý úmysl: pomoci těm, kdo přijdou po nás. Dobře postavený komentář skutečně může významně pomoci. Přesto je většina komentářů v kódu zbytečná, odvádí pozornost a v krajních případech může mít i devastující účinky. Jak můžeme kód místo komentování vylepšit?
Dark mode s CSS custom properties: přístupnost v atraktivní podobě
Dark mode, tmavý režim, night shift — v poslední době často skloňované pojmy, umocněné podporou tmavého režimu v novém iOS 13. Ukážeme si, jak upravit svůj web pro dark mode čistě s pomocí CSS.
Konzultanta potřebujete najmout předtím, než víte, že ho potřebujete. Velký rozhovor s Harrym Robertsem
Harry v rozhovoru nechal nahlédnout do své práce konzultanta. Prozradil, jak pracuje s lidmi, proč se věnuje webové rychlosti i co si myslí o AMP nebo CSS v JavaScriptu.
WebExpo 2019 obrazem
Dvanáctý ročník největší konference o webu ve střední Evropě právě skončil. Téměř čtyři dny nabité řečníky, workshopy a parties (někdy i na jevišti). Vše zarámované atmosférou historického centra Prahy.
Jak neztratit půl dne života kvůli středníku
Přišli jste někdy o hromadu času hledáním chyby, abyste zjistili, že máte v kódu špatně středník? Nebo závorku, či snad překlep v názvu proměnné? Klidně bych se vsadil, že ano, prostě tomu někdy neutečete. Nicméně můžete jít tomu štěstíčku trochu naproti. Ano, bude řeč o debugování.
SUIT CSS versus BEM
Jestli ve svém projektu používáte nějakou metodiku organizace CSS, velmi pravděpodobně to bude BEM. SUIT CSS je metodika méně známá, v mnohém ale o dost zajímavější. Jak BEM obstojí proti SUIT CSS?
CSS grid pro mikro layouty
Říká se, že flexbox je nástroj stvořený pro malé layouty. Jeho mladší, zato pokročilejší bratříček CSS grid je zase tolik očekávaným řešením pro velký layout stránky. Co když ale dáme velikost stranou a zaměříme se na to, jaké druhy problémů mohou obě techniky řešit?
Převod designových principů do CSS
Jak s pomocí nejmodernějších CSS postupů důsledně převést designovou myšlenku do responzivního webu 1:1 a bez kompromisů. Hutná dávka responzivní typografie a baseline gridu v preprocesorech.
