A zjistil jsem že jsou úžasné v tom že když okno prohlížeče zmenším pod 1000px, automaticky zmizí i červený div „Hledání„. Nainstaloval jsem si emulátor prohlížeče iPhonu a tam to vypadá takhle:
Zajímavostí je, že iPhone pracuje u device-height s celou šířkou obrazovky, vč. ovládacích prvků prohlížeče, lišty atd. To mě ale zase nemusí tak štvát, stejně v 99% případů budu stránku optimalizovat na nějakou šířku a nikoliv výšku (stránky se budou stejně natahovat dolů, když budou na displejích s menším rozšířením). Responzivní web design se skládá ze 3 základních složek:
-
Flexibilní struktura – tu jsem taky použil, tedy zadával rozměry v %. Je to dobrá vychytávka. -
Flexibilní obrázky – s těmi se teprve budu učit pracovat, ale myslím že to nebude nic těžkého. -
Media Queries – to je to o čem je začátek tohoto blogpostu.
O stěžejších základech se dočtete na wiki: https://cs.wikipedia.org/wiki/Responzivn%C3%AD_web_design . A teď k samotnému nadpisu. Zatím jsem vytvářel weby v ASP.NET + CSS + HTML + JS (buď původní nebo zkompilovaný z TypeScriptu) a přemýšlel jsem jak udělat svoje stránky více dynamičtější a animovanější a chtěl jsem zabít hned 2 mouchy jednou ranou – když už se učit něco nového, tak pořádně z gruntu. Proto jsem si řekl že budu mít další web v PHP (který budu psát ve VS s extension 👻 Visual Studio Gallery Microsoft v roce 2018 zavřel. které se sice platí, ale tak nějakých 750Kč za rok snad bych mohl utratit když budu aktualizovat obrok, furt lepší než programovat v něčem jiném než ve VS). 🐘
Tak uvidíme jestli to vzdám jako všechny moje ostatní pokusy s PHP. Edit den poté: Už jsem s PHP zase skončil, nesnáším Javovské IDE a ty extensiony do PHP jsou nedopracované, je to skoro jako Linux, furt tam něco nefunguje :D.