Using Style Tiles

I’m currently working on what will be a responsive WordPress website for a theater incubator and have noticed for a while that Photoshop comps are really limited when it comes to designing responsive websites. How many screen sizes should you design for? What about accommodating a CMS?

Instead of comping every screen size, I’m going to create Style Tiles which were introduced on A List Apart by Samantha Warrren. If you have never heard of Styles Tiles before, go now and read the A List Apart article. I’m serious – read it!

The concept is still making its way around the Internet and now other people are sharing their own methods and templates. Samantha offers a Photoshop template, Adrian Gould collected templates in Illustrator, Fireworks, InDesign and Keynote as well. Namanyay Goel created Webstiles for a HTML/CSS version. I also found a WordPress theme called WP Style Tiles created by Steve Fisher and Jesse Friedman.

I’m going to try out both the WordPress theme and the Photoshop template to see which one is more helpful to my workflow and presentation.