Archiv

PHP2Shell: co se stalo s PHP a proč aktualisovat

Koho se týkají kritické chyby PHP2Shell, jak opravit PHP a prověřit napadení. Dopady na database, WordPress a staré projekty i názorné vysvětlení útoku.

23 minut

Přestal jsem používat Cursor a vrátil se k VS Code

Po třech letech s Cursorem jsem se vrátil k VS Code. Většinu práce zadávám Claude Code a pro ruční zásahy potřebuji spolehlivý editor.

2 minuty

Jak řešit nestabilní E2E testy

Proč jsou E2E testy nestabilní, jak je identifikovat a praktické tipy na jejich opravu.

8 minut

30 oblíbených promptů pro AI při vývoji

Výběr 30 praktických promptů, které pomáhají omezit halucinace, zjednodušovat kód, hlídat bezpečnost a zlepšit kvalitu PR.

3 minuty

Jak psát web a spravovat jeho obsah

Jakým způsobem publikovat a spravovat obsah na webu. Od sociálních sítí přes vlastní doménu až po výběr CMS.

6 minut

Jak detekovat anonymní režim v prohlížeči

Metody a techniky pro zjištění, zda uživatel používá anonymní režim (incognito mode) v prohlížeči.

7 minut

Vibe Kanban – orchestrace AI agentů pro vývojáře

Vibe Kanban je open-source nástroj pro řízení více AI kódovacích agentů paralelně. Kanban board, isolované git worktrees a code review na jednom místě.

4 minuty

Jak poznat, že byl obsah vytvořen umělou inteligencí?

Je možné s jistotou rozpoznat, že obsah vytvořila AI? Zjistěte, jaké jsou indicie a proč 100% detekce není možná.

4 minuty

Redesign webu pomocí AI

Jak udělat redesign webu za jeden den. Stačí AI nástroj, Git a Vercel.

5 minut

Programování ve VR – monitor nahradí brýle

Jak vypadá programování ve virtuální realitě? Přehled nástrojů, výhod a omezení práce s kódem ve VR headsetech místo klasického monitoru.

5 minut

Proč USB-C kabel nefunguje

Proč USB-C kabel nenabíjí notebook nebo nepřenáší data? Vysvětlení rozdílů mezi kabely, jak poznat kvalitní kabel a jaký USB-C kabel koupit.

8 minut

CSS item-pack: balance – vyvážené rozložení flex položek

Vlastnost item-pack: balance rozděluje flex položky rovnoměrně mezi řádky, podobně jako text-wrap: balance vyvažuje řádky textu.

7 minut

CSS Container Queries – responsivní komponenty

Jak pomocí @container, container-type a container-name vytvářet komponenty, které se přizpůsobí velikosti svého rodiče místo viewportu.

9 minut

Claude Opus 4.6: nový vlajkový model od Anthropic

Claude Opus 4.6 je nejnovější AI model od Anthropic s 1M kontextovým oknem, agent teams a adaptivním myšlením. Co přináší nového?

3 minuty

CSS Anchor Positioning – posicování elementů relativně k jiným

Jak pomocí anchor-name, position-anchor a funkce anchor() posicovat elementy relativně k jiným bez JavaScriptu.

3 minuty

Effect: Chybějící standardní knihovna pro TypeScript

Effect nabízí typově bezpečné zpracování chyb a čitelnější práci s asynchronním kódem.

10 minut

Centrování na webových stránkách

Moderní způsoby vertikálního i horizontálního centrování v CSS. Flexbox, Grid, margin auto a další techniky.

4 minuty

CSS Stacking Context – jak funguje vrstvení elementů a z-index

Jak stacking context v CSS ovlivňuje z-index, co vytváří nový kontext vrstvení a jak řešit problémy s překrýváním elementů.

4 minuty

IndexedDB – klientská database v prohlížeči

IndexedDB je nízkoúrovňové API pro ukládání velkého množství strukturovaných dat na straně klienta, včetně souborů a blobů.

4 minuty

Service Worker – offline web, push notifikace a cache

Service Worker je skript běžící na pozadí prohlížeče, který umožňuje offline režim, push notifikace a pokročilé cachování webových stránek.

4 minuty

Vite 8 – Rolldown bundler a přechod z Vite 7

Co přináší Vite 8, jak funguje nový Rust bundler Rolldown a jak migrovat projekt z Vite 7 na Vite 8.

4 minuty

Kapitálky – CSS small caps a verzálky

Co jsou kapitálky (small caps), jak se liší od verzálek a jak je použít v CSS pomocí font-variant a text-transform.

2 minuty

Object.defineProperty v JavaScriptu

Jak pomocí Object.defineProperty definovat vlastnosti objektů s přesnou kontrolou nad jejich chováním.

7 minut

Prompt injection – co to je a jak se bránit

Prompt injection je útok na aplikace postavené na velkých jazykových modelech (LLM). Jak funguje, jaké jsou jeho varianty a jak se proti němu bránit.

4 minuty

Microtask queue v JavaScriptu

Jak funguje microtask queue, event loop a v jakém pořadí se spouští asynchronní kód v JavaScriptu.

7 minut

Generátor náhodných čísel online

Online generátor náhodných čísel z libovolného rozsahu. Náhodné číslo jedním kliknutím + kód pro JavaScript, PHP, Python a další jazyky.

5 minut

Row Level Security: Zabezpečení na úrovni řádků v databasi

Co je Row Level Security (RLS), jak funguje v PostgreSQL a dalších databasích, praktické příklady použití a výhody oproti aplikační logice.

18 minut

Thunky v JavaScriptu

Co je thunk, jak funguje a k čemu se používá. Lazy loading, dependency injection, trampolining, testování a Redux Thunk.

7 minut

Clawdbot: open-source osobní AI asistent pro WhatsApp, Telegram a další

Clawdbot je open-source AI agent, který běží lokálně a komunikuje přes WhatsApp, Telegram, Discord nebo iMessage. Jak funguje?

7 minut

Fresh: Deno framework s islands architekturou

Porovnání Fresh frameworku s React/Next.js a Svelte/SvelteKit - build proces, runtime, reaktivita a šablony.

9 minut

Jak udělat input s automatickou šířkou podle obsahu

Několik způsobů, jak dosáhnout toho, aby se textové pole rozšiřovalo a zužovalo podle délky zadaného textu.

4 minuty

Optimistické mazání

Jak implementovat okamžitou reakci na uživatelské akce s optimistickým mazáním. UI vzor pro rychlejší aplikace.

6 minut

Race conditions v JavaScriptu

Co jsou race conditions, proč vznikají v asynchronním kódu a jak jim předcházet.

6 minut

TypeScript: Enum, union type, nebo as const?

Porovnání tří způsobů definování konstant v TypeScriptu. Kdy který použít a jaké jsou jejich výhody a nevýhody.

8 minut

Generátor hesla online

Online generátor silných hesel. Vytvořte si bezpečné heslo s nastavitelnou délkou a znaky.

12 minut

JSON – formát a online nástroje

Co je JSON a jak s ním pracovat. Online formátovač, validátor a diff.

4 minuty

Ralph loop: technika pro autonomní AI programování

Ralph loop je technika iterativního spouštění AI agenta v nekonečné smyčce. Agent pracuje samostatně, dokud nesplní zadaný úkol.

5 minut

OpenCode: open source AI agent

Alternativa ke Claude Code. Nabízí AI agenta přímo v aplikaci/terminálu s podporou více modelů.

3 minuty

Jak Vite sestavuje build

Jak Vite hledá soubory ke zpracování, proč převádí CommonJS na ESM a jak funguje v monorepu.

5 minut

Šířka znaků ve fontech

Proč mají znaky různou šířku a jak to řešit v responsivním designu.

5 minut

Agent Skills: rozšíření AI agentů

Agent Skills je specifikace pro definování schopností AI agentů. Jak funguje?

7 minut

Automatické sdílení článků na X a Facebook přes GitHub Actions

Jak nastavit GitHub Actions workflow pro automatické publikování nových článků na sociální sítě po deployi.

5 minut

Jak zrychlit GitHub Actions

Praktické tipy pro optimalisaci GitHub Actions pomocí paralelisace, composite actions a gh CLI

4 minuty

HTTP metody GET a POST

Kdy použít metodu GET a kdy POST. Rozdíly mezi metodami, datové limity a doporučení pro správné použití.

4 minuty

Preview článků přímo z Gitu

Jak zobrazit náhled článku z pull requestu bez čekání na build a deploy.

3 minuty

JSX a TSX

Syntaktické rozšíření JavaScriptu a TypeScriptu pro psaní HTML-like kódu přímo v JS souborech.

8 minut

Proč !== v JS není bezpečné pro porovnávání tajných řetězců

Operátor !== v JavaScriptu není constant-time. Při porovnávání hesel, tokenů nebo API klíčů to umožňuje timing attack.

4 minuty

CSS @starting-style

Jak animovat elementy při jejich prvním zobrazení pomocí at-pravidla @starting-style.

4 minuty

Metoda reduce v JavaScriptu

Kdy (ne)použít metodu reduce v JavaScriptu. Praktické příklady a srovnání s alternativami.

4 minuty

Checklist věcí, na které se při přechodu na nový iPhone zapomíná

Na co se nejčastěji zapomíná při migraci na nový iPhone? Bankovní aplikace, messengery, eGovernment služby a další aplikace.

5 minut

Egress: Odchozí datový provoz a jeho náklady

Co je to egress traffic, jak funguje v cloudu, proč za něj (ne)platíte a jak optimalisovat náklady.

4 minuty

Co je AI (umělá inteligence)?

Stručný úvod do AI, jak funguje a kde všude se s ní dnes setkáme.

8 minut

Jak vkládat 3D objekty na web pomocí Three.js

Které formáty použít, jak vytvářet modely pomocí AI a kdy raději použít obrázek nebo video.

5 minut

Co je SPF a jak chrání e-maily

Kompletní průvodce e-mailovou autentisací: SPF, DKIM, DMARC a BIMI. Naučte se chránit svou doménu před spoofingem a zlepšit doručitelnost e-mailů.

10 minut

AI slop: Nekvalitní AI obsah zaplavuje internet

AI slop je nekvalitní, hromadně generovaný obsah vytvářený umělou inteligencí. Proč se mu nevyhneme a jak ho poznat?

7 minut

Co jsou materializované pohledy a jak zvýší výkon database

Materializované pohledy jsou mocný nástroj pro optimalisaci databasových dotazů.

12 minut

Výpadek Cloudflare: Databasová chyba vyřadila tisíce webů

18. listopadu 2025 postihla Cloudflare čtyřhodinová porucha způsobená změnou oprávnění v databasi. Jednoduchý přehled, co se stalo a proč.

4 minuty

Google Antigravity: Nová AI vývojářská platforma

Google představil Antigravity - vývojářskou platformu s AI agenty poháněnou modely Gemini 3, Claude Sonnet a GPT-OSS.

4 minuty

Windows 10 bez podpory: Jaké máte možnosti

Podpora Windows 10 skončila 14. října 2025. Zjistěte, jaké možnosti máte.

8 minut

Zanořování nezanořitelných HTML značek

Jak funguje zanořování značek jako <p> nebo <button> v HTML parseru versus DOM metodách.

4 minuty

CSS pseudo element ::marker

CSS pseudo element ::marker umožňuje stylovat odrážky seznamů

2 minuty

Jak použít JSON‑LD pro AI a SEO

JSON for Linking Data je strojově čitelný formát pro publikování obsahu.

7 minut

Zobrazení dlouhé URL

Jak zobrazit dlouhé URL v aplikaci, aby nerozbila layout.

3 minuty

Jak neotravovat uživatele validací formulářů

Kdy zobrazovat chyby, kdy ne, a jak pomoci uživatelům místo jejich trestání.

3 minuty

Automatické načítání firemních údajů z registru ARES

Návod na získání dat o firmě z IČO nebo DIČ pomocí veřejné API a jejich použití pro předvyplnění webových formulářů.

2 minuty

Generování QR kódu

Co je to QR kód a jak ho okamžitě vytvořit pomocí jednoduchého online generátoru.

6 minut

Jak zjistit návštěvnost cizího webu

Přehled metod a nástrojů, jak si udělat realistický obrázek o návštěvnosti konkurenčního webu.

5 minut

Převody souborů a dat přímo v prohlížeči

Jak převádět obrázky, textové formáty v prohlížeči pomocí JavaScriptu – bez odesílání dat na server.

3 minuty

Zvláštní znaky na české klávesnici

Jak na běžné české klávesnici pohodlně programovat a zapisovat všelijaké speciální znaky?

3 minuty

Převod písmen na VELKÁ a malá

Převedení textu na velká nebo malá písmena.

5 minut

Safari: co by měl vědět frontend vývojář

Shrnutí historie, rozdílů a testování Safari v praxi.

4 minuty

Parsování čísel v JavaScriptu: správně a bezpečně

Funkce pro práci s čísly parseInt, Number, NaN, doporučení a ukázky.

6 minut

Postupné vylepšování

Postupné vylepšování je postup tvorby webu, kdy se začíná nejprve s podporou nejprimitivnějších zařízení.

4 minuty

Možnosti stylování <iframe>

Co lze a nelze u <iframe> ovlivnit pomocí CSS a jak na změnu textu nebo barev.

3 minuty

Zvýraznění aktivní sekce při rolování

Moderní způsoby zvýraznění aktivní položky navigace podle aktuální sekce – CSS i IntersectionObserver.

1 minuta

CSS funkce random()

Jak v CSS generovat náhodné hodnoty pomocí random() a kdy ji použít.

3 minuty

Pravidlo dvou

Jak používat pravidlo dvou pro efektivní psaní dobrého kódu

2 minuty

SPA přístup pro obsahové weby

Jak vytvořit obsahový web s dynamickým načítání obsahu bez obnovení celé stránky.

6 minut

CMS založené na Gitu

K čemu jsou dobré redakční systémy postavené na Gitu.

6 minut

Kolik monitorů potřebujete pro vývoj webů?

Jakou konfiguraci monitorů zvolit pro co nejefektivnější vývoj webů.

5 minut

HTML značka <keygen>

K čemu sloužila HTML značka <keygen>.

4 minuty

SvelteKit API dostupné z cizí domény

Jak povolit přístup na API vytvořené ve SvelteKitu z jiné domény.

1 minuta

Vložení CSS do stránky

Jakými všemi způsoby připojit CSS do stránky.

5 minut

Jak „focusovat“ správně díky :focus-visible

Jak správně řešit označený (:focus) stav formulářových prvků.

2 minuty

Poskakování obsahu akčních tlačítek

Jak vyřešit problém s poskakováním obsahu, když se změní textace nebo tučnost tlačítka.

3 minuty

Časovače v JavaScriptu

Jaké nabízí JavaScript možnosti pro vytváření animací. A jak docílit toho, aby byly plynulé.

7 minut

Prázdný řádek na konci souboru

Proč by textové soubory měly končit prázdným řádkem.

2 minuty

Má smysl měnit kursor tlačítek?

Tlačítka mají na webu po najetí jiný kursor než odkazy.

2 minuty

Detekce otevření DevTools

Jak zjistit, že se na stránce otevřely vývojářské nástroje.

4 minuty

JavaScript null a undefined

Rozdíly mezi null a undefined v JavaScriptu, kdy je používat a jak se vyhnout běžným chybám.

5 minut

Stylování <input type=number>

Jak stylovat <input> pro zadávání čísel.

2 minuty

Sleep v JavaScriptu

Jak implementovat sleep/delay funkcionalitu v JavaScriptu pomocí Promise a async/await

3 minuty

Proč nepoužívat fixní hlavičku

Proč se vyhnout fixování záhlaví/menu k hornímu okraji obrazovky.

4 minuty

Jak používat git rebase

Proč a jak používat git rebase pro přehlednou historii v Gitu.

3 minuty

JavaScript Battery API

Jak v JS zjistit stav baterie, co dnes funguje a kdy API nepoužívat.

1 minuta

Více Git větví vedle sebe

Jak spustit více větví jednoho repositáře vedle sebe.

2 minuty

Sdílení stránky přes Web Share API

Web Share API nabízí možnost sdílet odkaz na stránku nebo soubor přes rozhraní prohlížeče/systému.

3 minuty

Odeslání formuláře tlačítkem mimo něj

Jak odeslat formulář tlačítkem, které je mimo formulář.

2 minuty

Jak v praxi používat Git

Jak rychle a efektivně používat versovací systém Git.

5 minut

Query string v URL

Řetězec dotazu je část URL za otazníkem obsahující nejrůznější parametry.

6 minut

Znázornění možnosti scrollování

Jak dát uživateli informaci, že je možné někam scrollovat.

5 minut

Plynulé scrollování na obsah

Jak vytvořit plynulé odrolování na určitou část stránky.

4 minuty

Proč nemůže vlastní externí font fungovat

Vysvětlení proč není možné na webu používat vlastní externí písmo, které funguje správně.

6 minut

Různá šířka <input type=number> s min/max

Proč má <input type=number> různou výchozí šířku v závislosti na min/max atributech.

2 minuty

Výpis náhodného textu

Jak na stránce náhodně vypsat obrázek, odkaz, reklamu, text nebo cokoliv jiného.

3 minuty

13 důvodů, proč má web fungovat bez JavaScriptu i v roce 2025

JavaScript je sice klíčový pro moderní web, ale jeho selhání není výjimkou. Zde je 13 důvodů, proč by měl web fungovat i bez něj.

5 minut

Zvláštní znaky na české klávesnici v macOS

Jak v macOS na běžné české klávesnici pohodlně programovat a zapisovat všelijaké speciální znaky?

5 minut

Jak vybrat vhodnou doménu?

Doporučený postup výběru ideálního názvu domény pro nový web.

4 minuty

Jak funguje TanStack Query

TanStack Query elegantně řeší práci s daty stahovanými přes API.

5 minut

Poskakování stránky kvůli posuvníku

Jak zabránit, aby obsah stránky poskakoval v závislosti na posuvníku.

4 minuty

Zobrazování stránek v rámech s frame-ancestors

Pomocí CSP hlavičky frame-ancestors jde umožnit načtení stránky do <iframe>.

2 minuty

Stylování <input type=range>

Jak docílit vlastního vzhledu range „slideru“.

3 minuty

10+ věcí, jak AI pomáhá při programování

AI dokáže výrazně zvýšit efektivitu programátora. Nevezme mu ale práci?

5 minut

Parsování HTML v JavaScriptu

Jak v klientském i serverovém JS parsovat a upravovat HTML kód.

4 minuty

V jakém programu upravovat obrázky

Jaký program zvolit pro rychlou úpravu obrázků.

1 minuta

Získání unikátní barvy pro text v JS

Jak pro libovolný řetězec spočítat unikátní barvu.

2 minuty

UX políčka pro datum narození

Jak usnadnit uživatelům zadávání data narození.

3 minuty

JS podmínka v objektu

Jak v JavaScriptu zapsat podmínku uvnitř objektu.

1 minuta

Postman

Postman je software pro testování a volání API.

2 minuty

Získání přístupu k API přes mobilní aplikaci

Jak přes mobilní aplikaci získat přístup k neveřejnému API různých webů.

2 minuty

Build jednoduchého JS pro staré prohlížeče

Jak zajistit transformaci jednoduchého JavaScriptu i pro staré prohlížeče jako IE 11.

3 minuty

Jak skrýt posuvník v <iframe>

Jak pomocí CSS skrýt scrollbar u stránky vložené přes <iframe>.

1 minuta

Náhled URL

Jak získat obrázkový náhled a další informace pro libovolnou URL.

2 minuty

Rozdělování Vite/Rollup buildu do chunků

Jak rozdělit build aplikace do souborů, aby byla co nejrychlejší.

4 minuty

Video Playwright testu

Jak uložit video automatického testu.

1 minuta

HTML atribut download

HTML atribut download zlepšuje uživatelský dojem ze stahovaného souboru.

2 minuty

Tailwind CSS

CSS framework pro stylování webů přes utility třídy.

6 minut

Storybook

Storybook je nástroj pro snadné generování přehledu UI komponent.

3 minuty

Jak vytvořit tmavý režim / dark mode v CSS

Jak co nejlépe vytvořit pro web tmavý režim, aby automaticky respektoval nastavení uživatele.

8 minut

Odstranění nepoužívaných překladů ve Vue.js

Jak ve Vue.js automaticky udržovat překlady očištěné o nepoužívané klíče.

3 minuty

Offline stránka v PWA přes ServiceWorker

Jak udělat web fungující offline. A splnit tak požadavky na PWA.

6 minut

Zúčastněte se online konference Frontendisti.cz

V sobotu 29. 5. 2021 od 10.00 do 16.30 bude česká online konference o webovém frontendu.

2 minuty

CSS pseudo třída :is()

Jak v CSS pseudo třída :is() dokáže z(ne)přehlednit styly.

2 minuty

CSS backdrop-filter

Vlastnost backdrop-filter dokáže uplatnit filtr pro pozadí elementu.

1 minuta

VisualViewport API

VisualViewport API umožňuje v JS lépe reagovat na velikost viewportu a jeho změny.

2 minuty

Vite – super rychlý dev server / build

Vite je nástroj pro neuvěřitelně rychlý dev server, hot reload a build JS/CSS.

5 minut

Kopírování/klonování objektů v JS

Jak správně a úspěšně zkopírovat objekt v JavaScriptu.

3 minuty

Recense: Vzhůru do AMP

Má smysl používat AMP, nebo je to úplná blbost?

4 minuty

PhpStorm, nebo WebStorm?

Hodí se pro vývoj webu používat PhpStorm, nebo WebStorm? Jaké jsou rozdíly.

2 minuty

Jak funguje jecas.cz

Jak funguje zdejší frontend, backend a jak se to vše nahrává na server.

3 minuty

Rozdíl mezi var a let v JS

Jaký je v JavaScriptu rozdíl mezi deklarováním proměnných přes var a let.

4 minuty

Jak funguje CSS position: sticky

CSS sticky posice umožňuje bez JS zafixovat element ke kraji okna při rolování.

3 minuty

Barva podle odrolování na stránce

Jak pouze v CSS měnit pozadí elementu v závislosti na odscrollování na stránce.

2 minuty

Barva horní lišty v mobilním prohlížeči

Jak obarvit záhlaví mobilního prohlížeče, aby ladilo se stránkou.

2 minuty

Jak udělat <input> pro zadávání adresy webu

Jak vytvořit políčko pro URL webové stránky a správně ho validovat.

2 minuty

CSS pravidla any-pointer a any-hover

CSS pravidla @media any-pointer a any-hover slouží k detekci přesnosti a typu ovládání.

3 minuty

Box-shadow

Vlastnost box-shadow umí vytvořit CSS stín kolem elementu.

2 minuty

Barva ukazatele caret-color

CSS vlastnost caret-color dokáže obarvit blikající ukazatel ve formulářových polích.

1 minuta

Zachování posice scrollování overflow-anchor

CSS vlastnost overflow-anchor umožňuje nastavit, jak si má prohlížeč pamatovat, kam bylo odscrollováno.

2 minuty

Zadávání kalendářního data

Pohodlné zadávání kalendářního data ve formulářích.

2 minuty

Kulaté okraje v CSS

Jak vytvořit v CSS zaoblené okraje.

2 minuty

Resetování <input type=file>

Jak resetovat (odstranit) hodnotu z <input>u pro upload souborů.

2 minuty

Object-fit

CSS vlastnost object-fit umí přizpůsobit obrázek pevné velikosti.

2 minuty

Vytisknutí stránky

Jak správně připravit webovou stránku pro pohodlné vytištění.

6 minut

Cache-Control: immutable – cache trvalých souborů

HTTP hlavičkou Cache-Control: immutable jde zamezit opětovanému kontrolování neměnných souborů a zrychlit tak načítání.

2 minuty

Text-decoration

Vlastnost text-decoration slouží k „vyzdobení“ běžného textu.

4 minuty

CSS Elements Queries

Jak zajistit různý vzhled elementů v závislosti na jejich rozměru.

3 minuty

Nula před desetinnou tečkou u čísla

Je lepší psát před desetinou tečnou u čísla 0.5 zbytečnou nulu, nebo ne?

2 minuty

Zjištění FTP hesla v Total Commanderu

Jak zjistit z Total Commanderu uložená hesla k FTP.

2 minuty

Pořadí CSS vlastností

Jak správně řadit jednotlivé CSS vlastnosti v rámci jednoho bloku příslušícímu k selektoru.

5 minut

Jak používat CSS stav :focus

Proč je důležité stylovat stav :focus. Jak toho automaticky docílit a jaké jsou s tím problémy.

6 minut

Přechod na Gulp 4

Jak přejít na Gulp 4. Co je potřeba změnit v gulpfile.js.

4 minuty

Přepínání tříd v JS

Přepínání, přidávání a odebírání CSS tříd JavaScriptem.

3 minuty

Maximální možný počet CSS selektorů

Jaké jsou v prohlížečích omezení pro velikost (složitost) CSS souborů.

2 minuty

Lepší podtržení odkazu

Jak si vytvořit hezčí podtržení textu odkazu, než je výchozí.

2 minuty

Z-index

K čemu je CSS vlastnost z-index a jak mít v jejím užívání systém.

3 minuty

Zvláštní CSS pro IE

Jak odlišit Internet Explorer od ostatních prohlížečů a vytvořit zvláštní CSS jen pro IE.

5 minut

Recense: Vzhůru do (responzivního) webdesignu

Martin Michálek vydal další knihu o současné tvorbě webu, tentokrát kromě e-booku i na papíře. Jaká je?

2 minuty

Šířka rolovací lišty

Jaká je šířka posuvníku v různých prohlížečích.

2 minuty

CSS @font-face

Pomocí CSS pravidla @font-face jde na stránce používat různá webová písma.

8 minut

Media queries v JavaScriptu

Jak v JavaScriptu používat @media pravidla jako v CSS.

3 minuty

CSS pravidlo @supports

Pravidlem @supports lze v CSS testovat dostupnost CSS vlastností.

2 minuty

Vlastní vzhled scrollbaru

Jaké jsou možnosti ve stylování vzhledu posuvníku.

3 minuty

Navázání událostí v JavaScriptu

Jaké existují postupy pro navěšení JavaScriptové události na element. Výhody a nevýhody různých řešení.

3 minuty

Expirace .com domény

Jak dlouho trvá expirace domény s koncovkou .com. Čím se liší od .cz domény.

2 minuty

Zjištění rozměrů stránky

Jak v JavaScriptu zjistit šířku a výšku rozlišení obrazovky, velikost dostupné plochy (tzv. viewport) nebo rozměry elementu.

2 minuty

HTML/CSS/JS identifikátor id

K čemu se hodí identifikátor, kdy ho používat a jaké znaky může obsahovat.

3 minuty

Instalace Apache, PHP a MySQL za 30 vteřin

Jak si ve Windows spustit vlastní Apache, PHP a MySQL na svém PC za půl minuty.

4 minuty

Zalamování dlouhých slov

Jak si poradit s dlouhými slovy, které by mohly narušit layout stránky.

2 minuty

Rozpoznávání hlasu

Jak psát na web převodem hlasu na text pomocí speechRecognition.

3 minuty

Poskakování stránky

Proč vadí poskakování stránky během načítání a jak se ho zbavit.

3 minuty

Výkon animací s transition: all

Je lepší psát transition: all, nebo vyjmenovávat vlastnosti, které se mají animovat?

2 minuty

Úprava náhledového obrázku webu na Seznamu

Vyhledávání na Seznamu zobrazuje vedle výsledků vyhledávání obrázkový náhled webu. Jak zobrazení náhledu stránky ve vyhledávači ovlivnit?

3 minuty

Vytváření vlastních HTML značek

Je možné si kromě standardních HTML tagů vytvořit nějaké vlastní?

3 minuty

Prodleva po tapnutí na mobilech

Co způsobuje 300 milisekundovou prodlevu po kliknutí na odkaz/tlačítko na dotykových zařízeních.

2 minuty

Vlastní hláška alert

Jak si v JavaScriptu vytvořit vlastní hlášky jako je výchozí alert.

2 minuty

HTML značka <input>

Všechny varianty značky <input>, možné atributy, vysvětlení a ukázky.

5 minut

Lazy loading obrázků

Načtení obrázků, až když je na ně odrolováno. Různé postupy řešení.

3 minuty

Parsování URL v JavaScriptu

Jak elegantně parsovat adresy webových stránek v JavaScriptu.

2 minuty

Nástroje pro kontrolu a analysování stránky

Užitečné nástroje pro analysování, kontrolování a prověřování webových stránek.

3 minuty

Pozvánka na Jobs Dev 2017

Jobs Dev 2017 je veletrh práce pro programátory, který se uskuteční 8. dubna na Fakultě architektury ČVUT v Dejvicích.

3 minuty

Přihlašování pomocí PINu

Kdy a proč používat ve webových aplikacích přihlašování pomocí PIN kódu.

3 minuty

MySQL přes PDO

PDO je PHP rozhraní pro pohodlnější práci s SQL databásí. Jaké přináší výhody a jak ho používat.

4 minuty

SVG

SVG je grafický formát vhodný pro grafické prvky, které mají mít možnost měnit svou velikost.

13 minut

Odrolování bez JavaScriptu

Jak odscrollovat na určitou část stránky bez JavaScriptu.

2 minuty

Co je to za font?

Jak určit, jak se jmenuje písmo na obrázku nebo webu.

2 minuty

CSS appearance

Systémový vzhled elementů pomocí CSS vlastnosti appearance.

2 minuty

CSS spinner

Točící se kolečko pro znázornění načítání v čistém CSS.

1 minuta

Systémová písma

Jak a proč používat lokální písma dostupné v operačních systémech.

2 minuty

Přidání přístupu do Google Analytics

Jak do Google Analytics přidat oprávnění třetí osobě, aby mohla prohlížet statistiky.

1 minuta

Recense: Vzhůru do CSS3‏

Jaký je ebook o CSS3 od Martina Michálka.

3 minuty

Stylování <select>u

Roletový seznam nabízí omezené možnosti v úpravách vzhledu. Které to jsou a jak je rozšířit?

2 minuty

CSS mixiny pomocí @apply

Pomocí pravidla @apply jde v CSS vytvářet vlastní mixiny.

1 minuta

Automatické zoomování inputů na iOS

Jak se vypořádat s automatickým přibližováním stránky u formulářových prvků na iPhonech.

3 minuty

Automatická výška <textarea>

Jak zajistit, aby se výška textového pole přizpůsobovala délce textu.

2 minuty

Blisk – testování responsivních webů

Blisk prohlížeč vypadá jako Chrome, ale má šikovné nástroje pro testování responsivních webů.

2 minuty

Rel=noopener

Atribut noopener dokáže zabránit manipulaci ze stránky otevřené do nového okna.

1 minuta

Jade

Jade je šablonovací systém převáděný do HTML.

2 minuty

CSS prefixy

Některé CSS vlastnosti se zapisují s prefixy. Proč tomu tak je a jak prefixy zapisovat.

3 minuty

Co je to localForage?

K čemu slouží a jak se používá localForage úložiště.

1 minuta

Upload obrovských souborů v JS/PHP

Jak umožnit návštěvníkům nahrát soubory jako videa v řádech MB/GB s progress barem.

3 minuty

Vlastní styl bubliny title

Jaké jsou možnosti pro vlastní vzhled nápovědy, která se objevuje při vyplnění atributu title.

3 minuty

Markdown

Markdown slouží k formátování textu. Výhody a nevýhody, popis syntaxe.

5 minut

Jak na Facebook Instant Articles

Instant Articles je technologie pro rychlé zobrazování obsahu na Facebooku. Jak začít?

4 minuty

Všechny CSS vlastnosti

Seznam (skoro) všech 207 CSS vlastností.

3 minuty

Otevření 2 stránek jedním odkazem

Jak jedním odkazem otevřít dvě různé stránky.

2 minuty

Responsivní popisky tlačítek

Jak na různě velkých obrazovkách měnit popisky odkazů a tlačítek.

3 minuty

Odkaz pro předvyplnění SMS

Jak dát na stránku odkaz, který na mobilech předvyplní číslo a text SMS.

3 minuty

Hromadné datové zmenšení obrázků

Chceme-li zrychlit načítání své stránky, datová optimalisace obrázků může pomoci.

2 minuty

Úprava textu stránky pomocí designMode

Jednoduchý bookmarklet pro okamžité přepsání libovolného textu na stránce.

1 minuta

Statistiky prohlížečů

Statistiky používání internetových prohlížečů na webových stránkách v České republice a ve světě.

2 minuty

Indexování JavaScriptu

Jak se vyhledávače Google a Seznam vypořádají s obsahem v JavaScriptu. Dokáží takový obsah indexovat?

3 minuty

Expressive CSS

Expressive CSS je postup psaní CSS, kde se jednotlivé styly přiřazují pomocí tříd v HTML.

4 minuty

Atributový case-insensitive selektor

Pomocí příznaku i jde zapsat atributový selektor nezávislý na velikosti písmen.

2 minuty

Zjištění barvy obrázku

Jak v JavaScriptu i PHP zjistit hlavní barvu obrázku.

2 minuty

Nekonečné scrollování

Je lepší nekonečné rolování, klasické stránkování nebo tlačítko „Zobrazit další“?

7 minut

Wireframe

Co jsou to drátěné modely, proč je používat a jak je vytvářet.

3 minuty

Jednostránkový web

Kdy vytvářet web o jediné stránce. Jaké jsou výhody a nevýhody.

5 minut

Přichytávací rolování v CSS

CSS vlastnost scroll-snap dokáže řídit rolování, aby přeskakovalo mezi jednotlivými elementy.

3 minuty

Ladění responsivních webů

Jak testovat zobrazení responsivního webu na mobilních zařízeních.

4 minuty

Výběr jazyku stránky

Jak vytvořit vícejazyčný web s ohledem na uživatele i vyhledávače.

7 minut

Zaokrouhlení času

Jak v PHP zaokrouhlit čas na celé pětiminuty, čtvrthodiny nebo půlhodiny.

1 minuta

Načítání webu v <iframe>

Je rozumné blokovat načítání webu v <iframe>? Jaká jsou risika a výhody.

3 minuty

Stylovat třídy, nebo elementy?

Je lepší stylovat přímo HTML elementy, nebo všechny styly přiřazovat třídami?

4 minuty

AMP HTML ⚡

AMP HTML je způsob tvorby webu, při kterém je stránka dobře uzpůsobena rychlému načítání na mobilních zařízeních.

5 minut

Napovídání poskytovatele e-mailu

Jak usnadnit vyplňování e-mailové adresy automatickým napovídáním poskytovatele.

3 minuty

Stránkování

Jak správně řešit stránkování na webové stránce.

7 minut

HTML značka <!doctype>

Jaký (a jestli vůbec) psát <!doctype> do stránky?

4 minuty

Přesnější měření formulářů v Google Analytics

Jednoduchá cesta, jak spárovat zdroje odeslaných formulářů na webu s Google Analytics.

3 minuty

Responsivní logo stránky

Jak vytvořit logo, které se bude přizpůsobovat velikosti stránky.

4 minuty

Jednotné odsazení v CSS

Jak postupovat, aby napříč webem byly mezi elementy stejné rozestupy.

4 minuty

Jak zjistit a opravit překlep

Jak zjišťovat, jestli uživatel neudělal překlep a sdělit mu, co chtěl napsat.

4 minuty

Optimalisace pro AdBlock

Jak stránku optimalisovat, aby ji nerozbilo blokování reklam AdBlockem.

2 minuty

Výpočet průměru a mediánu v PHP/JS

Jak v jazyce PHP nebo v JavaScriptu spočítat medián.

2 minuty

CSS zarovnání vertical-align

Vertikální zarovnání řádku nebo buňky tabulky.

2 minuty

Kam umístit popisky formuláře

Jak umístit popisky formulářových prvků, aby bylo vyplňování formuláře co nejpohodlnější.

3 minuty

Jak (ne)přenášet referer

Jak zablokovat přenášení informace o předchozí navštívené stránce.

4 minuty

K čemu slouží CDN?

Má smysl používat pro připojení CSS a JS souborů CDN?

4 minuty

Připojení JavaScriptu s async a defer

Různé způsoby připojení JavaScriptu na stránku, aby se nezdržovalo načítání stránky.

6 minut

HTML značky <div> a <span>

Div a span jsou neutrální HTML značky, které se používají k aplikování vzhledu pomocí CSS.

3 minuty

HTML tabulky

Vytváření tabulek v HTML. Kompletní přehled všech tabulkových značek.

5 minut

Zprava doleva

HTML značky, HTML, atributy a CSS vlastnosti pro text psaný zprava doleva.

2 minuty

Musí být web validní?

Je nutné, aby byl HTML kód stránky validní? Vliv (ne)validního kódu na SEO.

4 minuty

HTML značka <ruby>

HTML značka <ruby> slouží k označení výslovností symbolů východních asijských znaků.

1 minuta

Obtékané boxy s proměnlivou šířkou

Jak udělat, aby se obtékané boxy přizpůsobovaly proměnlivé velikosti okna.

4 minuty

Přehrávání zvuků na webu

Jak na webové stránce přehrát zvukové upozornění nebo hudbu pomocí značky <audio>.

6 minut

Serializace v PHP

Funkce serialize v PHP převádí datovou strukturu na řetězec uložitelný do souboru nebo database.

3 minuty

5minutový rychlokurs Bootstrapu

Jak za 5 minut vytvořit web pomocí CSS frameworku Bootstrap.

3 minuty

Parsování HTML v PHP

Jak v PHP parsovat HTML stránku a získat z ní potřebná data.

3 minuty

Náhled odkazu při sdílení na sociálních sítích

Jak upravit stránku, aby se hezky zobrazovala při sdílení na Facebooku a Twitteru.

4 minuty

Responsivní reklama na mobilech

Jak se vypořádat s reklamami při vytváření responsivního webu. Jde to vůbec?

5 minut

HTML 5 <video> vs. GIF

Jaké jsou výhody a nevýhody HTML5 videa oproti GIFu. Co kdy použít?

4 minuty

Datum v patičce

Jaké datum uvádět v patičce a jak automaticky zajistit, aby bylo aktuální.

2 minuty

HTML <canvas>

Canvas je HTML značka pro kreslení v prohlížeči pomocí JavaScriptu.

3 minuty

To nejlepší z roku 2015

Shrnutí roku 2015 na jecas.cz a výběr toho nejlepšího.

4 minuty

Proč hamburger menu nefunguje

Hamburger menu je oblíbený postup řešení responsivní navigace. Proč se mu vyhnout.

6 minut

Jak přidat sitemapu do Seznamu a Google

Mapu webu v souboru sitemap.xml je vhodné přidat do Googlu, Seznamu nebo Bingu. Jak na to?

4 minuty

Odkazy ze starých článků

Do starých článků je dobré doplňovat odkazy na související nový obsah.

4 minuty

Uvozovky v HTML, CSS, JS, PHP, SQL

Jak správně používat uvozovky v HTML, CSS, JavaScriptu, PHP a MySQL.

6 minut

Počet sdílení na Facebooku a Twitteru

Jak pomocí API získat ve JSONu počet sdílení stránky na Facebooku a Twitteru.

2 minuty

CSS výška height

Nastavování výšky v CSS a proč ho raději nepoužívat.

3 minuty

CSS pravidlo @media

Pravidlo @media se používá k omezení platnosti CSS jen za určitých podmínek.

8 minut

Získání obsahu stránky přes oEmbed

Formát oEmbed slouží k pohodlnému získání obsahu stránky bez nutnosti jejího parsování.

3 minuty

Uložení stavu před opuštěním stránky

Jakým způsobem uložit stav aplikace/formuláře před opuštěním stránky.

4 minuty

Přepnout mobilní/desktopový web

Jak přepnout mezi desktopovým a mobilním webem. Má to vůbec smysl?

5 minut

Vliv redakčního systému na SEO

Může mít použitý redakční systém a jeho šablona vliv na umístění stránky ve vyhledávání?

5 minut

Font ikony

Ikony tvořené fontem. Proč je nepoužívat a čím je nahradit.

6 minut

Tlačítko na webu

Jaké HTML značky používat pro tlačítka na webových stránkách a aplikacích.

4 minuty

Rychlé zlepšení SEO

Jak co nejrychleji upravit stránku, aby měla lepší výsledky ve vyhledávání.

5 minut

Reinstalace Windows 10

Jak přeinstalovat Windows 10 a zlepšit tak výkon PC. Detailní postup krok za krokem.

9 minut

Mobilní web na subdoméně

Má smysl mít mobilní web na zvláštní adrese m.example.com?

7 minut

Vliv rychlosti webu na SEO

Může rychlost webové stránky ovlivnit její umístění ve vyhledávání?

6 minut

Jak zabránit zkopírování obsahu

Dá se kopírování textů, obrázků a zdrojových kódů z webu zabránit? Jak kopírování využít ve svůj prospěch.

5 minut

Ikona stránky favicon

Jak správně vytvořit ikonku stránky (favicon) pro desktop i mobily.

8 minut

Chrome Dev Summit 2015

Výběr zajímavostí z konference Chrome Dev Summit 2015.

8 minut

Responsivní hledací formulář

Jak vytvořit responsivní vyhledávací formulář, kde se políčko a tlačítko přizpůsobuje šířce.

3 minuty

Ikona vedle odkazu

Jak přidat a zarovnat ikonku vedle odkazu, který má podtržení.

2 minuty

Data URI

Data URI je způsob, jak obsah externího souboru zapsat přímo do HTML/CSS.

4 minuty

Generování PDF

Vytváření PDF dokumentů v JavaScriptu a PHP.

2 minuty

Změna stylů JavaScriptem

Jak JavaScriptem nastavovat CSS pro změnu vzhledu jednotlivých elementů.

2 minuty

Co je to polyfill?

Polyfillem se rozumí automatické alternativní řešení, které dokáže zajistit funkčnost něčeho nepodporovaného.

2 minuty

Má web fungovat bez CSS?

Má cenu řešit zobrazení stránky bez stylů? Případy, kdy taková situace nastane.

3 minuty

Umístění kursoru v poli

Jak v JavaScriptu zjistit posici, na které je kursor v textovém poli.

1 minuta

50 nejlepších programů pro Windows

Jaké užitečné programy se hodí nainstalovat do Windows.

8 minut

Jak najít neuzavřenou značku?

Neuzavřená HTML značka může způsobovat problémy. Jak ji najít?

2 minuty

Vlastní komponenty v Nette

Komponenty v Nette dokáží bránit opakování stejného kódu.

3 minuty

Kdy začne stahování <img> obrázku

Kdy se začne stahovat obrázek připojený značkou <img>.

4 minuty

HTML značka <noscript>

Značka noscript zobrazí obsah pouze když je vypnutý JavaScript.

1 minuta

Zkosení hrany v CSS

Jak vytvořit šikmou hranu (zkosení) CSS bloku.

2 minuty

Aplikace ve Windows Phone

Jaké aplikace používám ve Windows Phone 10.

2 minuty

Stažení dynamického webu

Jak stáhnout celou webovou stránku a převést ji do statické HTML podoby.

3 minuty

Vykonání JS načteného AJAXem

Jak provést JavaScript, který je ve stránce načítané AJAXem.

3 minuty

HTML kostra

Jak vypadá základní „kostra“ HTML stránky. Které HTML značky ji utváří.

8 minut

Vlastní Latte filtr

Jak si vytvořit vlastní filtr (helper) do Latte šablon v Nette Frameworku.

2 minuty

Odkaz přes celý box

Jak udělat, aby celý box s několika prvky byl klikací.

3 minuty

CSS !important

Klíčové slovo !important slouží k posílení a přebíjení CSS vlastností.

4 minuty

Cookies

Kdy cookies (ne)používat a jak s nim pracovat v JavaScriptu a PHP.

6 minut

HTML rámy

Rámy v HTML umožňují zobrazit na jedné stránce obsah z více různých zdrojů.

5 minut

Maskování a zobrazování hesla ve formuláři

Je lepší heslo ve formuláři zobrazovat, nebo ho maskovat pomocí hvězdiček?

6 minut

Zlepšení signálu Wi-Fi připojení

Jak zlepšit signál, rychlost a stabilitu Wi-Fi připojení.

3 minuty

HTTP autorisace v .htaccess

Jak souborem .htaccess jednoduše omezit přístup na stránku heslem.

2 minuty

Vyšší tlačítko ve Firefoxu

Prohlížeč Firefox má zajímavou vlastnost u formulářových tlačítek. Dělá je vyšší než ostatní prohlížeče.

2 minuty

Jak proběhl přechod vaszrak.cz na HTTPS

Příklad konkrétního webu, který přešel z nezabezpečeného HTTP na HTTPS.

5 minut

Přechod na HTTPS

Jaké jsou výhody a nevýhody převedení webu na zabezpečené HTTPS. Proč web na HTTPS přesunout?

9 minut

CSS vlastnost position

CSS rozlišuje statickou, relativní, absolutní a fixní posici. K čemu je co dobré?

5 minut

Velikost písma podle šířky

Jak přizpůsobovat velikost písma aktuální šířce stránky.

3 minuty

Atribut autocapitalize

HTML atribut autocapitalize slouží k nastavení automatického přepnutí na velká písmena u dotykových klávesnic.

3 minuty

Nová stránka v JavaScriptu

Jak v JavaScriptu vytvořit novou HTML stránku.

2 minuty

Je uživatel online?

Jak zjistit, jestli je uživatel webové aplikace online nebo offline.

2 minuty

Word-spacing

CSS vlastnost word-spacing upravuje velikost mezer mezi slovy.

2 minuty

Jeden sloupec fixní, druhý proměnlivý

Jak vytvořit dvousloupcové rozvržení, kde je jeden sloupec s pevnou šířkou a druhý se přizpůsobuje šířce okna.

3 minuty

Má web fungovat bez JavaScriptu?

Při tvorbě webu je potřeba zvážit, jestli a jak má fungovat bez podpory JavaScriptu.

4 minuty

Převod sloupců na procenta

Jak převést fixní sloupcové rozložení na procenta, která se budou přizpůsobovat šířce okna.

1 minuta

Zalomení tlačítka na více řádků

Jak zabránit nechtěnému zalomení tlačítka na více řádků.

1 minuta

Automatické vybrání políčka po načtení

Jak a kdy přesunout kursor do textového pole automaticky po načtení stránky.

2 minuty

Odsazení prvního řádku text-indent

CSS vlastnost text-indent slouží k odsazení nebo předsazení prvního řádku.

2 minuty

Jak široký web udělat

Jakou zvolit optimální šířku webové stránky.

3 minuty

Letter-spacing

CSS vlastnost letter-spacing upravuje vzdálenost mezi písmeny.

2 minuty

WebExpo 2015

O víkendu proběhl již 8. ročník webové konference WebExpo. Co jsem se tam dozvěděl?

1 minuta

Oddělovač položek v menu

Jakými způsoby v CSS lze realisovat oddělovač položek v menu.

3 minuty

CSS selektor :empty

CSS selektor :empty zaměří element, ve kterém vůbec nic není.

1 minuta

Úložiště localStorage

Local Storage je úložiště v prohlížeči klienta přístupné JavaScriptem. K čemu se hodí?

4 minuty

Zmenšení zkratek ve vyhledávání Seznamu

Vyhledávač Seznam.cz někdy převádí ve výsledcích hledání VELKÁ písmena na malá. Kdy a proč?

2 minuty

Preconnect – zrychlení stahování z více domén

Jak v prohlížečích zrychlit stahování souborů z jiné domény pomocí preconnect.

2 minuty

Upozornění v JS konsoli

Jak do JS konsole vložit výrazné varování o risicích vkládání cizího kódu.

2 minuty

Webový Outlook.com

Proč na e-maily používám webový Outlook.com.

3 minuty

Doba čtení stránky

Jak zobrazit přibližnou dobu, kterou zabere čtení stránky.

3 minuty

Jak zabezpečit číslo objednávky v e-shopu

Jakým způsobem bezpečně sestavit číslo objednávky zboží v e-shopu.

3 minuty

Nepotvrzení přečtení zprávy na Facebooku

Jak zabránit, aby se příchozí zpráva na Facebooku označila jako přečtená.

2 minuty

Responsivní Facebook Like

Jak zajistit, aby se Facebook Like a Page box přizpůsobovaly šířce obrazovky.

4 minuty

Drag & Drop upload obrázků

Všechny možnosti nahrávání obrázků ze schránky a pomocí drag & drop.

6 minut

Automatická výška <iframe> podle obsahu

Definitivní řešení automatického nastavování velikosti <iframe> podle výšky obsahu.

3 minuty

HTML odkazy

Všechny informace a detaily o HTML odkazech, jejich atributech a stylování pomocí CSS.

10 minut

Horní a dolní index v HTML

Pro zapisování horních a dolních indexů slouží v HTML značky <sup> a <sub>.

3 minuty

Mobilní MS Edge

V mobilních Windows 10 je internetový prohlížeč Microsoft Edge. Jaký je?

2 minuty

Připojení lokálního CSS/JS na ostrý server

Jak na ostrý server připojit pro vývoj a testování lokální styly nebo skripty.

5 minut

Nastavení výšky responsivního obrázku

Jak zabránit poskakování responsivních obrázků během načítání stránky.

4 minuty

Testování v MS Edge a IE

Jak testovat stránky v různých versích Internet Exploreru a Edge ve Windows, Mac OS nebo v Linuxu.

2 minuty

Proč (ne)používat mobile first

Mobile first je postup tvorby responsivního webu, kdy se začíná od nejmenších obrazovek (mobil) až po větší (desktop).

7 minut

Značka <meta name=viewport>

K čemu používat <meta> tag name=viewport.

3 minuty

HTML odstavec

HTML značka <p> slouží k uspořádávání textu do odstavců.

4 minuty

Přečtení textu webu

Jak obsah webové stránky přečíst hlasem.

2 minuty

Vícesloupcový text a column

CSS vlastnost column umožňuje rozdělení textu do více sloupců.

2 minuty

Screenshot webu

Jak z webové stránky vytvořit obrázek (screenshot).

2 minuty

Navštívený odkaz :visited

Pomocí CSS pseudo třídy :visited jde měnit některé styly navštíveného odkazu.

5 minut

Windows 10

Jaký je nový operační systém Windows 10. Srovnání s Windows 7.

6 minut

Microsoft Edge

Jaký je nový nástupce Internet Exploreru – Microsoft Edge.

1 minuta

Sledování 404 chybových stránek

Jak zjistit adresy, které neexistují a končí chybovou stránkou 404 a co s nimi udělat.

4 minuty

Mezera v PSČ

Jak a zda vůbec automaticky odsazovat uživatelem zadané znaky PSČ do formulářového políčka.

2 minuty

HTML seznamy

Přehled všech typů seznamů, které se v HTML používají.

5 minut

Adresa stránky nebo profilu na Facebooku

Jak, kde a proč si nastavit URL pro profil nebo stránku na Facebooku.

2 minuty

Google ignoruje obsah „404 stránky“

Jak se staví Google k obsahu chybové stránky s kódem 404/410.

2 minuty

10 rad pro vytvoření nejlepší URL

Jakým způsobem volit tvar URL jednotlivých stránek s ohledem na použitelnost a SEO.

6 minut

Změna adresy JavaScriptem

JavaScript může měnit URL. Jak a v jakých případech toho využívat.

2 minuty

Vložení videa z YouTube

Jak přidat na svou stránku video ze serveru YouTube s HTML 5 přehrávačem.

2 minuty

Globální HTML atributy

Obecné atributy jdou používat u všech HTML značek. Zde je jejich kompletní seznam.

9 minut

Převod milisekund

Převodník milisekund.

1 minuta

Odkaz na hlavní stranu

Má smysl umisťovat na web odkaz na hlavní stranu? Na jakém místě ho návštěvník očekává?

1 minuta

Výpis zdrojového kódu

Jak na HTML stránce vypisovat zdrojové kódy.

3 minuty

Elipsa/ovál v CSS

Jak pomocí CSS nakresli ovál.

1 minuta

Citace v HTML

Jaké značky se v HTML používají pro označení citovaného textu.

4 minuty

Datová velikost stránky

Jak by měla být stránka datově velká pro rozumně rychlé načítání.

4 minuty

Jak sám sebe přidat do Twitter seznamu

Jak přidat svůj Twitter účet do vlastního seznamu (listu).

1 minuta

Office 2016

Microsoft uvolnil preview versi Office 2016. Jaká je a jak se liší od předchozí 2013?

2 minuty

Kontrola pravopisu v Sublime Text

Jak přidat českou kontrolu pravopisu do editoru Sublime Text.

2 minuty

Upozornění před zavřením stránky

Javascriptová událost onbeforeunload umožňuje pozastavit uzavření/obnovení stránky.

1 minuta

Zvětšení obrázku

Jakými způsoby řešit zvětšení malého obrázku.

3 minuty

HTML definice termínu

HTML značka <dfn> slouží pro vyznačení slovního spojení termínu/výrazu.

2 minuty

Anketa: Pro jaké prohlížeče ladíte stránky?

Na základě čeho určujete prohlížeče, pro které webovou stránku ještě budete ladit?

1 minuta

Způsoby CSS resetování

Používat CSS reset, nebo ne? Jaká jsou pro a proti.

5 minut

Přestěhování Wordpressu na jiný server

Jak přenést web běžící na redakčním sytému Wordpressu na jiný server.

4 minuty

Předchozí/další element v JavaScriptu

Získání následujícího nebo předchozího sourozence pomocí nextSibling a previousSibling.

2 minuty

CSS zbytečnosti

CSS konstrukce, které nejspíš píšete zbytečně.

4 minuty

Google Analytics: Přehled podle hodin

Jak v Google Analytics zobrazit podíl návštěv dle denní doby nebo dnů v týdnu.

1 minuta

Vypnutí Emoji ve WordPressu

Jak ve WordPressu zakázat grafické symboly Emoji.

1 minuta

Psát margin: auto, nebo margin: 0 auto?

CSS konstrukce margin: auto se obvykle používá pro vodorovné centrování bloku.

1 minuta

Hlavička User-Agent

User-Agent je hlavička, kterou posílají prohlížeče jako svou identifikaci.

3 minuty

Určení kódování BOMem

Co je to BOM a jak nastavuje kódování pro správné zobrazování českých znaků.

2 minuty

Posunutí obsahu v CSS

Jak posunout jakýkoliv element někam jinam.

2 minuty

ARIA atributy

HTML atributy aria-* slouží k sémantickému vyznačení informací pro postižené uživatele.

3 minuty

Komentáře na webu

Jak jednoduše provozovat komentáře pod články na svých stránkách.

5 minut

Emoji

Emoji jsou grafické symboly (obrázky), které je možné zapsat jako běžné znaky.

1 minuta

Text v obrázku

Jak vyřešit situaci, kdy má být textový obsah v obrázku z hlediska přístupnosti, použitelnosti a SEO.

3 minuty

Proč nepoužívat <select>

Proč se snažit vyhnout používání rozbalovací nabídky <select> za každou cenu.

6 minut

Popisek formulářového pole

Jakým způsobem řešit popisky formulářových prvků.

3 minuty

Kopírování do schránky

Jak s použitím JS zkopírovat uživateli nějaký text do schránky.

5 minut

Převod webu na responsivní design

Jak webovou stránku co nejlépe a nejjednodušeji převést do responsivní podoby.

10 minut

Before a after u <input>u

Funguje, nebo nefunguje použití :before a :after u <input>ů?

1 minuta

Hlasování v anketě pouze jednou

Jak umožnit návštěvníkům hlasovat v anketě pouze jednou.

2 minuty

BEM – způsob zápisu CSS

BEM (Block, Element, Modifier) je postup, kterým zapisovat CSS pravidla a pojmenovávat CSS třídy.

3 minuty

Will-change

CSS vlastnost will-change dá prohlížeči najevo, že se s elementem bude něco dělat.

3 minuty

Maximální šířka pozadí

Jak obrázkovému pozadí nastavit maximální šířku. Tj. aby se přizpůsobovalo menší šířce okna.

1 minuta

Automatické vypnutí disku ve Windows

Windows automaticky vypíná pevný disk po 20 minutách nečinnosti. Jak vypínání zrušit?

1 minuta

Zakázání označování textu

Standardně jde na webu označovat text. Jak jeho výběru myší zabránit?

3 minuty

Plynulé rozbalení obsahu

Jak pomocí CSS animace a JavaScriptu plynule rozbalit původně skrytý obsah.

2 minuty

Pozadí jenom za písmeny

Jak vytvořit nadpis, který má pozadí jen za písmeny.

2 minuty

Automatické vyplňování formulářů

Pomocí atributu autocomplete jde usnadnit a zrychlit vyplňování formulářů.

2 minuty

Oprava chyb použitelnosti v mobilních zařízeních

Google informuje o chybách v použitelnosti u mobilních zařízeních. Jak je opravit?

3 minuty

Nejbližší předek elementu – closest

JavaScriptovou metodou closest jde získat nejbližší nadřazený element vyhovující selektoru.

2 minuty

Image-rendering

CSS vlastnost image-rendering ovlivňuje způsob, kterým se v prohlížeči zvětšují/zmenšují obrázky.

3 minuty

Jaký formát obrázku použít na webu

PNG, GIF, JPG? Který datový formát obrázku volit pro použití na webové stránce.

4 minuty

Odřádkování v HTML a CSS

Jak v HTML, HTML atributu nebo CSS vložit nový řádek.

3 minuty

Styl elementů podle jejich počtu

Jak pomocí CSS odlišně stylovat položky v závislosti na jejich počtu.

3 minuty

Hodnota zaškrtnutého radio <input>u

Jak v JavaScriptu zjistit hodnotu označeného radio políčka.

2 minuty

Validace po zadávání znaků

Jak okamžitě reagovat na zadávání znaků do pole během psaní.

3 minuty

Nadpisy na webu

Pro značení nadpisů stránek existují značky <h1>, <h2>, <h3>, <h4>, <h5> a <h6>.

6 minut

Měření blokování reklam v Google Analytics

Jak pomocí Google Analytics změřit návštěvníky, kteří blokují reklamy.

2 minuty

Části webu přes celou šířku

Jak jen některé části webu roztáhnout přes celou šířku.

2 minuty

Tolerance myši u vysouvacího menu

Při vytváření menu reagujícího na najetí myši (hover) je dobré tolerovat nepřesnou cestu myší.

3 minuty

Styl odrážkového seznamu

CSS vlastnost list-style upravuje vzhled seznamů <ul> a <ol>.

5 minut

HTML element <data>

HTML značka <data> slouží k označení strojově čitelných dat na webu.

1 minuta

Vložení ze schránky onpaste

JavaScriptová událost onpaste slouží k odchycení vložení obsahu ze schránky.

1 minuta

S-Rank

Co je to S-Rank? Jak ho zjistit, z čeho se počítá a jak ovlivňuje výsledky vyhledávání / SEO.

5 minut

HTML atribut hidden

HTML atribut hidden jde použít pro skrytí obsahu.

1 minuta

Zvětšení a zmenšení v CSS

Jak v CSS zoomovat (zvětšovat a zmenšovat) elementy.

2 minuty

CSS vlastnost mask

Vlastnost mask dokáže vytvářet elementy s texturou nebo nepravidelnými tvary.

2 minuty

Box-reflect

CSS vlastnost box-reflect umí vytvořit odraz celého boxu.

2 minuty

Zvýraznění sloupců/řádků tabulky po najetí

Jak při najetí myší na tabulku zvýraznit příslušné sloupce a řádky.

2 minuty

Atribut minlength

HTML atribut minlength stanovuje minimální počet znaků, který musí být v políčku.

1 minuta

HTML entity

Entity v HTML jsou zvláštní druh posloupnosti znaků sloužící k zápisu různých symbolů.

4 minuty

Single page application

Co je to SPA (single page application). Na jakém principu funguje.

3 minuty

Generování náhodných obrázků

Pro vývoj a testování webů se hodí znát způsoby, jak v okamžiku vložit do stránky ilustrační obrázek.

1 minuta

Směr rolování kolečkem

Jak podle směru otáčení kolečka myši měnit velikost obsahu.

3 minuty

Dohledání a opravení rozbité adresy

Zejména automatické převaděče URL na HTML odkazy, ale i lidé dokáží pokazit tvar odkazu na webovou stránku.

3 minuty

Přestěhování systému Joomla!

Jak zkopírovat web běžící na redakčním sytému Joomla! na jiný server.

2 minuty

Atribut novalidate

HTML atribut novalidate zabrání výchozí HTML 5 validaci formulářů.

2 minuty

Jak zobrazit chybové hlášky

Při odstraňování problému v HTML/CSS/JS/PHP/SQL je nutný přístup k chybovým hláškám, jak se k nim dostat?

5 minut

České skloňování

Jak v JS, PHP nebo CSS správně vytvořit skloňování slov pro české prostředí.

2 minuty

Maximální počet znaků

HTML atribut maxlength omezuje počet znaků ve formulářovém poli.

2 minuty

Fit-content

CSS vlastnost fit-content nastaví šířku podle obsahu.

1 minuta

Aktivní element v JavaScriptu

Jak zjistit element, který vyvolal JS událost.

1 minuta

CSS filter

Jak vytvářet grafické filtry obrázků i jiných prvků na stránce.

3 minuty

Režim celé obrazovky

Jak je možné stránku přepnout do fullscreenu (režimu celé obrazovky).

3 minuty

Font

CSS vlastnost font slouží k nastavení písma na stránce.

6 minut

Jazyk zdrojového kódu

Jakým jazykem programovat. Česky, nebo anglicky?

3 minuty

Nápověda na webu

Jak vytvářet nápovědu na webových stránkách.

1 minuta

Popis obrázku

Jak na webové stránce přidat k obrázku popisek.

2 minuty

JS akce po kliknutí na odkaz

Na co si dát pozor při obsluhování odkazu JavaScriptem.

2 minuty

Styl označeného textu

Pseudo-element ::selection umožňuje změnit styl kursorem označeného textu.

2 minuty

Bezstavové HTML

Jak vytvořit aplikaci, kde se nemění HTML kód.

2 minuty

Drag & Drop v JavaScriptu

Jak vytvořit „drag & drop“ přesouvání prvků po stránce v JavaScriptu.

3 minuty

Selektor :matches

CSS pseudotřída :matches slouží ke zjednodušení zápisu dlouhých výčtů selektorů.

2 minuty

Posun v poli přes okraje

Jak se z poslední položky pole dostat na první a obráceně.

2 minuty

Měření vyhledávání a akcí v Google Analytics

Jak v Google Analytics měřit vlastní akce jako kliknutí na tlačítko nebo dotazy do interního vyhledávání.

3 minuty

Sublime Text – klávesové zkratky

Nejzajímavější klávesové zkratky v Sublime Text pro zrychlení práce.

3 minuty

Expirace CZ domény

Jak probíhá expirace CZ domén. Kdy bude expirující doména volná?

2 minuty

Plynulá změna obrázků

Jak na stránce automaticky plynule měnit obrázky.

2 minuty

Zrychlení AJAXové aplikace o 100 ms

Jak u AJAXové aplikace snadno zrychlit odezvu na kliknutí o 100 milisekund.

3 minuty

Průběh načítání AJAXu

Při odesílání dat AJAXem je dobré dát uživateli vědět, že se něco děje.

4 minuty

Plocha odkazu

Proč a jak vytvářet klikací plochu kolem odkazu.

2 minuty

Seznam.cz prohlížeč

Seznam vytvořil vlastní webový prohlížeč. Jaký je?

3 minuty

Zjištění vypnutých cookies

Jak zjistit, jestli má návštěvník zapnuté nebo vypnuté cookies.

3 minuty

Oříznutí víceřádkového obsahu

Jak oříznout dlouhý text po stanoveném počtu řádek.

2 minuty

JS document.head

Přístup k hlavičce stránky v JavaScriptu je možný konstrukcí document.head.

1 minuta

Google zrychlil načítání na mobilech

Jak Google zrychlil načítání stránek z výsledků hledání o 150 milisekund.

1 minuta

Nová Google reCAPTCHA

Google vytvořil novou podobu nástroje chránícího před roboty reCAPTCHA.

3 minuty

Beacon API

Beacon API umožňuje asynchronně zaslat data na server při opuštění stránky.

2 minuty

Načítání CSS bez blokování vykreslování

Jak asynchronně načítat CSS, aby neblokovalo vykreslování stránky.

4 minuty

Dopočítávání CSS hodnot

Jak funguje dopočítávání hodnot v kaskádových stylech.

3 minuty

Font-feature-settings

S CSS vlastností font-feature-settings lze dosáhnout zajímavější typografie u OpenType písem.

3 minuty

Samostatný Internet Explorer 11

Microsoft nabízí samostatný cloudový Internet Exploreru 11, který může běžet nezávisle na aktuálním IE v systému.

1 minuta

Prohlížeč Yandex

Co nabízí webový prohlížeč Yandex Browser.

2 minuty

Návštěvnost jen z určitých zemí v Google Analytics

Jak v Google Analytics filtrovat návštěvnost na základě země návštěvníka.

1 minuta

CSS barva currentColor

Klíčové slovo currentColor obsahuje aktuální barvu elementu.

2 minuty

Text-align

CSS vlastnost text-align nastavuje zarovnání písma.

3 minuty

Google a skrytý text

Obsah v záložkách a skrytý v „Zobrazit více“ nemusí být Googlem indexován nebo brán v potaz.

2 minuty

Border-image

CSS vlastnost border-image slouží k vytváření obrázkových rámečků.

5 minut

Grafický editor v prohlížeči

Jaké jsou možnosti pro provádění úprav obrázků (zvýraznění, přidání popisků apod.) přímo v prohlížeči.

2 minuty

Přidání dalšího textového pole

Jak umožnit kopírování/přidávání dalších textových polí do formuláře.

3 minuty

Identifikátor z písmen a čísel

Jak místo dlouhého číselného identifikátoru použít kratší kombinaci písmen a čísel.

3 minuty

Vložení videa z Facebooku na web

Jak na vlastní stránku vložit video z Facebooku.

2 minuty

Chrome Dev Summit 2014

Výběr zajímavostí z Chrome Dev Summit.

2 minuty

Google označí stránky vhodné pro mobil

Ve výsledcích hledání na Google se objeví informace, že je stránka přizpůsobena pro mobilní zařízení.

1 minuta

Background-clip

CSS vlastností background-clip jde omezit místo, kde zobrazí obrázek na pozadí.

2 minuty

HTML atribut scoped

HTML 5.1 přichází s možností validně používat element <style> i mimo část <head>.

2 minuty

Kursor myši

Jak pomocí CSS měnit kursor myši nebo si vytvořit kursor vlastní.

3 minuty

Jak funguje vykreslování stránky

Co prohlížeč dělá s webovou stránkou při vykreslování.

5 minut

Firefox Developer Edition

Vyšla speciální verse Firefoxu pro webové vývojáře. Kde ji stáhnout a co nového nabízí.

2 minuty

Šachovnicový výpis položek

Jak vypsat položky sestávající ze dvou sloupců, aby se pořadí sloupců střídalo.

2 minuty

IP adresa, prohlížeč a jazyk

Zjištění IP adresy, prohlížeče a preferovaného jazyka návštěvníka.

1 minuta

Škrtnutí značkou <s>

Značka <s> slouží k označení obsahu, který už je zastaralý nebo není relevantní.

2 minuty

Třísloupcový layout

Různé možnosti vytvoření rozvržení o 3 sloupcích s fixní i proměnnou šířkou.

3 minuty

Responsivní design webu

Jak jednoduše a kvalitně vytvořit web, který se přizpůsobí všem velikostem cílových zařízení.

9 minut

Oříznutí CSS vlastností clip

CSS vlastnost clip slouží k oříznutí obsahu elementu.

1 minuta

CSS blend

CSS vlastnost background-blend-mode slouží ke smíchání barvy s obrázkem.

2 minuty

JS vlastnost innerHTML

Jak funguje vlastnost innerHTML v JavaScriptu. Různé způsoby vypisování obsahu v JS.

3 minuty

Box-decoration-break

Vlastnost box-decoration-break upravuje chování stylu elementu při zalomení řádku.

2 minuty

Margin, border a absolutní posicování

Jak se chová margin a border u absolutně posicovaných elementů.

2 minuty

HTML značka <output>

Značka <output> slouží k vypsání výsledku závislého na předchozí uživatelské akci.

2 minuty

HTML značka <mark>

HTML značka <mark> slouží ke zvýraznění textu na stránce.

1 minuta

CSS pravidlo @document

CSS pravidlo @document umí omezit platnost CSS na určité URL.

2 minuty

Kontextová nabídka <menuitem>

HTML značka <menuitem> umožňuje vytvořit nativní kontextovnou nabídku.

2 minuty

Jak zakázat psaní do <input>u

V jakých případech a jak zamezit psaní do formulářového políčka.

3 minuty

First-letter

CSS selektor first-letter zaměří první písmeno v elementu.

2 minuty

Zjištění výsledného CSS v JavaScriptu

Jak v JavaScriptu zjistit výslednou hodnotu libovolné CSS vlastnosti určitého elementu.

1 minuta

40 nejpoužívanějších hesel

Jaká hesla často používají čeští uživatelé.

2 minuty

Plynule se posouvající :hover efekt

Jak v CSS/JS vytvořit u navigace plynule přesouvaný hover efekt.

2 minuty

Nejnovější komentáře z Disqus

Jak vypsat nejnovější komentáře z diskusní platformy Disqus.

2 minuty

Video-záznam obrazovky do GIFu

Jak nahrát video obrazovky a uložit ho jako pohyblivý obrázek (GIF).

2 minuty

Odeslání příspěvku na stránku přes FB API

Jak v PHP odesílat příspěvky na Facebook stránku (Page) pomocí Facebook API.

2 minuty

Zjištění směru rolování

Jak JavaScriptem zjistit, jakým směrem uživatel na stránce roluje.

1 minuta

Responsivní CSS mřížka

Jak vytvořit čistě v CSS mřížku, která se bude přizpůsobovat velikosti okna.

3 minuty

HTML atribut lang

K čemu slouží a vyplatí se používat HTML atribut lang?

2 minuty

HTML značka <time>

HTML element <time>. Jak a proč ho použít na stránce.

2 minuty

HTML značka <dialog>

K čemu je dobrá HTML značka <dialog>.

3 minuty

Tabindex

Atribut tabindex slouží k uspořádání položek pro procházení klávesnicí.

2 minuty

CSS flip a animace

Jak v CSS otočit obsah kolem svislé nebo vodorovné osy.

2 minuty

Výška závislá na šířce

Jak v CSS nastavit výšku v závislosti na procentuální i pevné šířce.

2 minuty

Text-shadow

CSS vlastnost text-shadow přidává textu stín.

3 minuty

Výpis souborů ve složce

Jak v PHP vypsat a podle názvu či data seřadit obsah složky.

2 minuty

HTML značka <details>

K čemu slouží HTML značky <details> a <summary>.

2 minuty

Vytváření grafů v JavaScriptu

Snadná tvorba sloupcových, koláčových a dalších (i animovaných) grafů v JavaScriptu.

2 minuty

Menu přes celou šířku

Jak vytvořit vodorovné menu s neznámým počtem položek přes celou šířku.

2 minuty

Plynulý přechod mezi stránkami

Jak vytvořit plynulý animovaný přechod mezi dvěma stránkami.

1 minuta

Živé ukázky

Proč používám vlastní nástroj na ukázky zdrojových kódů.

3 minuty

Hover efekty s text-shadow

Zajímavé :hover efekty s využitím CSS vlastnosti text-shadow.

1 minuta

Hover efekty s box-shadow

Zajímavé :hover efekty s využitím CSS vlastnosti box-shadow.

1 minuta

Označení povinných položek

Jak elegantně ve formuláři označit povinné položky atributem required.

3 minuty

Clickjacking na Facebooku

Jak funguje clickjacking na Facebooku a jak se proti němu bránit.

2 minuty

Dynamický update času „před X minutami“

Jak skriptem na stránce průběžně aktualisovat datum v podobě „zasláno před X minutami“.

2 minuty

Pluginy v Sublime Text

Už tak kvalitní editor lze instalací vhodných rozšířeních učinit ještě lepším. Jak a jaké pluginy nainstalovat?a href='/sublime-text'

3 minuty

Tabulky v JavaScriptu

Jak pracovat s tabulkami v JS. Popis metod insertRow, insertCell, deleteRow a dalších.

2 minuty

Textarea

HTML značka <textarea> – jaká jsou její specifika.

3 minuty

20 největších chyb formulářů na webu

Jakým chybám se vyvarovat při tvorbě formulářů na webu.

7 minut

JS tooltip

JavaScriptový popisek po najetí myší na ikonu nebo text.

2 minuty

Responsivní navigace

Jak udělat elegantní navigaci pro zobrazení na malých obrazovkách.

3 minuty

Rozdíl mezi == a ===

Rozdíl mezi porovnáváním hodnota pomocí == a ===.

1 minuta

Hodně souborů v jedné složce

Proč je problém ukládat do jedné složky velké množství souborů.

2 minuty

Využití XSS chyby

Jak je možné využít XSS díru na webové stránce a jak XSS „opravit“.

3 minuty

Zjištění majitele domény

Jak PHP skriptem ověřit, zda je doména volná nebo kdo je její vlastník.

1 minuta

Seznam všech HTML značek

Abecední seznam všech 144 HTML značek.

1 minuta

Flow

Vlastnosti flow-from a flow-into umožňují pohodlně přeskupovat obsah mezi elementy.

1 minuta

Propagační kód do Google AdWords

Jak získat zdarma propagační kód na 1000 Kč v Google Adwords.

1 minuta

HTML atribut media

HTML atribut media funguje u značky <a> podobně jako Media Queries v CSS.

1 minuta

Zápis průhledné barvy rgba()

Zadávání barev v CSS pomocí rgba() umožňuje vytvořit průhledné jednobarevné pozadí.

2 minuty

CSS display

CSS vlastnost display ovlivňuje způsob vykreslování HTML elementu.

4 minuty

Atribut ping

HTML atribut ping umožňuje pingnout nějakou další stránku při prokliknutí odkazu.

1 minuta

Cacheování obsahu cizí stránky

Jak cacheovat výsledky obsahu staženého z cizí stránky.

2 minuty

Seznam TLD (Top level domén)

Seznam všech TLD – domén prvního řádu.

4 minuty

Odstranění obsahu HTML elementu

Jak v JavaScriptu odstranit všechny potomky v určitém HTML elementu.

1 minuta

Lokalisace podle IP

Jak na základě IP adresy lokalisovat návštěvníka webu.

1 minuta

Gamepad API

Jak webovou stránku ovládat gamepadem.

1 minuta

JS událost oninput

JavaScriptová událost oninput zachytí práci s formulářovými políčky.

2 minuty

File_get_contents a timeout

Jak omezit maximální čas získávání obsahu stránky z URL.

2 minuty

FTP v Sublime Text

Jak se připojovat k FTP v editoru Sublime Text.

2 minuty

Seznam TLD ke stažení

Aktuální seznam všech TLD domén ve formátu JSON a PHP pole.

1 minuta

Skrývání a odkrývání s data-atributy

Zobrazování a skrývání obsahu elegantněji s využitím vlastních atributů.

1 minuta

Text-stroke

CSS vlastnost text-stroke vytváří okraj písmen podobně jako vlastnost border u boxů.

1 minuta

Záznamy z SQL za poslední hodinu, den, měsíc

Jak vybrat z SQL databáse záznamy za poslední minutu, hodinu, den, týden, měsíc atd.

2 minuty

CSS selektory :valid a :invalid

CSS selektory :valid a :invalid umí rozpoznat správně nebo špatně vyplněné formulářové políčko.

2 minuty

PHP pole $_SERVER

Co užitečného obsahuje v PHP vestavěná proměnná $_SERVER.

1 minuta

Inline-block a bílé znaky

Při zadávání šířky elementům s display: inline-block je nutné myslet na bílé znaky (whitespace).

1 minuta

Spuštění PHP v Sublime Text

Při programování v PHP se občas hodí testovat (spouštět) skript přímo v editoru.

1 minuta

WordPress spam registrace

Jak zabránit falešným spam registrací robotů ve WordPress.

1 minuta

Noreferrer

Řetězec rel=noreferrer umožňuje nastavit odkazu, že nemá posílat informace o předešlé navštívené stránce.

1 minuta

Universální hover efekt pro různé barvy pozadí

Jak vytvořit universální :hover efekt pro různě barevná tlačítka.

2 minuty

Překlad stránky

Snadná lokalisace webu do různých jazyků.

2 minuty

CSS counter

Automatické číslování v CSS za pomocí counter-increment, counter-reset a counter.

2 minuty

CSS vlastnost content

CSS vlastnost content slouží k zapisování obsahu do stránky z kaskádových stylů.

2 minuty

Převedení PHP do JavaScriptu

Jak převést PHP kód do JavaScriptu.

2 minuty

Odsazení písmen a slov

Nastavení odsazení jednotlivých písmen (letter-spacing) a mezer mezi slovy (word-spacing).

1 minuta

Je stránka aktivní?

Zjišťování, jestli je stránka aktivní a zda návštěvník něco dělá.

1 minuta

Přidání nové stránky do Google Analytics

Jak přidat nový web do měření návštěvností službou Google Analytics.

1 minuta

Měření rychlosti SQL dotazu

Měření rychlosti provedení SQL dotazu.

2 minuty

Metody getElementById a getElementsByTagName

Vybírání elementů v JavaScriptu metodami getElementById, getElementsByTagName a getElementsByClassName.

3 minuty

Automatické generování obsahu stránky

Automatické generování obsahu HTML stránky v JavaScriptu i PHP.

3 minuty

Znak dolaru v regulárním výrazu

Jak zapsat znak dolaru v regulárním výrazu v PHP.

1 minuta

Ikona přehrávání v <title>

Symbol přehrávání ▶ v titulku stránky jako je u videí na YouTube.

1 minuta

Gradienty v CSS

Jak vytvořit barevný přechod (gradient) přímo v CSS bez použití obrázku.

3 minuty

Přístup k prvkům formuláře v JS

Jakými způsoby je možné získávat hodnoty prvků formuláře v JavaScriptu.

3 minuty

BB kód v PHP

Formátování příspěvků pomocí BB code v PHP. Převod BB kódu do HTML.

4 minuty

Ovládání webu klávesami v JavaScriptu

Odchytávání stisknutých kláves a vytváření klávesových zkratek v JavaScriptu.

2 minuty

Confirm

Confirm je JavaScriptová hláška pro potvrzení akce. Jak ji používat nebo nahradit vlastním dialogovým oknem.

1 minuta

Otevírání nového okna

Možnosti, jak otevřít stránku do nového okna / nového tabu prohlížeče.

3 minuty

Zamykání MySQL tabulek

K čemu slouží, kdy a proč používat zamykání tabulek příkazem LOCK TABLE.

3 minuty

MySQL a transakce v PDO

K čemu slouží, jak a proč používat transakce při používání MySQL v PDO.

2 minuty

Position: fixed

Různé způsoby využití fixované posice v CSS.

1 minuta

CSS animace průběhu načítání

Jak využitím CSS transition a špetky JavaScriptu vytvořit animované znázornění průběhu načítání, jako je třeba na YouTube.

2 minuty

Vytváření modulů v JavaScriptu

Jak psát složitější věci v JavaScriptu. Obalit společné funkce do „modulů“.

3 minuty

Adresa a mapa

Jak správně zadávat na webové stránce svou adresu a jako zajistit její zobrazení na mapě.

2 minuty

Elementy documentElement a body v JavaScriptu

Co se skrývá pod document.body a document.documentElement. Jaká je podpora v prohlížečích.

1 minuta

Scope v JavaScriptu

Co to je a k čemu slouží „scope“ při programování v JavaScriptu.

2 minuty

HTML atribut placeholder

HTML atribut placeholder slouží k zadání ukázkové hodnoty do formulářového pole.

3 minuty

DOM (Document Object Model)

Co je to v prostředí HTML stránky DOM (Document Object Model) a jak se liší od zdrojového kódu.

2 minuty

Margin v CSS

CSS vlastnost margin slouží k vytvoření odsazení kolem elementu, který má margin nastavený.

4 minuty

Vlastní atributy v HTML

Jak je to s vytvářením a používáním atributů s vlastními názvy v HTML stránce.

2 minuty

Emmet a časté zkratky

Nástroj Emmet usnadňuje a zrychluje psaní HTML/CSS kódu. Seznam často používaných zkratek.

1 minuta

Zobrazení avataru z Twitteru

Jak na svém webu zobrazit avatar uživatele z Twitteru, známe-li jeho jméno/přezdívku.

2 minuty

Rychlé kliknutí a vyvolání události

Jak zajistit, aby ovládací prvky uživatelského rozhraní reagovaly správně i na rychlé kliknutí.

2 minuty

Box-sizing

CSS vlastnost box-sizing dokáže změnit vypočítávání rozměrů boxu.

2 minuty

Tutoriál na webu

Jak vyrobit jednoduchý tutoriál pro seznámení se s webovou aplikací.

3 minuty

Převod CSS v HTML na externí styly

Jak z HTML vybrat id, třídy a inline styly a vytvořit z nich CSS předpis do externího souboru.

1 minuta

Seznam českých Google písem – making of

Postup, kterým jsou vybírána a určována písma s českou diakritikou z Google Fonts.

2 minuty

Česká písma z Google Fonts

Seznam fontů z Google Fonts, které obsahují znaky s diakritikou pro psaní českého textu.

5 minut

Animace čísel

Animování číselných dat pomocí JavaScriptu.

1 minuta

ASCII kreslení

Nástroj pro pohodlné ASCII kreslení ve zdrojovém kódu.

1 minuta

Generátor CSS šipek

Generátor šipek/trojúhelníků přímo v CSS pomocí okrajů. Funkční i ve starých IE.

1 minuta

Rozbalování a sbalování obahu v CSS

Jak skrývat a odkrývat části stránky v čistém CSS bez jakéhokoliv JavaScriptu.

1 minuta

Odkaz na kotvu a fixní hlavička

Při použití fixního menu/hlavičky se stane nepěkná věc, že při odkazu na kotvu je cíl skryt pod menu. Co s tím?

1 minuta

Detekce blokování reklam Adblockem

Jak detekovat, že si uživatel na stránce blokuje reklamy. Dá se „ad block“ obejít?

2 minuty

Responsivní obrázky

Co s obrázky na mobilních zařízeních?

3 minuty

Změna location.hash bez posunu stránky

Jak změnit location.hash bez posunutí stránky.

1 minuta

CSS ikony

Ikony bez obrázků v čistém CSS.

2 minuty

Offline webová stránka

Jak umožnit návštěvníkům stažení celé webové stránky pro prohlížení offline, umístění na CD apod.

2 minuty

Obrana proti spamu

Jak se na webu bránit spammerům z řad robotů i návštěvníků.

5 minut

Zvyšování hodnoty inputů

Jak zpříjemnit zadávání číselných hodnot nebo času do <input>ů tlačítky plus a mínus.

1 minuta

Odpočítávání času v HTML

Jak udělat na webu odpočítávání času. V JavaScriptu i v čistém CSS.

2 minuty

Spojení CSS a JS souborů do jednoho

Zrychlit načítání webu pomůže sloučení CSS a JavaScriptu do jednoho souboru. Hotové řešení v PHP.

2 minuty

Proměnné v CSS – var()

Proměnné přímo v CSS přes funkci var().

2 minuty

Zavřít vše

Když se záložky v prohlížeči přemnoží, řešení je zavřít vše a osvobodit se.

2 minuty

CSS vlastnost all

Resetování CSS pravidel vlastností all.

1 minuta

Značka <button>

Tlačítko <button> v HTML, možné problémy v Internet Exploreru a jak je vyřešit.

2 minuty

Responsivní komentáře

Jak některé části stránky načítat jen při určité velikosti obrazovky.

2 minuty

Stylování formulářových políček a tlačítek

Které CSS vlastnosti si ohlídat při dosahování perfektního stylu vstupní políček a odesílacích tlačítek.

2 minuty

HTML značka <template>

HTML tag <template> slouží k připravení HTML kódu, který později zpracuje JavaScript.

2 minuty

CSS sprite

Spojení všech obrázků do jednoho (CSS sprite) zrychlí načítání webu. Hotový generátor v PHP.

4 minuty

Plynulý přesun focusu

Plynulé přesouvání focusu mezi jednotlivými položkami formuláře.

1 minuta

JavaScriptové události myši

Popis všech možných událostí, které lze v JavaScriptu vyvolat myší. Návod, jak je odchytávat a blokovat.

8 minut

Magnific Popup – zajímavý lightbox skript

Rozumně napsaný, universální a dobře použitelný lightbox skript.

2 minuty

Počet znaků a slov v textu

Jak spočítat délku (počet znaků), počet slov, řádků nebo odstavců v textu.

2 minuty

CSS pointer-events

Vlastnost pointer-events umožňuje zrušit reakci na události vyvolané myší.

1 minuta

HTML značka <meter>

Značka <meter> slouží k indikaci čísla.

2 minuty

Dvě domény na jednom Wedos hostingu

Jak u Wedosu na jednom hostingu provozovat další doménu zdarma.

2 minuty

Procházení značek v JavaScriptu

Jak cyklem procházet značky v JavaScriptu. Popis různých možností.

2 minuty

Výběr elementů querySelectorem

Metoda querySelector a querySelectorAll zjednodušuje výběr elementů v JavaScriptu.

2 minuty

CSS hyphens

Vlastnosti hyphens ovlivňuje rozdělování slov spojovníkem na konci řádku.

2 minuty

Šířka tabulátoru tab-size

Jak pomocí CSS změnit šířku tabulátoru ve zdrojovém kódu.

1 minuta

HTML Imports

HTML importy umožňují připojit/vložit do stránky jiný HTML dokument.

2 minuty

Velikost Facebook coveru

Jaké má rozměry „Facebook cover“ a profilová fotka. Jak je profilový obrázek umístěn.

2 minuty

Responsivní tabulky

Co udělat s tabulkami, aby se rozumně zobrazovaly na mobilech/tabletech.

3 minuty

Uvozovky v CSS

Vlastnost quotes umožňuje nadefinovat uvozovky, které se okolo značky objeví.

1 minuta

CSS resize

Možnost roztahovat element pomocí CSS vlastnosti resize.

2 minuty

Výběr barvy

Jak umožnit uživateli vybrat barvu z palety (pomocí JavaScriptu i bez JS).

2 minuty

Více obrázků na pozadí

Jak v CSS jednomu elementu přiřadit více obrázků na pozadí.

2 minuty

Skrývání a odkrývání textu

Rozbalení a sbalení obsahu po kliknutí.

2 minuty

AJAX

Asynchronní načítání částí stránek a odesílání formulářů bez obnovení celé stránky.

5 minut

Vlastní kontextová nabídka

Jak po stisknutí pravého tlačítka myši zobrazit vlastní nabídku.

2 minuty

Zjištění souřadnic myši

Jak v JavaScriptu zjistit aktuální souřadnice myši (kursoru).

1 minuta

Změna URL bez obnovení stránky

Jak může JavaScript přes history.pushState změnit URL stránky bez znovunačtení.

3 minuty

Označení kódu nebo textu po kliknutí

Jak označit text nebo zdrojový kód jedním kliknutím. Je to vůbec rozumné?

2 minuty

Našeptávání značkou <datalist>

Pro napovídání možností při vyplňování <input>u lze v HTML 5 použít značku <datalist>.

1 minuta

Směr přijetí/odjetí myši z elementu

Jak zjistit, kterým směrem myš opustila element nebo odkud na něj přijela?

1 minuta

Internet Explorer 11

Co zajímavého z pohledu tvůrce webů přináší Internet Explorer 11.

2 minuty

Více náhledů videa

Jak při najetí myší na náhled videa zobrazovat další náhledy.

2 minuty

Změna vzhledu Google Mapy

Mapu od Googlu na vlastním webu je možné přestylovat do jiné podoby.

1 minuta

Lightboxová vstupní stránka ihned po načtení

Jak vytvořit lightbox okno, které po načtení stránky překryje obsah.

1 minuta

Fixní menu při rolování

Jak při odrolování stránky zafixovat menu na horní hraně obrazovky.

2 minuty

Oříznutí dlouhého textu

Má-li se delší text vyjít do přesného místa, je třeba kousek textu uříznout.

2 minuty

Bezpečnost webových stránek

Bezpečnostní risika na webových stránkách a jejich řešení a prevence.

7 minut

Horizontální navigace

Různé možnosti, jak vytvořit vodorovné menu s odkazy vedle sebe.

2 minuty

Má návštěvnost vliv na SEO?

Má smysl z pohledu SEO (či jiného) se hnát za co nejvyšší návštěvností?

2 minuty

JavaScriptová simulace atributu ismap

HTML atribut ismap umí zjistit souřadnice při kliknutí na obrázek. Jak na to v JS?

1 minuta

Formuláře a CSS reset

Dopad * {margin: 0; padding: 0} na formulářové prvky.

1 minuta

Událost onclick na různých elementech

Test události onclick na různých elementech při vyvolání myší i klávesnicí.

2 minuty

Získání obsahu cizí stránky

Jak v PHP a JavaScriptu získat obsah z cizí webové stránky.

2 minuty

Označení interních a externích odkazů

Odlišení interních a externích odkazů a odkazů na soubory čistě v CSS.

2 minuty

Rozmazání obsahu

Rozmazávání obsahu v různých prohlížečích.

2 minuty

Jednoduchá galerie v CSS

Galerie obrázků bez JavaScriptu pomocí CSS.

1 minuta

Automatické obnovení stránky při uložení

Nástroj LiveReload umí po uložení souboru v editoru automaticky obnovit tutéž stránku v prohlížeči.

1 minuta

HTML značka <select>

Popis, možnosti a vylepšení rozbalovacího výběru, HTML značky <select>.

2 minuty

Semantic UI

Semantic UI je CSS framework. Co nabízí a jak funguje?

2 minuty

Vlastnost hasLayout

Co je zač CSS vlastnost hasLayout a k čemu ji využít.

2 minuty

Průhledný obsah v CSS

Pro zprůhlednění obsahu existují různé možnosti. Nejen CSS vlastnost opacity.

3 minuty

Různé druhy HTML značek

Dělení HTML značek podle způsobu jejich otevírání a uzavírání.

3 minuty

Obrázek jako odrážka

V CSS je možné přidat textu (seznamu) obrázkovou odrážku, jaké to má úskalí a risika?

2 minuty

CSS vlastnost animation

Animování prvků na stránce pomocí čistého CSS s využitím @keyframes.

3 minuty

CSS 3 selektory ve starých IE

Doplnění podpory CSS 3 selektorů do starých prohlížečů pomocí JavaScriptu.

1 minuta

Obtékání v CSS

Detailní popis obtékání (float) a clearování v CSS, stavba stránky pomocí obtékání, vysvětlení možných risik a úskalí.

4 minuty

Popisek po najetí myší

Kterak zobrazovat obsah v tooltipu po najetí myši.

1 minuta

Nejpoužívanější CSS vlastnosti

Žebříček CSS vlastností dle jejich četnosti na webových stránkách.

3 minuty

Automatické zapamatování formulářů

Při vyplňování delších formulářů se je hodí obsah průběžně ukládat. Jak na to?

2 minuty

Používat id, nebo class?

Rozdíl mezi .třídou a #identifikátorem.

2 minuty

CSS vyhledávání a filtrování obsahu

Jak pomocí CSS se špetkou JS filtrovat obsah stránky nebo na ní vyhledávat.

3 minuty

Rotace obsahu

Napříč prohlížeči funkční řešení vytvoření svislého textu (otočeného o 90 stupňů).

1 minuta

HTML značka <progress>

Značka <progress> slouží k znázornění postupu. Co nabízí za možnosti?

2 minuty

Jednoduchý web v PHP

I web o pár stránkách je vhodné skládat automatisovaně. Jak na to v PHP?

3 minuty

Skutečné rozměry obrázku

Jak může JavaScript zjistit skutečnou výšku a šířku obrázku.

1 minuta

Box model

Co je to a jaký box-model si vybrat. Jaké jsou výhody a nevýhody.

3 minuty

Odkaz vypadající jako tlačítko

Odkaz jako tlačítko, nebo tlačítko jako odkaz? Postup, jak z odkazu vyrobit tlačítko a naopak.

2 minuty

Sloupce stejně vysoké

Různé možnosti, jak zajistit automatické roztažení různě vysokých sloupců na stejnou výšku.

2 minuty

Upload souborů bez obnovení stránky

Jak vytvořit ajaxové nahrávání souborů na server bez obnovení stránky.

2 minuty

PHP proxy skript na 50 řádků

Hotový PHP skript umožňující zobrazit web prostřednictvím jiné IP adresy.

3 minuty

Velký obrázek na pozadí stránky

Jak správně udělat obrázkové pozadí celé stránky, které se přizpůsobí velikosti okna.

3 minuty

Jak zakázat scrollování na stránce

Někdy se hodí zamezit uživateli v rolování, jaké existují možnosti?

1 minuta

Hotové řešení lazy-loadingu YouTube videí

Hotové řešení v JavaScriptu načítání videí z YouTube, až když jsou potřeba.

2 minuty

Živý náhled editovaného CSS

Jak docílit, aby se editované CSS v Sublime Text editoru v reálném čase aplikovalo v prohlížeči.

1 minuta

Kruhový obrázek

Různé možnosti vytvoření kruhového obrázku.

1 minuta

Animace na webových stránkách

Jak na webu vytvářet animace a přechody v HTML, CSS a JS.

2 minuty

Flat UI framework

Flat UI nabízí hotové uživatelské rozhraní založené na Bootstrapu, má smysl jej používat?

1 minuta

Emmet – efektivnější psaní kódu

Nástroj Emmet nabízí výrazné zjednodušení při psaní HTML a CSS kódu.

3 minuty

Pro jaké prohlížeče ladit svůj web

Jak určit, pro které prohlížeče webovou stránku optimalisovat.

3 minuty

Jak na mobilní (responsivní) web

Jak a proč vytvářet mobilní versi webu – responsive web.

4 minuty

Srovnávací test rychlosti prohlížečů

Je rychlejší Chrome 27, Firefox 22, Opera 15, nebo Internet Explorer 10?

1 minuta

Jak přidat stránku na Seznam a Google

Adresy, na kterých lze dát vyhledávačům vědět o svém novém webu.

1 minuta

Rozklikávací menu

JavaScriptové menu otvírající/zavírající se po kliknutí.

1 minuta

Získání náhledu/obrázku webu

Jak lze automaticky získat obrázkový náhled webové stránky.

2 minuty

Testování webů napříč prohlížeči

Možnosti, jak otestovat webové stránky v různých versích různých prohlížečů. Desktopových i mobilních.

3 minuty

Absolutně posicované pozadí

Jednoduché řešení vícebarevného pozadí absolutním posicováním.

1 minuta

Vyjížděcí menu v CSS

Jak vytvořit v čistém CSS vyskakovací menu.

1 minuta

Flexboxy

Flexibilní stylování boxů je jednoduší a schopnější alternativa k obtékání (float), ale zatím hudba budoucnosti…

4 minuty

Zapnutý a vypnutý JavaScript

Jak na webové stránce detekovat zapnuté nebo vypnuté skriptování.

2 minuty

HTML značka <base>

K čemu využít a na co si dát pozor u HTML tagu <base>?

1 minuta

Lazy loading YouTube videí

Jak načítat embedované video z YouTube, až když je potřeba.

2 minuty

Řešení nepřehledných stromových diskusí

Je-li na webu stromová diskuse s hodně příspěvky, může být pro diskutující obtížné udržet přehled, co četli a co ne.

2 minuty

Stylování HTML tabulek

Jednoduché barvení a další stylování značky <table>.

2 minuty

Odstranění vlastních návštěv v Google Analytics

Jak v Google Analytics vyloučit ze statistik svých webů vlastní návštěvy.

2 minuty

Černobílý styl obrázku

Jak v CSS zajistit černobílý styl běžného obrázku. Napříč prohlížeči stále panují rozdíly.

2 minuty

Obal <body>, nebo <div id=container>?

Ve standardním režimu lze značku <body> stylovat jako normální <div>. Má to cenu?

1 minuta

Speciální znaky v atributu class

Co takhle psát názvy tříd v HTML a CSS hezky česky s diakritikou. Funguje to?

2 minuty

Jak vytvořit fixovaný banner?

JavaScriptové řešení prvku, který při rolování zůstane stále viditelný.

2 minuty

CSS framework Kraken

Kromě populárního CSS frameworku Bootstrap existují i další zajímavé. Kraken je jeden takový.

1 minuta

Pokročilé stylování checkboxu

Díky selektoru :checked lze v podporujících prohlížečích (Explorer 9 a novější) vytvářet zaškrtávací <input>y neotřelé podoby.

2 minuty

Počítání v CSS pomocí calc()

Od Exploreru 9 a mimo starou Operu 12 lze přímo v CSS provádět jednoduché výpočty využitím calc().

2 minuty

Vlastní jednoduchý WYSIWYG editor

Chceme-li na webu zadávat text a běžná <textarea> už nestačí, řešením je napsat si vlastní WYSIWYG editor.

1 minuta

10 důvodů proč používám Sublime Text

Sublime Text (zkráceně ST) je textový editor vhodný pro webdesign. Proč jej používat?

2 minuty

CSS funkce toggle()

Nefunguje zatím snad nikde, měla by sloužit k pohodlnému zadávání hodnot pro zanořené elementy stejného názvu.

1 minuta

„Programování“ v HTML a CSS

I bez úprav logiky serverového skriptu lze lecčeho dosáhnout samotným CSS.

2 minuty

Animace v CSS pomocí transition

CSS vlastností transition lze na stránce docílit přechodových animací bez JavaScriptu.

2 minuty

Pročištění a opravení „prasáckého“ HTML

Jak z WYSIWYG editorů (jako třeba Word, starší TinyMCE/CKEditor) vytvořit rozumný a sémantický HTML kód.

3 minuty

Označení odkazu na kotvu, pokud je na ní odrolováno

U jednostránkových webů s fixní navigací (s odkazy na #kotvy) může být vhodné právě viditelnou (aktivní) položku zvýraznit.

2 minuty

20 důvodů proč používám Operu

Mých 20 důvodů, co mě drží u prohlížeče Opera.

3 minuty

Změna designu bez znovunačtení stránky

Jak snadno umožnit uživateli přepínat různé vzhledy stránky, tmavou/světlou variantu apod.

2 minuty

Tlačítka pro sdílení na sociálních sítích

Různé možnosti, jak mít na webu tlačítka pro sdílení na sociálních sítích.

3 minuty

Odrolování na určitý HTML tag

Nestačí-li běžné odrolování na HTML #kotvu, přichází na řadu JavaScript.

2 minuty

Vlastní vzhled formulářů

Jak vytvořit originálně vypadající formulář, aniž by házel uživatelům klacky pod nohy?

3 minuty

Jednoduché filtrování dat v čistém CSS

Při filtrování malého množství položek si lze od Internet Exploreru 9 vystačit jen s CSS.

1 minuta

Seznam všech CSS 3 selektorů

V CSS 3 je spousta selektorů, které s postupným mizením starších prohlížečů může dávat smysl znát.

9 minut

Nástroje pro vývojáře v prohlížečích

Pro testování a ladění webu existují (nebo je lze snadno doplnit) ve všech rozšířených prohlížečích vývojářské nástroje.

2 minuty

Úprava obsahu pomocí content a attr

Pomocí CSS vlastnosti content a funkce attr lze ovlivňovat z CSS výsledný textový obsah webu.

2 minuty

Náhled odkazu na Twitteru

Jak u odkazu na Twitteru zobrazit jeho náhled?

1 minuta

Zpožděné načtení obrázku, až když je potřeba

Kromě potřeby nahrát obrázek dopředu (preload), aby byl v době použití 100% připravený, může být potřeba opačná – načíst jej, až v momentě, kdy je potřeba. Z důvodu nemrhání datovým přenosem.

1 minuta

JavaScriptový framework Zepto.js

Odlehčená JS knihovna nabízející základní funkce jQuery ve zmenšené podobě.

1 minuta

Zachycení aktivování a deaktivování okna v JS

V JavaScriptu lze relativně snadno reagovat na aktivování nebo deaktivování okna/záložky/tabu.

1 minuta

Atribut pattern pro formulářové prvky

Validace formulářů regulárními výrazy na straně klienta bez JavaScriptu.

1 minuta

Vytvoření efektu baterky v CSS a JS

Jak jednoduše vytvořit na stránce efekt baterky? Tedy ztmavit web a prohlížet ho jakýmsi průzorem.

1 minuta

„Kreslení“ pomocí CSS

Jak vytvářet jednoduché tvary místo obrázků prostým CSS?

3 minuty

Ověření existence obrázku pomocí JS

Jak JavaScriptem ověřit existenci obrázku?

1 minuta

Značka <label> a atribut for

Značka <label> slouží ke svázání popisku s formulářovým prvkem. Kdy použít atribut for?

1 minuta

Body s popisky na mapě

Statická obrázková mapa s vlastními body a :hover popisky.

1 minuta

Zvýraznění aktivované kotvy (:target)

Pokud se v rámci stránky používají odkazy na jednotlivé #části, může být vhodné zvýrazněním ukázat, kam odkaz mířil.

2 minuty

Selektory :first-child a :last-child

Pro zaměření první/poslední položky v CSS lze místo přidávání tříd použít :first/last-child.

1 minuta

Podmíněné komentáře pro Internet Explorer

Jak rychle a snadno hackovat HTML a CSS v různých historických versích Internet Exploreru.

3 minuty

Zablokování některých kláves

Zablokování určitých kláves (šipek) pomocí JavaScriptu.

1 minuta

Česká lorem ipsum HTML šablona

Šablona s výplňovým textu z generátoru projevů.

3 minuty

Souborový správce elFinder pro TinyMCE 4

Čtvrtá verse WYSIWYG editoru TinyMCE změnila API pro připojení správce souborů, co s tím?

2 minuty

Webdesign

Webů tvorba

Novinky e-mailem

Když budu mít něco opravdu zajímavého, můžu vám to poslat e-mailem

Přidej se k 500+ čtenářům
Jen kvalitní obsah
Žádný spam

Web jecas.cz píše Bohumil Jahoda, kontakt
Seznam všech článků · Témata · Zkratky
2013–2026