Photoshop workflow tip for web designers


written by John on April 30, 2009

Here’s something I’ve started using a while ago that’s very handy; If you’re a web designer and do a lot of your graphics in photoshop then like me, you’ll probably use Save for the Web a hundred times more than you use Save.

The workflow for this has always been a bit clunky in Photoshop. There isn’t a shortcut for it – and actions don’t really cut it. Well there is a shortcut but try doing lots of Alt+Shift+Ctrl+S without breaking your arms. The simple solution is to swap around your shortcuts so you can just hit Ctrl+S to Save for Web.

Go to Edit > Keyboard Shortcuts > File, then scroll down to Save for Web and change it to Ctrl+S. Then you’ll need to change Save to Alt+Shift+Ctrl+S. Now to save for the web you can just press Ctrl+S and then hit enter. Now and then you’ll need to change file type or location but mostly you can just hit enter.

Another handy workflow tip using shortcuts is to get your Undos working like most programs. Open up the shortcuts again and change Step Backward to Ctrl+Z. And then change Undo/Redo to Alt+Ctrl+Z. Now you can undo like any other program, rather than that single undo. (You can change the number of undos by going to File > preferences > Performance > History & Cache).


Leave a comment

  • roy

    COOOOOOOOOOOOL!

  • Red Leeroy

    nice one, will be defo doing this.

  • Xbox4NappyRash

    Fuuny this, after years of trying to get my head around it I finally gave up, leaving photoshop on my machines for one function only.

    Save for web. And now I can do it faster, heh.

  • David

    I like! especially the undo one that was really getting on my nerves.
    So fair play to you John.

    Another thing that annoys me is doing “margin: 0px 0px 0px 0px” before you put in the values but i think i read something about macro’s on your blog before.

    • John

      Hey Dave

      Yeah autohotkey is yer only man there. You could put in a bit of script that would let you type mar and it would do the rest for you. (But if it’s all zero margins, you know you can just use “margin:0″ ? )

      http://www.autohotkey.com/ I’m on a mac now and really miss Autohotkey (mac’s automator doesn’t come close)

      Authohotkey is a really powerful tool, text expansion is jsut a small part of it. If you want a simple text expansion tool, there are lots of other options: http://lifehacker.com/5611210/how-to-use-text-expansion-to-save-yourself-hours-of-typing-every-day