Why You Should Skip Photoshop

I don't use Photoshop for designing web sites any more. See, why I believe, you should too:

• You can flesh out the main graphical ideas faster using a pencil and paper.

  When thinking about something general like layout, placement of images, you don't need to cope with unimportant stuff like the color of the dropshadow you want to use. You don't should care about pixel-perfect placement of borders and what not. Just skip photoshop and use a good old pencil.

• You will be doing once again anyway.

  If you design a website in photoshop, you will have to code that whole stuff in HTML, CSS and Javascript. So why spending so much time to paint pixels in photoshop?

• You get better code.

  Since the arrival of CSS3, making good-looking website is great: dropshadows, inner shadows, gradients, semi-transparet colors, you name it. Instead of cropping photoshop effects and useing them in background-image, you will use CSS features straight. This results in better code, faster loading, better maintainance, lower overall costs.

• You are faster at changes.

  Want to change the color theme on your mockup? Want to the navigation to left side, altough it's currently on top? Good luck using photoshop, I'll stick with my editor. Some effects are so much easier and faster to change in an simple CSS file (think "find/replace"), even waaaay faster when using some neat stuff like OOCSS or SASS, than clicking through alle those layers, moving and colorizing items.

• You can work on one mockup with your colleague simultaneously.

  Image what it would be like, if you could work on your machine with your mockup. And a co-worker would work on the same mockup at the same time on his machine. And when you're both done, some magic would combind the work of you both to one wonderful whole piece. Thanks to version control systems, this is something very old-fashioned in code-based working. Try to do that with photoshop.

• You'll have no frustrations transitioning from photoshop to browsers.

  Browser handle font rendering different than photoshop does. Browsers don't support all that crazy blending methods. Browsers have differences in rendering among each other. (I guess it was due to the craziness of some photoshop-idealist that people came up with the idea that websites have to look exactly the same on every browser.) You created something in a place where it will finally live. That's good.

• "It's not just what it looks like and feels like. Design is how it works." — Steve Jobs

  You cannot simulate the behaviour of a website, or an web app, or any app at all, when you just draw pixels. When it comes to testing mockups on future users, you must have something clickable.

• You save money.

  Well, since Adobe gives CS2 away for free, it's not that true anymore. But let's be honest: photoshop cost money. Alot. Insanely much money. Stick with your favorite text editor, and perhaps GIMP for some crazy image manipulation and everything should be alright.

Still not conviced? No problem. Don't listen to me. I'm just a regular wed dev idiot who thinks he knows something about designing web stuff. Maybe you would like hear what 37signals says about photoshop. Or why the designer at github skips photoshop.

So, maybe it's time for you to improve your design workflow?