Symbolset
Lovely icon set and a great website to boot. Icons are inserted based on text content rather than specialist markup which is intriguing.
Symbolsets are semantic symbol fonts. They work in modern browsers and anywhere OpenType features are supported.
Swipe
Great slideshow library that doesn’t depend on any frameworks. Works incredibly well on touch devices where it’s bounds give real weight to your swipe actions.
Swipe is a lightweight mobile slider with 1:1 touch movement, resistant bounds, scroll prevention, and completely library agnostic.
Check it out in use on the Symbolset site.
Building The Next SoundCloud
Nice post covering some of the design decisions made by the SoundCloud team when building the next version of their platform.
Particularly nice is the way they load in their modules using CommonJS style modules wrapped in a shim to work with an AMD loader. Also worth noting is the cache implementation used to ensure only one instance of a resource is loaded at any one time.
Backbone Aura Developer Preview
New framework by Addy Osmani built on top of Nicholas Zakas’ Scalable Application Architecture.
Backbone Aura is a decoupled, event-driven architecture on top of Backbone.js for developing widget-based applications. It takes advantage of patterns and best practices for developing maintainable applications and gives you greater control over widget-based development.
I definitely think the idea of using sandboxed widgets is great. I’m still not sold on the complexity of abstracting so much into patterns for most projects. But worth checking out if you’re about to start building a large application.
Also worth watching is Addy’s talk on the same subject at Async earlier this year.
Cross-Browser Debugging CSS
Great guide to debugging CSS providing many useful sanity checks and common pitfalls.
CSS has an underlying design and when you work with it, with the natural flow of how CSS is meant to be used, you will find you have a lot less bugs.
Beware the bit at the end about hacking Internet Explorer though.
Idiomatic.js
Linked in the previous post but worth it’s own. This is a great JavaScript style guide that I recommend for any project (although I don’t agree with the massive amount of whitespace around function arguments).
JavaScript Style Guides
I’ve been looking into creating a style guide for the project I’m currently working on and this article arrived just in time.
A style guide or style manual is a set of standards for the writing and design of code. The implementation of a style guide provides uniformity in code style and formatting, often covering guidelines regarding indentation (tabs vs. spaces), variable and function naming conventions, where best to apply whitespace and so on.
Also goes on to cover some additional aspects such as linters and beautifiers which is also interesting especially Code Painter which can reformat your code into a provided style.
Consolidate.js
Much like the Tilt Ruby gem, Consolidate provides a common interface for many common Node template engines.
Looks great for anyone building a framework or library that requires templating.
About HTML semantics and front-end architecture
Great post dispelling some of the myths surrounding semantic front end architecture. An while many might disagree with parts of the content I’d argue it’s still an essential read.
When you choose to author HTML and CSS in a way that seeks to reduce the amount of time you spend writing and editing CSS, it involves accepting that you must instead spend more time changing HTML classes on elements if you want to change their styles. This turns out to be fairly practical, both for front-end and back-end developers – anyone can rearrange pre-built “lego blocks”; it turns out that none can perform CSS-alchemy.