web dev toolbox: week 1

Earlier this summer, I started compiling a folder of online web development tools in my Internet Browser for future reference. This list of “Web Dev Tools” has grown by about 50 percent after my first week at HackerYou!

With the constant exchange of information that takes place in the Lab, I seem to come across at least two or three new helpful sites, web apps, or plugins everyday. Here are some of my favourite tools that were passed along to me last week:



Not sure if a CSS property you’re using requires a vendor prefix? Simply search for the property on “Can I Use”, and it will generate an easy-to-read graphic that tells you 1) which browsers support or don’t support that property; 2) which versions of a particular browser support or don’t support that property; and 3) if that property is supported by mobile Internet browsers.

CSS Font Stack


Designed for the visually-oriented, CSS Font Stack neatly delineates the web safe fonts you can list as defaults or fall-backs in your stylesheet. It definitely challenged my assumption that web safe font stacks were too limiting.

Placeholder Image Generators
(People’s Choice: PlaceCage)


It’s safe to say that PlaceCage is the unofficial favourite of my HackerYou cohort, and the results were as hilarious as they were terrifying. Some honourable mentions: Bacon Mockup, Fill Murray, and the always SFW option, placehold.it.