Verse hulpbronnen voor webontwerpers en ontwikkelaars (augustus 2016)

In dit artikel bevatten we een lijstkaders en hulpmiddelen die dat wel zijn gericht op webontwikkeling. Interessant is dat ik een paar van deze tools en frameworks heb gevonden van gigantische bedrijven zoals Microsoft en Alibaba.

Dit is een goed teken, omdat meer bedrijven nu bijdragen aan open-source en bijdragen aan een beter web. Laten we eens kijken naar wat de samenstelling van deze maand te bieden heeft.

Klik voor meer bronnen

Ontdek onze volledige verzameling aanbevolen bronnen en de beste beschikbare hulpmiddelen voor webontwerp en -ontwikkeling.

CuteStrap

Een UI-framework gebouwd bovenop Sass. Het wordt geleverd met de meest gebruikelijke webinterfaces, zoals formulieren, navigatie en knoppen, die in veel gevallen voldoende zouden moeten zijn. Als je populaire frameworks als Bootstrap en Foundation overweldigend vindt, Cutestrap is misschien een goed alternatief voor jou.

HTML5-test

HTML5-test is een online tool die test hoe ver een browser de nieuwste HTML5-specificaties ondersteunt. Het is een handige tool voor iedereen die betrokken is bij het debuggen en testen van moderne webapplicaties.

Browser Calorieën

Browser Calorieën is een Chrome-extensie die het gewicht van een webpagina meet. Het scant de geladen bestanden en hun bijdrage tot het totale gewicht van de pagina. Een geweldig hulpmiddel om u te helpen de prestaties van uw website te optimaliseren.

weex

weex is een raamwerk van Alibaba om mobiele apps te bouwen met alleen HTML, CSS en JavaScript. Het wordt geleverd met modules, UI-componenten, zijn eigen DevTools en CLI dat is ontworpen voor een mobiele omgeving en om de ontwikkeling te versnellen.

Microsoft Web Framework (MWF)

Een framework van Microsoft, de UI-componenten in MWF is gebouwd op basis van de moderne ontwerptaal van Microsoft: plat, schoon en minimalistisch. Dit raamwerk, afgezien van de UI-componenten, geeft ook richting aan het gebruik van kleuren, typografie en animatie. Ik denk dat Material Design Lite eindelijk een gelijkwaardige mededinger heeft ontmoet.

vitaal

vitaal is een raamwerk met een zeer aangename minimale interface. Het is licht van gewicht, heeft geen JavaScript en is van oorsprong Rogue - een syntax-lichter op basis van Ruby.

Fontea

Fontea is een gratis Photoshop-extensie om honderden Google-lettertypen eenvoudig te beheren en toe te passen. U kunt het lettertype vanuit Photoshop zoeken, een voorbeeld bekijken en het lettertype rechtstreeks in uw ontwerp toepassen - uw werkstroom stroomlijnen.

Motregen

Dit is een hulpmiddel waarmee u UI-patronen of stijlgids voor uw website kunt maken. Het genereert items zoals de kleuren, basisstijlen of lay-out voor componenten, evenals het codefragment. Een stijlgids generator zoals Motregen laat u toe om consistent te blijven met uw websitestijlen.

intercooler

InterCoolerJS is een JavaScript-bibliotheek die het toepassen van AJAX op uw website net zo eenvoudig maakt als het toevoegen van HTML-kenmerken. Het wordt geleverd met een uitgebreide handleiding en tal van voorbeelden om u te helpen aan de slag te gaan met het gebruik van de tool.

Picla

Picla is een plug-in voor jQuery om afbeeldingslabels weer te geven die uit de afbeelding zijn opgehaald alt attribuut. Het biedt een aantal opties waarmee u aangepaste stijl en beweging aan het label kunt toevoegen. Picla kan worden geïnstalleerd als uw website-afhankelijkheid met Bower.

IziModal

Hier is een jQuery-plug-in om te laten zien modaal popups. IziModal heeft veel opties voor personalisatie. U kunt bijvoorbeeld de animatie, tekstinhoud, kleuren aanpassen. Het is licht van gewicht, responsief en klaar voor het netvlies.

MegaBoilerplate

MegaBoilerplate is een generator om snel een ontwikkelingsstack in te stellen. Ga naar de website en selecteer welke hulpmiddelen en bibliotheken (Node.js, HTML5, Vanilla JavaScript en Electron) u als uw website baseert. Het compileert en configureert alle dingen die je nodig hebt in een gecomprimeerd pakket, klaar om te downloaden.

brulaap

Een JavaScript-bibliotheek om moderne audiospelers weer te geven met Web Audio API, brulaap werkt in browsers zo oud als IE9 en ondersteunt vele audiocodecs zoals MP3, WEBM, WAV. Veel functies, modulair en werkt zonder externe bibliotheek.

SuperEmbed

SuperEmbed is een kleine JavaScript-bibliotheek die ingesloten objecten responsief maakt, met behoud van de oorspronkelijke verhouding. Het ondersteunt een breed scala aan bronnen, waaronder YouTube, Flickr, Vine, VideoPress en DailyMotion. Zie de demo.

CleaveJS

klieven is een JavaScript-bibliotheek die automatisch waarden opmaakt in de invoer. Het kan bijvoorbeeld het duizendscheidingsteken in valuta-invoer toevoegen, ruimte toevoegen aan het invoeren van creditcardnummers of toevoegen / in datuminvoer. Gebruik deze bibliotheek om een betere gebruikerservaring te bieden.

Flippen typisch

FlippingTypical kunt u alle lettertypen bekijken die op uw systeem zijn geïnstalleerd. Ik vind deze app handiger dan het gebruik van de FontBook app in macOS. Ik typ willekeurige tekst en zie welke van de lettertypen op mijn systeem er het beste uitzien.

lichttafel

Een nieuwe IDE waarvan ik denk dat het de moeite van het onderzoeken waard is. Het begon als een KickStarter-project, ondersteund door Matt Mullenweg (oprichter van WordPress), en ging uiteindelijk open source. Je kunt deze video bekijken om een idee te krijgen van hoe cool deze IDE is.

Compressor

Compressor is een webapp die beeldbestanden comprimeert tot in het kleinste formaat zonder de visuele kwaliteit te verliezen. Het ondersteunt ook JPG, GIF, PNG en SVG. Deze app is gratis.

Microsoft Site Scan

Dit is een handige tool van Microsoft om uw website te analyseren op zaken als browsercompatibiliteit en toegankelijkheid. De tool geeft een rapport weer waarin staat of iets niet in orde is met uw website en hoe u kunt doorgaan om het probleem aan te pakken. Probeer het eens!

Bloggen uitschakelen

Deze plug-in verwijdert, zoals de naam al aangeeft, blogfuncties zoals berichten, opmerkingen en feeds. Het is de juiste plug-in voor u als u de blogfunctie in WordPress niet nodig heeft.