Kapitoly knihovny stylů

Alert

Zpětná vazba po odeslání formuláře atd.

Děkujeme!

Brzy se ozveme a dohodneme spolu detaily.


Ad

Absolutně nebo fixně pozicovaný buttonek s reklamou, nejčastěji u článku.

Školení
responzivního webu

Naučte se jej od
autora článku na
kurzu 16. 1.


Article

Dlouhý text s odsazenými nadpisy, podrženými odkazy atd.

Definice responzivního webdesignu z doby před třemi a půl lety je dnes nedostačující. Problémy jsou především v rychlosti načítání webů a efektivitě práce. Myslím si, že za oba z velké části mohou naše pracovní postupy.

Pojďme se podívat na dva weby — jeden je podle převládající zkomolené definice responzivní, druhý naopak ne:

Obrázek

Pojďme si zopakovat pár stručných tipů, které z pomalosti načítání responzivních webů udělají rychlosti:

  • Obligátní, ale stále platné trio rad zní: 1) Testujte na pomalých připojeních 2) Minimalizujte počet requestů 3) Minimalizujte datový objem stránky.
  • Největší datový objem mívají stránky v obrázcích. A na různé verze obrázků pro různá zařízení máme Picturefill.
<link rel="stylesheet" href="smartphone.css" media="(max-width: 480px)">
<link rel="stylesheet" href="tablet.css" media="(min-width: 481px) and (max-width: 1023px)">
<link rel="stylesheet" href="desktop.css" media="(min-width: 1024px) and (max-width: 1280px)">
<link rel="stylesheet" href="desktop-large.css" media="(min-width: 1281px)">
  

Articles

Seznam článků

Nové školení: Bootstrap a frontend frameworky

Novou vlnu front-end frameworků a hlavně Bootstrap a Foundation už pěkně dlouho považuji za skvělé nástroje. A mám radost, když vidím kolik dokáží ušetřit práce když se správně používají.

State of the art responzivních technikálií

Definice responzivního webdesignu z doby před třemi a půl lety je dnes nedostačující. Problémy jsou především v rychlosti načítání webů a efektivitě práce. Myslím si, že za oba z velké části mohou naše pracovní postupy.

Proč nepsat CSS deklarace do jednoho řádku?

Třetina z vás už dávno ví, jaké zlo jsou jednořádkové deklarace pro organizaci kódu, třetina váhá a třetina jednořádkové deklarace prostě píše všude. Tohle je text pro druhou a třetí třetinu.


Box

Boxík s barevným pozadím použitelný uvnitř textu: .box

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas, odio, minima quaerat suscipit tenetur sunt soluta ipsum esse atque numquam nobis veritatis magni ratione quibusdam ea possimus modi quo nam?

Boxík s barevným pozadím použitelný uvnitř textu: .box.box--higher

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas, odio, minima quaerat suscipit tenetur sunt soluta ipsum esse atque numquam nobis veritatis magni ratione quibusdam ea possimus modi quo nam?


Button

Obyčejné tlačítko:

Tlačítko přes celou šířku:


Course Response

Seznam ohlasů na školení

  • Jan Štráfelda, ředitel, Adaptic, s.r.o. :

    „Školení Martina Michálka vřele doporučuji. V oblasti webového frontendu má obrovský rozhled a nové technologie důkladně osahané.”

  • Pavla Sluková, GrandIT.cz :

    „Školení bylo výborné, přínosné. Povedlo se do toho omezeného času vměstnat opravdu hodně informací, které pro mě byly nové.”

  • Vlastimil Fišer :

    „Celé školení „házel” Martin skvělé tipy na online/offline aplikace, které vám usnadní vývoj a bude s nimi tvorba webů o kousek příjemnější.”

  • Jirka Ludvar :

    „Skvělé školení Dnešní webový front-end by @machal Díky!”

Foot

Patička s posledním textem na stránce.


Obsah na této stránce je publikován pod Creative Commons licencí Uveďte autora, neužívejte komerčně 3.0 Česko
martin@vzhurudolu.czdalší kontakty


Form

Formuláře.

Objednávka

místa pro kurz „Bootstrap a front-end frameworky” na 30. 1. 2014


Socialicon

Ikonky sociálních sítí v ikonfontu.


Items list

Jednoduchý seznam odkazů používaný třeba v příručce.


Card

Seznam článků, školení atd.

7 poznámek o přístupnosti z WebExpo 2014

30. 9. 2014

Radek Pavlíček s Romanem Kabelkou vedli v předvečer letošního WebExpa hodně zajímavý workshop Přístupnost pro kodéry. Za mě prima přiležitost k aktualizaci znalostí od odborníků na slovo vzatých.

Podzimní termíny školení a nové prostory k tomu

28. 8. 2014

Výrazněji jsem zaktualizoval obsah „Dnešního webového frontendu” a celodenní školení přesunul do Konferenčního centra Greeenpoint. Ale ani kurzy Gruntu/Gulpu, responzivního webdesignu nebo Bootstrapu nejsou bez novinek. Pojďme si o nich prozradit více.

Tim Kadlec krátký

19. 8. 2014

V originále s drobnými výhradami výborný text. V češtině výrazně zabugovaná knížka. I tak vám ale doporučím si ji koupit. Je to totiž první a zatím jediná česká publikace o responzivním webdesignu.

Proč adaptivní, ne responzivní. A proč to responzivní zůstane

4. 8. 2014

Obor, o kterém v poslední době píšu, školím a přednáším se nejmenuje responzivní webdesign. Je to webdesign adaptivní.


Seznam školení s termíny.

Grunt.js a Gulp.js

Grunt.js a Gulp.js

Grunt, Gulp, Bower nebo Yeoman vám po tomto školení pomohou zautomatizovat a obohatit vaše pracovní postupy. Kurz vede Riki Fridrich.

AngularJS

AngularJS

Naučte se populární framework, který definoval průmyslové standardy pro tvorbu single-page webových aplikací. Kurz vede Robin Pokorný.

Logo

Logo a taglina.


Avatar

Fotka autora.


Navigace

Záložková navigace .nav

Kategorie příručky

Varianta pro hlavní navigaci webu .nav.nav--site:

Stránkování

.pagination


Section Head

Hlavička sekce. Použití je vidět v zelené ploše pod nadpisem stránky.


Share

Sdílecí tlačítka na konci článků.