Better sharing buttons, smarter caching, a cool new code editor and lots of clever interface hacks.

 In Web Design

This month we’ve got a collection of handy utilities that help you to do things in smarter ways: better forms; better select boxes; better social media sharing buttons that don’t have annoying behaviours such as tracking the user. There’s a service worker that improves caching by only downloading changes instead of the whole file, and a tool for handling user-generated content on static sites. Enjoy!

01. Visual Studio Code

People are saying good things about this free, open-source code editor from Microsoft that has a slew of great features that make coding quicker. There’s a function called IntelliSense that provides smart completions; built-in Git commands; debugging from within the editor and much more.

02. WTF, forms?

Bootstrap creator Mark Otto has made these friendlier HTML form controls to make it easier to build forms the way you want them. Designed for IE9+ and the latest Chrome, Safari, and Firefox.

03. Staticman

People usually use a third-party service to run things like commenting systems on static sites, but there’s another way. Staticman transforms user generated content into data files that are hosted in your GitHub repository with the rest of your content, so everything is in one place. Works well with Jekyll sites hosted on GitHub Pages.

04. Kubist

This neat web app uses d3.js to transform images into tessellated triangles. If you’re interested in creative coding, this blog post provides some background about the methods used.

05. Choices

Choices is a select box and text input plugin that’s lightweight (around 15kb gzipped), customisable and have no jQuery dependency. There’s configurable sorting, flexible styling, fast search/filtering, a clean API and right-to-left support.


The sharing buttons provided by social media sites aren’t the greatest; they’re slow to load, and they often download multiple files and track the user across the web. These ones are much more palatable: they load fast because they don’t use JavaScript; they don’t get in the way of your site rendering; they’re accessible and they don’t do tracking.

07. SW-delta

Here’s a really great service worker to help with continuous delivery. Without it, every time a file is changed – even if the change is only one letter – the whole new version gets downloaded, wasting bandwidth and hurting performance. SW-delta compares the new version with the cached version and makes the browser download only the changes instead of the whole file. The creator says it isn’t production ready yet, but if you think this could be of use to you it’s a great project to jump on board with.

08. ShiftJS

Still in early development, but nevertheless a working Shift to JavaScript transpiler written in JavaScript.

09. SVG Porn

Don’t worry; it’s not porn made of SVG. This site has around 800 high-quality logos done in SVG for lots of different services, available for your use.

10. Jekyll Compress

This Jekyll layout compresses HTML by removing whitespace and any other unnecessary elements. It is written in Liquid, the open-source templating language created by e-commerce platform Shopify.

Originally by: Tanya Combrinck from Creative Blog

i'm ready to
Get tips on Marketing,
Social Media & Web trends