40 Must Have Cheat Sheets for effective Web Designers

June 18, 2013 · 49 comments

by Lars

As a follwoup on the article 40+ Essential Front End Web Developer Cheat Sheets it is now time to deliver a similar package to Web Designers. Creating Web Designs isn’t easy at all as it is first of all a creative process. To get the creative process started it may be a good idea to seek inspiration by looking closely at the designs used on websites that belong to the segment your design will target (ex. e-commerce shop, corporate website, personal blog etc.). Once a designer have all the inpiration and all the ideas lined up to start the actual design process he or she needs to master a set og software products (ex. Adobe Photoshop) and best practice patterns for designing web user interfaces. This article will cover the elements you need to get work done more effectively as a web developer (ex. working in photoshop, Illustrator etc.) Please make sure that you post a comment if you know an important resource that have not been included in the article. I hope you will find this article useful, lets get started!


ElegantThemes
ThemeForest

Advertisement

Color Codes

RGB Hex Colour Chart

The RGB Hex colour chart is a very large (183kB) PNG file, and is sized to fit on a standard A4 piece of paper. It shows the 216 so-called “web safe” or “non-dithering” colours (there are actually only 22 web safe colours, but those are revolting).

CHEAT_SHEETS

Color Reference Guide

CHEAT_SHEETS

Web Safe Color Chart

CHEAT_SHEETS

HTML Colors Cheat Sheet

This cheat sheet contains a chart of 1050 colors grouped by hue and varied into 25 different saturations and brightnesses for each. Each color has the HTML color code reprsented as a Hex triplet (e.g. #808080). Also, it contains a chart of the 216 Web-safe colors and each is represented as a single-digit Hex triplet (e.g. #999).
CHEAT_SHEETS

RGB Values for Macbeth Color Checker

CHEAT_SHEETS

Another html versions of Macbeth

Dreamweaver

DreamWeaver CS4 Keyboard Shortcuts (PC)

CHEAT_SHEETS

Illustrator

Adobe Illustrator CS4 Shortcuts (MacPC)

CHEAT_SHEETS

Working with older verisons – these may be useful then.

  • Adobe Illustrator CS3 Shortcuts (MacPC)
  • Adobe Illustrator CS2 Shortcuts (MacPC)

Indesign

Adobe InDesign CS4 Keyboard Shortcuts (MacPC)

css-cheat-sheet

  • Adobe InDesign CS3 Shortcuts (MacPC)
  • Adobe InDesign CS2 Shortcuts (MacPC)

Photoshop

Photoshop CS3 Keyboard Shortcut

css-cheat-sheet

Photoshop CS4 Shortcut Cheatsheets

css-cheat-sheet

Brush Tool cheatsheetush Tool cheat sheet for Photoshop

css-cheat-sheet

Adobe Photoshop Quick Reference Guide

css-cheat-sheet

Black & White Cheatsheet For Photoshop

css-cheat-sheet

Photoshop Quick reference card

css-cheat-sheet

Photoshop Lasso Tool Cheat Sheet

css-cheat-sheet

Photoshop Toolbox Reference

css-cheat-sheet

Keys for using the Layers palette

css-cheat-sheet

Working with older verisons – these may be useful then.

Flash

Flash CS4 Keyboard Shortcuts(PC and Mac)

css-cheat-sheet

Working with older verisons – these may be useful then.

  • Flash CS3 Quick Reference (PCMac)
  • Flash MX Quick Reference (PCMac)

ActionScript 3.0 Top Level Cheat Sheet

css-cheat-sheet

http://creativetechs.com/tipsblog/photoshop-cs4-shortcut-cheatsheets/

{ 15 comments… read them below or add one }

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

{ 34 trackbacks }

Previous post:

Next post:


Web Analytics