Friske ressurser for webdesignere og utviklere (februar 2016)

2015 var et flott år for Internett: webteknologier har vært vedtatt i mange formfaktorer utover for å bygge en nettside eller en webapplikasjon. Mange mobile og stasjonære programmer er nå bygget ved hjelp av HTML, CSS og JavaScript. Dette er muliggjort av mobilitetsteknologiens og bærbarhetens bærbarhet som React.js, Angular and Node.js.

Så i dagens avdrag av denne serien har vi satt sammen en håndfull JavaScript- og CSS-biblioteker.

Klikk for flere ressurser

Finn hele vår samling av anbefalte ressurser og de beste verktøyene for webdesign og utvikling.

Flat Slider

jQuery brukergrensesnitt leveres med en samling av felles webgrensesnitt, inkludert en glidebryter - et brukergrensesnitt som lar brukeren velge en rekke numeriske verdier. De Flat Slider er et nettverktøy som gjør tilpassing av JQUery UI-stilen, som en gang var en veldig skremmende oppgave, mye lettere nå.

Utility Open-type

Utility Open-type er en samling av innfallsklasser til Bruk avanserte CSS typografiske funksjoner slike skriftlig ligaturer, små bokstaver og mye mer. De gir i utgangspunktet den best mulige leseopplevelsen for dine brukere i fin detalj. Det degraderer pent i eldre, ikke støttede nettlesere.

ResponsifyJS

En av de beryktede begrensningene som er følsomme bilder, er at det vanligvis skaler bildet riktig, men dette avleder hovedfokuspunktet til bildet når det skaleres ned til en meget liten viewportstørrelse.

ResponsifyJS er lett JavaScript-bibliotek som du kan bruke til sett inn koordinater for å opprettholde bildefokuset mens den blir endret.

lineær

lineær er en linjal app for Mac. Du kan bruke linjalen til å måle nettsider, finne ut størrelsen på et element uten å måtte åpne DevTools, eller finne ut om et element er perfekt sentrert. Du kan ha flere linjaler, og bytt enheten fra PX til EM.

StickyStack

StickyStack er et jQuery-plugin for å lage en stablingopprullingsopplevelse, når et panel når toppen av visningsporten, stikker den der, mens videre rulling trekker opp neste panel. Det er et lett plugin med noen få muligheter til å konfigurere sidebeholderen, stakk delen, samt boksskyggen på stablene. Sjekk ut demoen.

Viewer

Viewer er jQuery-plugin for bilde lightbox - en fancy populær måte å zoome inn bilder på nettet. Pluggen kommer med et overveldende alternativ som lar deg tilpasse hver bit av lysboks grensesnitt.

Pluggen gir også et sett med APIer og egendefinerte hendelser for total kontroll over lysboks respons og oppførsel. I tillegg fungerer det ned til Internet Explorer 8.

DeviceMock

DeviceMock er et JavaScript-bibliotek som lar deg opprett enhetsrammer eller mockups for eksempel en telefon, en nettbrett og et skrivebord. På samme måte gir biblioteket muligheter for å angi rammens temafarge, størrelsen, samt rammeorienteringen.

Det kan være et godt alternativ for å vise frem din web og app i stedet for å bruke Photoshop.

Clrs

Clrs er et initiativ til omdefinere standard webfarger til en mer øye-vennlig, moderne fargetone. I tillegg foreslo det et sett med fargekombinasjoner for bedre tilgjengelighet. Du kan distribuere disse fargene gjennom NPM, Gem (Ruby), og Photoshop og Illustrator fargeprøver.

Colorify

Colorify er et super lett JavaScript-bibliotek (3 kb minifisert) til trekk ut dominerende farger fra et bilde med masse APIer for å manipulere fargene. Du kan bruke den ekstraherte fargen som plassholder, mens du venter på at bildet skal lastes helt, generere en gradientbakgrunn, eller juster grensesnittet for å møte bildefargene.

BookBlock

BookBlock er jQuery plugin til lage et hefte med siden-flip effekten. Det er et vakkert alternativ til å vise flere bilder på nettstedet ditt, spesielt hvis det er en sekvens eller strøm som du vil presentere.

Du kan sjekke ut demoen her for å få en ide om hvordan BookBlock fungerer.