14 Most Useful Web Design Cheat Sheets

By / Mar 3, 2009 / Resources
shares

A well rounded web designer’s day is spent immersed in multiple graphic design programs and writing front end code. All of this moving from one environment to another can make it hard to memorize such things as hot keys and shortcuts for each. This is where cheat sheets come into play. A cheat sheet is simply a printable reference or guide to a particular software package, language, framework, etc.

Here are 14 of my favorite cheat sheets.

Photoshop

Adobe Photoshop CS4 Keyboard Shortcuts

Adobe Photoshop CS4 Keyboard Shortcuts

Adobe Photoshop CS3 Keyboard Shortcuts

Adobe Photoshop CS3 Keyboard Shortcuts

Photoshop Lasso Tool Cheatsheet

Photoshop Lasso Tool Cheatsheet

Adobe Pen Tool Cheatsheet

Adobe Pen Tool Cheatsheet

CSS

CSS Cheat Sheet (V2)

CSS Cheat Sheet (V2)

Mac OS X CSS Cheat Sheet

Mac OS X CSS Cheat Sheet

CSS CHEAT SHEET

CSS CHEAT SHEET

XHTML

(X)HTML Elements and Attributes

(X)HTML Elements and Attributes

HTML/XHTML in one page

HTML/XHTML in one page

JavaScript Frameworks

jQuery 1.3 Cheat Sheet

jQuery 1.3 Cheat Sheet

mootools 1.2 cheat sheet

mootools 1.2 cheat sheet

Prototype 1.6.0.2 Cheat Sheet

Prototype 1.6.0.2 Cheat Sheet

Flash

Adobe Flash CS4 OS X Keyboard Shortcuts

Adobe Flash CS4 OS X Keyboard Shortcuts

Flash CS3 Cheat Sheet

Flash CS3 Cheat Sheet

About the Author

Henry Jones is a web developer, designer, and entrepreneur with over 14 years of experience. He is the founder of WDL and ThemeTrust.

59 Comments

  1. Scott
    March 3, 2009

    Thanks! Just snagged me a couple cheat sheets.

    Reply
  2. Ekios
    March 3, 2009

    Merci !!! Thank you !! :)

    Reply
  3. Shkedim Studio
    March 3, 2009

    thanks for a great post.
    you got the link of the Flash CS3 Cheat Sheet wrong..

    Reply
  4. Lee Milthorpe
    March 3, 2009

    These are some really useful resources and will hopefully save me a lot of headaches!

    Reply
  5. Nathan Beck
    March 3, 2009

    Nice selection, I actually just thought it would be the same CSS and jQuery sheets over again but the Photoshop ones could come in quite handy.

    Reply
  6. Niki Brown | The Design O’Blog
    March 3, 2009

    Keyboard shortcut cheat sheets are so useful and time saving. Although its sometimes hard to visualize how you will use them unless you see them in action. Great post!

    Reply
  7. A Website Designer
    March 3, 2009

    I followed a link to this page from Twitter and cheatsheets are not only good but modern too including CS4 is a good move.

    Reply
  8. Steve
    March 3, 2009

    Great resource, have given you a well earned tweet…

    Reply
  9. Daniel
    March 3, 2009

    Cheat sheets are great, thanks for the fantastic article.

    Reply
  10. Henry
    March 3, 2009

    @Shkedim Studio – Whoops. Thanks for pointing this out. It is fixed now.

    Reply
  11. Wayne Helpard
    March 3, 2009

    Thank you, that is a great resource for a designer indeed.

    A will definately use a few of them.

    Reply
  12. ender
    March 3, 2009

    sadly, it looks like the Mac OS X CSS widget is no longer available. I got a 404 error when i tried to download it from Apple and the website itself appears to be only a holding page now. Too bad as that looked very useful.

    Reply
  13. Henry
    March 3, 2009

    @ender – It’s been a while since I downloaded it. Sorry about that. I should have double checked the link again before posting it.

    Reply
  14. Timothy
    March 3, 2009

    Not bad. There’s more at http://www.pushingbuttons.net/cheats/

    Reply
  15. Luiz Lopes
    March 3, 2009

    Great list, I have been looking to learn the keyboard short cuts for Photoshop CS3, Thank you.

    Reply
  16. Simon Douglas
    March 3, 2009

    Useful list, but you missed out Git:

    http://zrusin.blogspot.com/2007/09/git-cheat-sheet.html

    I seem to remember there’s one for SVN as well, but I can’t remember where it was.

    Reply
  17. Lea
    March 3, 2009

    Thanks for the awesome resource. These cheat sheets will be useful to my trainees.

    Reply
  18. pavlicko
    March 3, 2009

    Woohoo! Love the jquery and flash cheat sheets. thanks for shoving them all in one spot for me!

    Reply
  19. John
    March 3, 2009

    Great round up of useful cheat sheets. Thank you for this.

    Reply
  20. Matthew Would
    March 3, 2009

    Thanks for including my Flash CS4 shortcut sheet! Glad you find it as useful as I do. This was a really useful list of the other sheets here too.

    Reply
  21. Wade Jackman
    March 3, 2009

    you aren’t kidding! I have the photoshop one laminated and taped to my desk.

    Reply
  22. cnlogger
    March 4, 2009

    great useful information..

    Reply
  23. Zohaib
    March 4, 2009

    I can work more fast now after read this post :)

    Reply
  24. Sam Jones
    March 4, 2009

    Not quite a ‘cheat sheet’, more of a cheat encyclopedia really. I have them all….Highly recomended

    http://www.visibone.com

    Reply
  25. Jon
    March 4, 2009

    Very useful stuff! Great addition!

    Reply
  26. ByteMeGeeks
    March 4, 2009

    Anything that saves time is a blessing. Good job!

    Reply
  27. Ozbax
    March 4, 2009

    Best blog post i’ve seen this month!!!

    Reply
  28. Ian
    March 4, 2009

    Nice! Thank you!

    Reply
  29. Nippy Ireson
    March 5, 2009

    Great assortment of resources. Thanks!

    Reply
  30. Charles Root
    March 5, 2009

    Any chance of a GIMP 2.0 cheat sheet showing up soon?

    Reply
  31. logo design guru
    March 5, 2009

    hey, thanks for these. I didn’t realize these were out there and it’s an excellent resource to have. thanks

    Reply
  32. Les A
    March 6, 2009

    Great collection. Will be sure to pass it on.

    Reply
  33. frank katzer | 1klang.de internetagentur ( fulda / petersberg)
    March 6, 2009

    thanks for your collection. those are real timesavers…

    Reply
  34. Webbo
    March 7, 2009

    Thanks you, these are really great.

    Reply
  35. gregorio
    March 7, 2009

    These can really come in handy.thanks.

    Reply
  36. Adam
    March 8, 2009

    Hate searching for tutorials on the web for simple coding. Found this really useful. Thanks.

    Reply
  37. John milton
    March 9, 2009

    Hi..
    Indeed a great list.
    Keyboard shortcut cheat sheets are so useful and time saving. Although its sometimes hard to visualize how you will use them unless you see them in action.In all Great post!
    Thanks..
    John

    Reply
  38. Political Pundit Paul
    March 9, 2009

    A terrific post. I love the design of your blog–with the comments column that is designed like stacked comic expression boxes.

    Reply
  39. Crazy Web Host
    March 10, 2009

    A very wonderful post on web design. Thanks for the sharing.

    Reply
  40. Krystian
    March 12, 2009

    Extremely usefull. The one regarding mootools framework just briliant. Thank you.

    Reply
  41. Blacksnipe
    March 16, 2009

    For mac, they have a Dashboard cheatSheet… Check out this link:
    http://www.apple.com/downloads/dashboard/developer/jqueryreference.html

    Reply
  42. BizLogo
    March 20, 2009

    Great post. Handy not only as a reminder as stuff you know but also good for discovering new shortcuts. Thanks for posting this.

    Reply
  43. Geoff A
    March 23, 2009

    You should also check out http://showmehtml.com

    It’s a little easier on the eyes than the other example that has all the HTML tags on one page.

    Reply
  44. Matt_W
    March 24, 2009

    Hi all, I added a Dreamweaver CS4 sheet here: http://subdivision.co.uk/adobe-dreamweaver-cs4-shortcuts-cheatsheet/

    Reply
  45. Matt_W
    March 24, 2009

    ..and both PC and OS X versions of the Flash CS4 sheet are available now: http://subdivision.co.uk/adobe-flash-cs4-shortcuts-cheatsheet/

    Reply
  46. http://www.searchenginesubmissionservice.biz
    March 26, 2009

    Thanks for the cheat sheet! i am still in the process of learning what my codes mean and this has helped me alot! Thanks!http://www.searchenginesubmissionservice.biz

    Reply
  47. 18 Seriously Helpful Cheat Sheets for Easier Coding | Web Design Ledger
    April 22, 2009

    [...] few weeks ago, I showed you the best cheat sheets for web designers. Following that post, many of you showed interest in having cheat sheets to help you write code. [...]

    Reply
  48. Dan
    April 22, 2009

    Nice assortment of useful cheat sheets!

    Indianapolis Web Design

    Reply
  49. David Costales
    May 14, 2009

    Awesome post, thanks!

    Reply
  50. Matt
    June 26, 2009

    Thanks for these

    Reply

Leave a Reply