Vzhůru dolů
Základní informace o zdroji
| Podtitulek | Současný webový frontend. |
|---|---|
| Domovská stránka | https://www.vzhurudolu.cz/ |
| RSS export | http://feeds.feedburner.com/vzhurudolu_clanky |
Systémové informace o zdroji
| ID | 139 |
|---|---|
| Jmenné ID | vzhurudolu |
| Články ručně přidává správce systému | NE |
| Články jsou schvalovány správcem | NE |
| Titulek zdroje stahován z RSS exportu | ANO |
| Kontrola aktuálnosti proběhla | 16. ledna 2021 03:10 |
| Návratový kód | HTTP 304 |
| RSS export naposledy zpracován | 11. ledna 2021 06:05 |
| Kontrola aktuálnosti naplánována na | 16. ledna 2021 03:20 |
CSS Multiple Column: Příručka pro vlastnosti vícesloupcového rozložení
Díky vlastnosti column a dalším definovaným v sadě modulu CSS Multi-column Layout můžeme obsah vysázet do více sloupců definované šířky podobně jako v novinové sazbě. Související CSS Grid Flexbox CSS Box Alignment Na rozdíl od podobných layoutových…
To nejlepší z roku 2020 na Vzhůru dolů: populární technologie, články a podcasty
Čtete rozšířenou verzi textu, který jsem psal pro prosincový newsletter. Rok 2020 byl samá změna. Jen měla často podobu komplikace. Nevím jak vám, ale mě se toho letos pracovně změnilo opravdu hodně. Víte, že skoro celý rok nebylo možné organizovat naše…
3 nová videa: NPM, Yarn a testování JS kódu
Nastříhali jsme pro vás tři nová videa. Jde o upravené záznamy hodinových webinářů, které vedl Riki Fridrich v loňském roce. Rok 2021 tak můžete začít investicí do svých znalostí – zde se konkrétně můžete naučit používat NPM, hlavně pro potřeby…
Speciál o trendech pro rok 2021 (druhá část vánočního dvojdílu podcastu)
Loni jsme na konci roku hodnotili změny a novinky zpětně, letos se pokusíme odhadnout trendy do roku 2021. Vybrali jsme pět oblastí a diskutujeme, jak moc ovlivní webový vývoj v příštích 12 měsících. A rovnou prozradíme, že padnou i nějaké palce dolů…
S Robinem a Martinem o Robinovi a Martinovi (první část vánočního dvojdílu podcastu)
Asi nás znáte. Ale možná úplně přesně nevíte, čím se zabýváme, a jak se to změnilo v roce 2020, kdy se změnilo skoro všechno. Řekli jsme si, že by mohlo být užitečné se trochu více představit, ještě než začneme další sezonu vysílání. To proto, abyste…
HTTP/3: Slibná nová verze protokolu, zatím ale jen s malou podporou
Třetí verze protokolu HTTP vypadá slibně. Zatím ji lze z pohledu webaře spíše jen po očku sledovat, na reálné použití si totiž na většině našich projektů zatím kvůli slabé podpoře asi počkáme. Na téhle stránce budu průběžně aktualizovat stav podpory…
Zarovnání boxů v CSS: Příručka pro všechny vlastnosti Box Alignment Module
Modul Box Alignment v CSS specifikuje zarovnání boxů v různých modelech rozvržení CSS: blokovém, tabulkovém, vícesloupcovém, flexboxu nebo Gridu. Související CSS Grid Flexbox Vícesloupcový layout Specifikace Box Alignment Module Level 3 v podstatě vzala…
Masonry v CSS a bez JavaScriptu: nativní podpora přichází
Rozvržení typu masonry je ve webdesignu populární jako zednická lžíce mezi zedníky. Kodérky a kodéři jsou ovšem dneska nucení jej dělat pomocí JavaScriptu. Nativní implementace v CSS byla součástí našich snů už od příchodu flexboxu, ale plně to…
Představujeme nový produkt – videa ze Vzhůru dolů
Milé čtenářky, milí čtenáři, po odvysílání našich webinářů jste se mnozí ptali, zda bude možné koupit si záznam. Teď už ano. :-) Představujeme prvních devět videí, které si na Vzhůru dolů můžete zakoupit. Jde záznamy z webinářů, upravené tak, aby se…
AVIF, nová generace obrázků pro web je tady
Chrome začal od verze 85 vcelku překvapivě a bez velkých oslav podporovat nový obrázkový formát AVIF. Inovativní formáty nás webaře zajímají hlavně z pohledu datové efektivity a nových vlastností. Obojí je zde splněno, takže se na AVIF pojďme podívat…
Průvodce formáty obrázků pro web: JPEG, WebP, AVIF, PNG, GIF a SVG
Nedávno jsem si dělal rešerši obrázkových formátů. Které je možné používat v dnešních prohlížečích nebo minimálně byl učiněn pokus o to, abychom je používat mohli? Rozhodl jsem se, že se s vámi o ni musím podělit. Kromě jiného jde o krásný přehled…
Dělená cache v prohlížečích: konec sdílení zdrojů jako CSS, JS a webfonty
Chrome přichází od verze 86 s takzvanou dělenou mezipamětí (partitioned cache), která znemožňuje sdílení zdrojů z CDN mezi weby běžícími na různých doménách. Aktuálně řada webů spoléhá na sdílení CSS, JS a webfontů ze společných adres, umístěných na…
S Borkem Bernardem o vývoji webů na JAMStacku
JAMStack se v roce 2020 vtírá do více a více týmů, projektů a – možná především – konverzací. V živém rozhovoru jsme se Borka Bernarda ptali na to, co to vlastně JAMStack je a nakolik je kompatibilní třeba s WordPressem nebo větším e-shopem. A taky…
Metrika Total Blocking Time (TBT), zaměřeno na pomalý JavaScript
TBT je metrika rychlosti webu, udávající celkový čas, ve kterém není vykreslená stránka schopná reagovat na vstupy uživatele. Přesněji vzato, TBT je celková doba mezi událostmi First Contentful Paint (FCP) a Time to Interactive (TTI), po kterou bylo…
Všechna školení proběhnou online (a přidali jsme volná místa)
Vzhledem k opatřením plánovaným od pondělka už nedává smysl pokoušet se organizovat školení prezenčně. Všechny termíny školení proběhnou online přes platformu Zoom. Je jasné, že mnozí z vás preferovali osobní setkání – stejně jako my – ale nedá se nic…
CSS vlastnost order a nebezpečí skrytá ve změně pořadí prvků
Vlastnost order nastavuje pořadí položky v kontejneru flexboxu nebo CSS Gridu. Občas se může kodérům a kodérkám hodit proto, že zajistí odlišení vizuálního pořadí položek od pořadí zdrojového vycházejícího z HTML nebo lépe ze stromu DOM. Jenže kouzlo…
S Markem Prokopem o CMS (a trochu také SEO a copywritingu)
Martin s Markem před podcastem zašli na oběd, aby sladili noty pro podcast o SEO. Dopadlo to tak, že si Martin, Marek a Robin povídají úplně o něčem jiném. CMS jsou důležitou, málo rozebíranou součástí práce na každém webu. Jak se Marek jako marketér (a…
Školení a pandemie: Aktualizace k podzimu 2020
Update: Všechna školení proběhnou online. Milí účastnící našich školení, situace kolem pandemie Covid-19 se opět zhoršila a tak je jasné, že i my musíme omezit provoz prezenčních školení chystaných na podzim. Aktuálně jsme se rozhodli pro tento krok:…
CSS vlastnost content-visibility a odložené vykreslení obsahu stránky
Už víme, že cílem CSS containmentu (a vlastnosti contain) je umožnit vylepšení výkonu prohlížeče poskytnutím předvídatelné izolace části DOMu od zbytku stránky. Vlastnost content-visibility je na tom postavená a vývojáři zjednodušuje práci a nenutí ho…
Parcel.js: Rychlý bundler s nulovou konfigurací. Seznamte se
Dnešní článek pro vás připravil Tomáš Smetka z Pobo Page Builder. Parcel.js slouží k vytváření balíčků (bundle) používaných na frontendu při vývoji webů a webových aplikací. Jde o nástroj podobné kategorie jako Webpack, Gulp nebo kdysi Grunt. Velkou…
Jak rychlé jsou AMP weby doopravdy? Záleží, kde je měříte
Text je ukázkou z e-booku Vzhůru do AMP. AMP se občas vytýká, že ve skutečnosti není tak rychlé, jak se rádo tvrdívá. V řadě konkrétních případů to může být pravda, ale při zobrazení v AMP Vieweru s přednačtením hledá tato technologie konkurenci opravdu…
Vlastnost contain v CSS: zapouzdřením k rychlejšímu vykreslení stránky
Vlastností contain označujeme části stránky, které jsou izolované od zbytku, proto, aby prohlížeč nemusel překreslovat celou stránku a ušetřil tak výkon. Prohlížeče se nějakým způsobem snaží nepřepočítávát vzhled celé stránky při každé změně samy. Kromě…
Lighthouse 6: Co přinesla nová verze zásadního testovače webů?
Google nedávno představil šestou verzi nástroje Lighthouse, který nám webařům poslední léta velmi dobře slouží k testování rychlosti, přístupnosti, technického SEO a dalších osvědčených postupů. V prohlížeči Chrome bude k dispozici už od připravované…
Metrika „Kumulativní posun layoutu“ (Cumulative Layout Shift, CLS)
Metrika, která udává stabilitu vzhledu stránky během vykreslování. Jedná se o jednu z metrik rychlosti webu, i když v tomto případě bychom mohli mluvit spíše obecněji o metrikách uživatelském zážitku (UX). CLS je velmi důležitá metrika, protože je…
Jak rychlý je váš web? Spouštíme nástroj PageSpeed.cz a nabízíme audity rychlosti
Ve spolupráci se SUPERKODERS dnes spouštíme službu PageSpeed.cz. Jde o nástroj, který měří rychlost webových stránek, přičemž klade důraz na metriky Web Vitals, které nedávno představil Google s tím, že je považuje za důležité pro každého provozovatele…
8 nových webinářů o rychlosti a JavaScriptu
Vážení čtenáři, v pátek jsme zveřejnili termíny zbrusu nových webinářů. V hodině času na nich dostanete spoustu informací k tématu od profi lektorů z praxe, možnost klást otázky a záznam k tomu. Úvodní běhy navíc otevíráme za zaváděcí cenu – 290 Kč bez…
Web Vitals: Co jsou zač ty nové metriky rychlosti webu od Googlu?
Web Vitals je sada metrik, které Google nově označuje za důležité pro sledování dobrého uživatelského zážitku na webu. Aktuálně je totiž měření rychlosti (a UX) webu poměrně složitá disciplína, ve které se stěží orientují specialisté (ke kterým se…
Preload: Přednačtení prvků stránky detailně a do hloubky
Preload je deklarace, které vyvolává dřívější stažení prvku stránky a v případě JavaScriptu odděluje stažení od spuštění. Vezměme jednoduchý příklad s webfonty. Můžeme jich v CSS mít nalinkováno více. Dva konkrétní soubory včak chceme stáhnout s vyšší…
Podcast: S Martinem Krištofem o frameworku Next.js
O frameworku Next.js píší jeho tvůrci jako o nástroji, který není třeba konfigurovat a ve kterém jedním příkazem spustíte svoji reactí aplikaci. Důraz na jednoduchost kombinovanou s flexibilitou si pochvaluje i Robinův bývalý kolega z LMC, Martin…
Novinka: Webináře o frontendových tématech, v prvním běhu zdarma
Je jasné, že i nám karanténa zkomplikovala organizaci školení. Ta dubnová a květnová jsme odložili na podzim, ale v současné situaci není nic jisté… Proto pracujeme na online produktech. A jako první jsme v newsletteru nedávno představili webináře…