Nové zdroje pro webové designéry a vývojáře (únor 2016)

Rok 2015 byl pro web skvělý: webové technologie byly přijata v mnoha formách mimo rámec budování webové stránky nebo webové aplikace. Mnoho mobilních a desktopových aplikací je nyní postaveno pomocí HTML, CSS a JavaScriptu. To je umožněno přenositelností webových technologií a knihoven jako React.js, Angular a Node.js.

V dnešní části této série jsme tedy sestavili několik knihoven JavaScriptu a CSS.

Klepněte na tlačítko Další zdroje

Najděte si celou naši sbírku doporučených zdrojů a nejlepší dostupné nástroje pro web design a vývoj.

Plochý posuvník

jQuery UI je dodáván se sbírkou běžného webového rozhraní včetně Slideru - uživatelského rozhraní, které umožňuje uživateli vybrat rozsah číselných hodnot. Plochý posuvník je webový nástroj, který umožňuje přizpůsobení stylu uživatelského rozhraní, které bylo kdysi velmi skličujícím úkolem, nyní mnohem snazší.

Utility Open-type

Utility Open-type je kolekce drop-in tříd aplikovat pokročilé typografické prvky CSS takové písmo ligatury, malé velké písmeno, a mnohem více. V podstatě poskytují nejlepší možný zážitek ze čtení pro vaše uživatele v jemných detailech. Dobře se zhoršuje ve starších, nepodporovaných prohlížečích.

ResponsifyJS

Jeden z notoricky známých omezení reagujících obrazů tváří je, že obvykle obraz řádně zmenšuje, ale to odvádí hlavní ohnisko obrazu, když je zmenšen na velmi malou velikost výřezu..

ResponsifyJS je lehká JavaScript knihovna, kterou můžete použít nastavte souřadnice pro zachování zaostření obrazu při změně velikosti.

Lineární

Lineární je aplikace vládce pro Mac. Můžete použít pravítko pro měření webových stránek, zjistit velikost prvku, aniž byste museli otevřít DevTools nebo zjistit, zda je prvek dokonale vycentrován. Můžete mít více pravítek a přepnout jednotku z PX na EM.

StickyStack

StickyStack je plugin jQuery pro vytvoření rolovacího zážitku zásobníku, když se panel dostane do horní části výřezu, drží se tam, zatímco další posouvání posouvá další panel nahoru. Je to lehký plugin s několika možnostmi konfigurace kontejneru stránky, sekce zásobníku a boxu stínů komínů. Podívejte se na demo.

Divák

Divák je jQuery plugin pro image lightbox - oblíbený způsob, jak přiblížit obrázky na webu. Plugin je dodáván s ohromující možnosti, které vám umožní přizpůsobit každý bit světelný box rozhraní.

Plugin také poskytuje sadu rozhraní API a vlastních událostí pro úplnou kontrolu nad světelný box reakce a chování. Navíc funguje v aplikaci Internet Explorer 8.

DeviceMock

DeviceMock je knihovna JavaScriptu, která vám umožní vytvořit rámy zařízení nebo makety telefon, tablet a pracovní plocha. Stejně tak knihovna poskytuje možnosti nastavení barvy motivu snímku, velikosti a orientace rámečku.

To může být dobrá alternativa k prezentaci svého webu a aplikace namísto použití Photoshopu.

Clrs

Clrs je iniciativou předefinujte výchozí barvy webů do modernějšího barevného tónu. Navíc podporuje sadu barevných kombinací pro lepší přístupnost. Tyto barvy můžete nasadit pomocí vzorníků barev NPM, Gem (Ruby) a Photoshop a Illustrator.

Colorify

Colorify je superlehká JavaScript knihovna (3kb minified) extrahovat dominantní barvy z obrázku pomocí spoustu API pro manipulaci s barvami. Extrahovanou barvu můžete použít jako zástupný symbol při čekání na úplné načtení obrázku, vytvoření pozadí přechodu nebo úpravu sousedního rozhraní tak, aby odpovídalo barvě obrázku..

BookBlock

BookBlock je plugin jQuery vytvořit brožuru s efektem překlopení stránky. Je to krásná alternativa k zobrazení více obrázků na vašich webových stránkách, zejména pokud existuje sekvence nebo tok, který chcete předvést.

Zde si můžete prohlédnout demo, abyste získali představu o tom, jak funguje BookBlock.