I’ve got a lot of respect for web designer Chris Coyier. His Css Tricks is pretty much the definitive resource I head to when looking up CSS techniques. That’s when, via a pretty random Google search, I came upon this talk he gave late last year. Really great advice here, from development setup to deployment strategy. Chris is a entertaining speaker as well; you won’t get bored.
A common problem we have as web developers is sharing a web site or app we’re running off localhost to others. Yes, you can always have a quick deployment strategy, but Localtunnel provides something a bit slicker and easier. Just install the Ruby gem, run a command and you’ve got a subdomain on localtunnel.com to share to your coworkers and clients. Granted, it’s no substitute for a full deployment environment, especially in the context of formalized QA testing, but especially for quick shares and checkins with coworkers, it’s a nice idea.
Web designer Stuart Robson has comparatively more hands on experience with SASS than I do, which makes this pretty in depth SASS mixin a really useful read. At the very least, I’m struck by the importance of writing your media queries in ems, not pixels, a trend that’s really taken hold in the web development community over the past few months.
Chardin is a smartly thought out jQuery plugin that draws overlays on existing web elements, accompanied by optional instructions. It looks especially useful for interactive help within web apps.
Author Ryan Holiday:
We’re just regressing.
It’s the one thing I find most disheartening and perhaps most frustrating about this trend. It’s something that needs to be heard, particularly by the people who wrote off these services as Web 1.0 or Web 2.0 relics—the type who said, “Well, nobody used RSS, so good riddance.”
The collapse of these services, to me, represents an alarming reduction of key services designed to improve online information from the user’s perspective.
Almost any modern web designer now has to decide between potentially thousands of custom web fonts. To rapidly prototype different combinations in the browser, even with good front end development chops, can be pretty time consuming.
Typecast is a web app that tries to address this problem. You get a much more visual, WYSIWYG interface for trying out font combinations, but with the advantages of actual font rendering in the browser. I don’t see a personal need for the app given the cost ($29 a month isn’t a minor expense) and considering at my day job we’re mostly focused on Proxima Nova. But especially in an agency environment, this could be a huge time saver.
If you’re a web developer you’re invariably spending a lot of time in browser development tools, be it Chrome’s DevTools, Safari’s web inspector or Firefox’s Firebug. I find that Chrome really leads the pack with its DevTools, and this awesome, free interactive online course by Code School and Google can take you from newbie to expert. I considered myself pretty solid with DevTools knowledge, but with a quick review through the lessons I learned a lot of little tricks as well.
An excellent deep dive by developer/designer Paul Stamatiou regarding his approach to handle images that looks great on both normal and HDPI (a.k.a. ‘retina’) devices. Pay special attention to his work on how to effectively cut 1x and 2x sprites, he includes useful screenshots.
As usual, Chris Coyier over at CSS Tricks writes a fairly comprehensive post on the pros and cons of using SVGs. I’m generally a fan of the format – for my day job we tend to use a mixture of both 1x + 2x pngs and svgs to serve up retina-friendly images.
Louis Lazaris offers a fairly novel approach for trying to write more modular, SMACSS like CSS code with media queries. Louis pushes for a lot of small, repetitive media queries that can be paired visually close to the original non-media declaration. I see what he’s after, though I still think in the end I favor the more traditional move to keep all the media queries shoved at the bottom. The article is still worth a read and may click with your workflow better than mine.