Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Design

Posted by Ross brown
Ross brown
1,457 Points

Pure code or PSD

Hi,

I'm looking to build a simple website, and have seen a few sites that offer UI design kits - flat UI design elements contained within a PSD.

I happened to come across an article comparing 'pure code css elements' over those that might come as with the said PSD.

Are there any thoughts on what the best practices are? Is this time over effort? Are UI kits worth their time?

Ross

3 Answers

Kevin Korte
Kevin Korte
28,149 Points
Kevin Korte
Kevin Korte
28,149 Points

I'm a big fan of building everything you can with CSS over a PSD. Things like buttons, shadows, etc really should be done in CSS3. This will save you possibly multiple server requests for images compared to having an image button with another image for hover state, etc; it'll also be more resolution independent. Your PSD button might start to pixelate on higher resolution screens. CSS3 versions should still look fairly sharp.

Ross brown
Ross brown
1,457 Points
Ross brown
Ross brown
1,457 Points

Hi Kevin,

That makes sense to me. Would you know of any good online resources where I could find CSS3 buttons and the like?

Many thanks

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

The first result on Google for CSS3 buttons is http://hellohappy.org/css3-buttons/

That should give you an idea what sorts of things are possible with CSS3.

Kevin Korte
Kevin Korte
28,149 Points
Kevin Korte
Kevin Korte
28,149 Points

Not in particular. There are a couple of front end frameworks like Bootstrap, Foundation, PureCSS, etc. Once you learn the technique, they are pretty easy to build yourself; and I usually code my own buttons now.

One thing I found super help to learn it was to look at the code used on buttons from all over the web, live on a real site. Especially buttons you like.