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 18. června 2020 17:05
Návratový kód HTTP 304
RSS export naposledy zpracován 17. června 2020 08:55
Kontrola aktuálnosti naplánována na 18. června 2020 17:12

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é…

Vzhůru dolů | 17. 6. 2020 6:25 | #

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…

Vzhůru dolů | 15. 6. 2020 3:25 | #

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…

Vzhůru dolů | 10. 6. 2020 11:01 | #

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…

Vzhůru dolů | 8. 6. 2020 6:40 | #

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…

Vzhůru dolů | 2. 6. 2020 7:15 | #

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šší…

Vzhůru dolů | 26. 5. 2020 7:15 | #

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…

Vzhůru dolů | 18. 5. 2020 18:00 | #

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…

Vzhůru dolů | 18. 5. 2020 7:20 | #

Všechny e-booky i knížka jsou teď levnější

V aktuální právní a mediální vřavě kolem koronaviru trochu zapadlo snížení DPH na elektronické knížky z 21 na 10 %. Dva ze tří e-booků nabízených na Vzhůru dolů už navíc nějakou dobu neprošly aktualizací, takže ve snížení koncové ceny ještě trochu…

Vzhůru dolů | 11. 5. 2020 7:05 | #

Strukturovaná data (aneb Rich Snippets): Kódem za atraktivnější výsledky vyhledávání pro váš web

Strukturovaná data (nebo také „strukturované úryvky“) umí zajistit vizuálně zajímavý formát zobrazení ve výsledcích vyhledávání Google – „Rich Snippets“. Zjednodušeně řečeno do stránky přidáte nějaký kus kódu ve formátu JSON-LD, jako v tomto případě…

Vzhůru dolů | 5. 5. 2020 4:20 | #

21 tipů pro lepší uživatelské rozhraní od UX designéra

Instagram firmy Liquid Design patří odborně k těm nejužitečnějším v Česku. Jsem proto rád, že Marek Čevelíček, CEO & UX designér tohoto brněnského studia, přijal mou pozvánku k publikaci podobného formátu tipů zde, na Vzhůru dolů. „To záleží.“ Oblíbená…

Vzhůru dolů | 29. 4. 2020 8:26 | #

Poměr stran obrázků jednoduše (pomocí atributů WIDTH a HEIGHT ve značce IMG)

Nedávno jsem na Vzhůru dolů publikoval text o nastavení poměru stran pro obrázky, video, iframy a další obsah vkládaný do HTML zvenčí. Říkejme mu média. Problém je v tom, že prohlížeče vykreslují stránku dříve než jsou tyto prvky stažené. Pokud neznají…

Vzhůru dolů | 27. 4. 2020 6:35 | #

Značka : Vše o vkládání JavaScriptu do HTML

Tentokrát to v příručce vezmeme opravdu od základů, ale do hloubky. Pojďme se zaměřit na vkládání JavaScriptu do stránky. Obsah: Značka SCRIPT Vložení do stránky Datové bloky Značka NOSCRIPT Značka se používá pro vložení javascriptového kódu nebo…

Vzhůru dolů | 21. 4. 2020 7:45 | #

Podcast: Se Zuzanou Šumlanskou a Honzou Králem o práci na dálku

Počet pracujích z domova před měsícem nuceně skokově narostl. A práce z domova není jednoduchá. Naštěstí se s námi Zuzka a Honza podělili o své zkušenosti. Jak se doma motivovat? Je potřeba vlastní kancelář? Jak se vrátit z pracovního režimu? A co je…

Vzhůru dolů | 16. 4. 2020 5:50 | #

„Pixel perfect“ by měl být zakázaný výraz

Nepoužívejme prosím ve webdesignu spojení „pixel perfect“, když mluvíme o kvalitách návrhu nebo kódování webu. Je to výraz zastaralý, nesmyslný a degradující dobré designéry i kodéry. Designér Lukáš Augusta napsal skvělý článek plný tipů na oblasti,…

Vzhůru dolů | 14. 4. 2020 7:01 | #

Vkládání JavaScriptu jako async, defer a type="module" versus rychlost webu

Existuje několik možností, jak vložit JavaScript do HTML kódu. Z pohledu rychlosti načítání je ale u statických webů jeden úplně nejhorší – vkládání do bez jakéhokoliv dalšího nastavení: (Vynechme nyní prosím pro zjednodušení, že existují situace, kdy…

Vzhůru dolů | 6. 4. 2020 6:45 | #

ECMAScript moduly: Co je schované za ?

ES modul (občas budu název zjednodušovat jako javascriptový modul) je soubor obsahující javascriptový kód, který se vkládá do jiného souboru, obsahujícího javascriptový kód. Definici máme hotovou, jdeme domů? Ještě počkejte, slibuji, že v článku půjdu…

Vzhůru dolů | 30. 3. 2020 7:10 | #

CSS4: Proč chceme novou verzi kaskádových stylů a proč ji dosud nemáme?

Peter-Paul Koch navrhuje zavést zkratku CSS4 pro označení určitého stavu vývoje v oblasti kaskádových stylů. CSS4 v plánech W3C není. Konsorcium totiž přestalo verze jazyka vydávat někde u CSS 2.1, tedy v roce 2011. Proč tedy prosazovat pojem CSS4?…

Vzhůru dolů | 20. 3. 2020 7:15 | #

Práce z domova: Tipy, jak na home office nezblbnout (část první: denní režim a izolace)

Aktuální situace nás zahnala pracovat do koutů svých domovů. Tenhle, na Vzhůru dolů netypický text, proto věnuji hlavně těm, pro které je to nová situace. Z domova pracuji více než 10 let, přičemž od roku 2016 prakticky jen z domova, s občasnými…

Vzhůru dolů | 18. 3. 2020 7:40 | #

Nová metrika „Největší vykreslení obsahu“ (Largest Contentful Paint, LCP)

Nová metrika rychlosti webu – Largest Contentful Paint (LCP) – představuje přesnější způsob měření momentu, ve kterém se vykreslí hlavní obsah stránky. LCP se „dívá“, kdy byl prohlížeč zobrazil největší prvek ve stránce. Uživatelům tak pomáhá…

Vzhůru dolů | 13. 3. 2020 7:46 | #

Podcast: S Radkem Pavlíčkem o WCAG a zákonu o přístupnosti

Martin a Robin si do podcastu pozvali Radka Pavlíčka, odborníka na přístupnost, se kterým rozebírají normu WCAG, loňský zákon o přístupnosti, javascriptové aplikace a novou asociaci, o jejíž českou pobočku Radek usiluje. O čem mluvíme? Robinův tip: Yarn…

Vzhůru dolů | 9. 3. 2020 9:00 | #

10 bodů kritiky AMP: které jsou oprávněné a které ne?

„AMP je pro budoucnost webu dobré asi tak jako Trump pro zeměkouli,“ napsal nám jeden z kritiků. AMP budí někdy až přehnaně emotivní reakce. Některým bodům kritiky příliš rozumět není, některé jsou ale zajímavé a s některými dokonce souhlasíme. V dnešní…

Vzhůru dolů | 5. 3. 2020 6:30 | #

Jak v ContentKing děláme design systém za pomocí Sketche, InVision a Storybooku

Martin Pešout, frontendový vývojář z ContentKing vám v dnešním textu ukáže, jak vzniká jejich systém designu. Proč vlastně v ContentKing máme design systém? Rozhodnutí začít vytvářet dokumentaci komponent vzešlo ode mě. Potrpím si na detail a už nějakou…

Vzhůru dolů | 26. 2. 2020 9:30 | #

Systém designu v newsletterech? Ano, i to se dá zvládnout. Případová studie Kiwi.com

Tomáš Krejčí ze SUPERKODERS vám v dnešním textu ukáže svou práci na knihovně UI komponent pro newslettery úspěšného českého startupu. Ano, čtete správně — i pro vaše newslettery či jiné HTML e-maily lze připravit systém znovupoužitelných komponent. O…

Vzhůru dolů | 14. 2. 2020 14:10 | #

Rozhovor S Riki Fridrichem o chystaném Vue.js 3 a Composition API

Nová, třetí verze populárního frontendového frameworku tvoří v komunitě nepřehlédnutelné téma. Zeptali jsme se tedy Rikiho Fridricha, lektora našich javascriptových školení, co si o tom myslí on. Novinky ve Vue 3: Hlavně Composition API a TypeScript…

Vzhůru dolů | 3. 2. 2020 6:20 | #

Rodina vlastností text-decoration v CSS (nejen pro podtržení odkazů)

Když se pustíte do studia dříve jednoduchých vlastností v CSS, můžete být překvapení jejich robustností (a pro někoho také přílišnou složitostí). To se stalo i mě právě teď u vlastnosti text-decoration. Pojďme to vzít ovšem čistě pragmaticky, jako…

Vzhůru dolů | 29. 1. 2020 5:26 | #

Nově na školeních: dvoudenní balíčky s výhodnější cenou

Zbrusu nové balíčky kurzů vám umožní absolvovat jednotlivé dny najednou nebo postupně. A ještě k tomu ušetřit. Na dvoudenní školení se ptáte celou dobu, kterou se organizací kurzů zabýváme. Vícedenní kurzy někdy dávají smysl – jsou témata, u kterých se…

Vzhůru dolů | 27. 1. 2020 9:40 | #

Podcast: Speciál o frontendových technologiích roku 2019

Po roce si opět Martin s Robinem sedli, aby probrali ty nejdůležitější změny a novinky roku 2019. Dokonce se odhodlali k několika předpovědím do riku 2020. Dotknou se konce IE11, výsledků průzkumu State of JS a nebo také nástroje Lighthouse. Povídají si…

Vzhůru dolů | 21. 1. 2020 6:20 | #

Použití preconnect & dns-prefetch pro včasné připojení k doménám třetích stran a zvýšení rychlosti webu

Docela často se stává, že na stránce potřebujeme stahovat prvky z jiných domén než je ta hlavní, na které web běží. Prohlížeč ovšem musí pro každou novou doménu zjednodušeně řečeno navázat spojení. A je blbé, když to dělá mnohokrát během procesu…

Vzhůru dolů | 15. 1. 2020 6:40 | #

Optimalizace rychlosti komponent třetích stran: Když se chce, všechno jde

Komponenty třetích stran (third parties nebo také 3P) nám zpomalují weby. To víme. Ale skutečně jsme jako vývojáři proti nim tak bezbranní, jak si občas myslíme? V posledních měsíci jsem měl to štěstí (s ironií i bez), že jsem u několika klientů řešil…

Vzhůru dolů | 9. 1. 2020 6:00 | #