Useful Cheat Sheets for Web Designers

Cheat sheets (also known as reference cards, reference sheets, etc.) not only helps you remember things quickly, but can also serve as wall decoration for your workspace. In this post, you’ll find 28 excellent, useful cheat sheets in various file formats for Photoshop, Dreamweaver, colors, typography, and other web-design related topics all in one page with pictures of each cheat sheet.  These cheat sheets are used even by the best web designers!

If you’re looking for front-end web developer cheat sheets (more CSS, HTML, and JavaScript) check out Cheat Sheets for Front-end Web Developers.

Photoshop

Photoshop CS3 Keyboard Shortcuts Cheat Sheet

Downloads: PDF (Windows), PDF (Mac)

Keys for using the Layers palette (HTML)

Photoshop Toolbox Reference (HTML)

Photoshop Lasso Tool Cheatsheet

Download: PDF

Photoshop Brush Tool Cheatsheet

Download: PDF

Color

RGB Hex Colour Chart

Downloads: PDF, PNG

Color Reference Guide (PDF)

Web Designer Color Reference Hexagon  Mouse Pad

Download: GIF

Web Safe Color Chart (HTML)

Hexidecimal Color Chart (HTML)

The Browser Safe Colors (HTML)

Typography

VisiBone Font Card

Download: GIF

Common fonts to all versions of Windows & Mac equivalents (HTML)

Mixing Typefaces (PDF)

Units/Dimension

Approximate Conversion from Points to Pixels (HTML)

Megapixels Chart

Download: GIF

CSS/CSS Frameworks

Blueprint CSS Cheat Sheet

Download: PDF

YUI Library: CSS Reset, Base, Fonts, and Grids (PDF)

CSS Shorthand Cheat Sheet (PDF)

Apple’s CSS Cheat Sheet Widget (Mac Dashboard Widget)

HTML/XHTML

HTML & XHTML Tag Quick Reference (PDF)

HTML/XHTML Character Entities

XHTML Character Entity Reference (HTML)

Dreamweaver

Dreamweaver Quick Reference Guide (PDF)

Dreamweaver CS3 for Mac Quick Reference Card (PDF)

Illustrator

Adobe Illustrator CS2 Keyboard Shortcuts – MAC

Download: PDF

Browsers

Will the browser apply the rule(s)? (HTML)

W3C DOM Compatibility Tables (HTML)

Summary

There’s a number of cheat sheets you can use for different areas of web design.

 These are just little things, but they can save your agency a ton of time, which will save the client a ton of money.  Clients look for things such as the efficiency of an agencies procedures when they are choosing a web design company.  Even big institutions such as colleges, or fortune 500 companies are looking for ways to save on web design, so using these cheat sheets can help drive down the time of a project and the price for the client.

(Possibly) Related Posts

• Cheat Sheets for Front-end Web Developers
• 7 Incredibly Useful Tools for Evaluating a Web Design
• 30 Exceptional CSS Techniques and Examples