Front End Questions

Back in June a friend of mine sent a list of questions asking about my front-end development process. He has been focusing on the back-end and hasn’t spent much time on HTML and CSS. Initially I replied to his questions via email, but my friend, Dan Ott responded with a blog post so I thought it would be fun to share my answers as well.

I try to avoid using polyfills, but occasionally I use Scott Jehl’s Picturefill. As for shims, I don’t start projects without the HTML5 shiv. Luckily the browser landscape is maturing fast enough that I’ll be able to drop it altogether.

Are you still working with Sass these days?

Absolutely. I resisted moving to Sass in the beginning because I didn’t see the need. I started using it for a project a little over a year ago and haven’t looked back since. The variables are okay, but once you start writing your own mixins and functions, that’s where you really see the power. Just be sure to keep the nesting to a minimum.

Have any organization tips for CSS3 support and such?

For organizing my CSS I turn to Jonathan Snook’s SMACSS. I’ve been doing this approach for about a year and it’s changed the way I look at setting up my stylesheets. If you’re using Sass and are interested in using SMACSS I suggest taking a look at MVCSS. It doesn’t follow Jonathan’s approach to the letter, but it’s a good jumping off point.

Are you still a Typekit fan? What’s your recommended way for embedding fonts in this fashion?

For the moment, Typekit is still my tool-of-choice for web fonts, but there are other alternatives if Typekit (or Adobe) aren’t your thing. Fontdeck by the wonderful folks at Clearleft and OmniTI is a great contender and the new offering by the guys at HF&J, Cloud.typography, looks incredible. I mean, who wouldn’t want to use Knockout in their next project?

Is there anything else you are dying to tell me about what you are loving with HTML and CSS these days?

What’s really changed the game for me of late is adding Yeoman, Grunt, and Bower to my workflow. What these tools do and how I use them is a bit too much for this post, so that will have to wait for another time.

What does your browser support landscape look like these days?

Luckily, most of the projects I work on these days require support for IE9+ and the latest versions of Chrome, Firefox, Safari and Opera. On those rare instances I have to test for “less capable” browser I will fire up Browser Stack or VMware.

Do you still use a reset stylesheet, and if so, what do you use?

I used to employ a reset, but have switched to Normalize. The problem with a reset is that it is a sledgehammer when all you really need is a scalpel. You end up spending time (and lines of code) adding back the styles that the reset took away (margins, padding, list styles, etc.). Using a tool like Normalize will get you the browser consistency without he hassle of reimplementing what the browser includes by default.