CSS

Google spustil mobile first indexaci. Podíl mobilních zařízení stále roste. Designéři, alespoň ti ukecanější, pořád mluví o mobile first návrhu webu. Stránky zrychlujeme i kvůli dobrému načítání na pomalém mobilním spojení. Napadlo mě se mrknout, jak jsou na tom české IT weby. Jde o obor, který by mohl být vzorem.

Definovatelné vlastnosti v CSS a také proměnné už mají dostatečně širokou podporu napříč webovými prohlížeči, takže je nejvyšší čas je začít používat. Respektive ten čas nastal už loni, takže pokud jste CSS proměnnými stále nepolíbeni, je nevyšší čas to změnit. Ušetříte si totiž práci.

Asi každý tvůrce webu je poté, co jej pokládá za dokončený, vyveden z omylu a začne řešit připomínky zákazníka. Patříte-li spíše k těm, kdo ty připomínky vytvářejí z pozice zadavatele, mrkněte na nástroj, který vám to výrazně usnadní.

Na jaře jsem byl na školení u Martina Michálka o optimalizaci rychlosti načítání webových stránek. Tedy optimalizaci především z hlediska frontendu. Získané vědomosti plus několik dalších věcí, na které jsem se chystal, jsem postupně vnesl na jednom webu do praxe a průběžně hodnotil, jaký měly přínos.

Jedna z posledních verzí webového prohlížeče Chrome obsahuje funkci umožňující snadno vyhodnotit, která CSS pravidla v jednotlivých souborech se styly váš web vůbec nepoužívá. Díky tomu jste tak teoreticky schopni svoje CSS optimalizovat a ušetřit něco na velikosti webové stránky.

Při tvorbě webu je občas nutné zkontrolovat, zda použité písmo odpovídá zadání, grafickému návrhu. Jindy se zase chcete podívat, jaké písmo použil někdo jiný. Je mnoho způsobů, jak to zjistit, použití nástroje WhatFont je však velice rychlé a pohodlné.

Z uplynulých konferencí se mi nahromadilo několik zajímavých odkazů, o které bych se s vámi rád podělil. V článku najdete pár tipů na služby pro stažení fontů, ikonek, souborů SVG a zjištění barev.

Dlouho jsem hledal řešení, které mi umožní být dostatečně mobilní a přitom s jistým komfortem pracovat na vývoji webů i na cestách. Myslím, že prozatím jsem našel to nejlepší. Kombinaci tabletu a povedeného programátorského editoru a správce souborů Coda.

Jedním z mnoha příjemných rysů uživatelského rozhraní administrace Drupalu je možnost nastavení vzhledu obsahu v editoru tak, aby odpovídal tomu, co pak uživatel vidí po uložení článku. Získá tak lepší představu o výsledné vizuální podobě textu.

Navzdory mnoha škarohlídům si programátorský editor od GitHubu s názvem Atom našel množství příznivců. Já jím v případě Windows nahradil už poněkud zastaralý PSPad a v případě Macu zdarma dostupný TextWrangler. Ostatně i Atom je dostupný zadarmo – jeho funkce jdou navíc rozšiřovat pomocí pluginů.

V záplavě nástrojů určených k testování responzivního designu webových stránek by vás mohl zaujmout relativně nový nástroj Resizer. Přišel s ním Google a od jiných se liší tím, že se velice snadno ovládá.

Ladění webů na mobilních zařízeních je vždy tak trochu problém. Jistě, máme tu spojení Safari s iOS, Chrome s Androidem, ale nic skutečně univerzálního a fungujícího na dálku. A proto přichází javascriptová knihovna a node.js aplikace Vorlon.js.

Čas od času si říkám, že by nebylo špatné některé HTML soubory a šablony zeditovat vizuální cestou. Platit Dreamweaver se mi nechce, proto mě příjemně překvapilo, že editory vycházející z Mozilly nejsou úplně mrtvé.

Ladit responsivní weby je zdánlivě jednoduché. Prostě si zmenšíte okno webového prohlížeče a upravujete styly. V okamžiku, kdy potřebujete reagovat na přesné rozměry, potřebujete něco sofistikovanějšího. Nabídnou vám to  Firefox i Chrome v základní výbavě.

Relativně novou knihu od Zoner Pressu mám někdy od léta. Často jsem v ní listoval, nakonec ji z větší části přečetl postupně od začátku do konce. Responzivní design je aktuální téma pro všechny webdesignéry a nelze jej ignorovat. Jak vám s tím tato kniha pomůže?