37 Must-Have Cheat Sheets and Quick References for Web Developers and Designers

A Cheat Sheet, also known as a crib sheet or quick reference guide, is a concise set of notes used for quick reference. It is a document containing summarized information used for quick reference. Most Web developers and Web designers know that cheat sheets are extremely useful, where you can use them for quick reference and easy learning.

There are many cheat sheets available for Web developers and designers and it can get difficult to figure out the best ones. In this post, I have compiled the top 37 free cheat sheets that will save you money, time and mistakes.

Ok. I admit, I did not cover all Web programming, scripting languages, markup languages, frameworks and different Web technologies. It is impossible to list all cheat sheets in one post. That´s why in my next post I discussed the top 5 cheat-sheet Websites (Directories) for developers and designers, where you can choose the ones I missed.

CSS2

CSS is a language that gives Web developers control over how Web pages are displayed. Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification.

CSS 2 Visual Cheat Sheet

CSS 2 Visual Cheat Sheet.

  1. Visit Website | Download PDF file

CSS2 Help Sheet

CSS2 Help Sheet.

  1. Visit Website | Download PDF file

CSS ShortHand Property Cheat Sheet

CSS ShortHand Property Cheat Sheet.

  1. Visit Website | Download zipped folder

CSS3

CSS is the language for describing the presentation of Web pages, including colors, layout, and fonts. It allows to adapt the presentation to different types of devices, such as large screens, small screens, or printers. Cascading Style Sheets Level 3.

CSS3 Click Chart

CSS3 Click Chart.

  1. Visit Website

CSS3 Help Sheet

CSS3 Help Sheet.

  1. Visit Website | Downloads PDF file

CSS3 Quick Reference Guide

CSS3 Quick Reference Guide.

  1. Download PDF file

HTML5

HTML5 is a language for structuring and presenting content for the World Wide Web. It is the fifth revision of the HTML standard and as of October 2011 is still under development. Its core aims have been to improve the language with support for the latest multimedia while keeping it easily readable by humans and consistently understood by computers and devices. HTML5 – Wikipedia.

HTML5 Doctor

Element Index - HTML5 Doctor.

  1. Visit Website

HTML5 Quick reference Guide

HTML5 Quick reference Guide.

  1. Download PDF file

HTML5 Elements

Periodic Table of HTML5 Elements.

  1. Visit Website

XHTML

XHTML is a variant of HTML that uses the syntax of XML, the Extensible Markup Language. XHTML has all the same elements as the HTML variant, but the syntax is slightly different.

XHTML Basic 1.1 Cheat Sheet

W3C XHTML Basic 1.1 Cheat Sheet.

  1. Visit Website

XHTML 1.0 Strict Cheat Sheet

W3C XHTML 1.0 Strict Cheat Sheet.

  1. Visit Website

XHTML Character Entity Reference

XHTML Character Entity Reference.

  1. Visit Website

JavaScript

JavaScript is a scripting language commonly used to add interactive elements to Web pages.

JavaScript Reference Card

JavaScript Reference Card.

  1. Download PDF file

JavaScript and Browser Objects Quick Reference

JavaScript and Browser Objects Quick Reference.

  1. Download PDF file

jQuery

jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.

jQuery 1.6 Cheat Sheet

jQuery 1.6 API Cheat Sheet.

  1. Visit Website | Downloads: PDF | image

Regular Expressions

In computing, a regular expression provides a concise and flexible means for “matching” (specifying and recognizing) strings of text, such as particular characters, words, or patterns of characters. Abbreviations for “regular expression” include “regex” and “regexp”.

This excellent Regular Expressions reference should be your first place for tutorials, examples and reference.

Regular Expressions Cheat Sheet

Regular Expressions Cheat Sheet.

  1. Visit Website | Download PDF file

Regular Expression (.NET Framework)

Regular Expression Cheat Sheet (.NET Framework).

  1. Visit Website

PHP

PHP is an open source, server-side, HTML embedded scripting language used to create dynamic Web pages.

PHP Manual Quick Reference

PHP Manual Quick Reference.

  1. Visit Website

PHP Application Security Checklist

PHP Application Security Checklist.

  1. Download PDF file

WordPress

WordPress is an open source blogging tool and publishing platform powered by PHP and MySQL. It is often customized into a CMS. It has many features including a plug-in architecture and a template system.

The WordPress Codex should be your first place for help and tutorials, information and documentation.

WordPress3.0 Cheat Sheet

WordPress3.0 Cheat Sheet.

  1. Download PDF file

WordPress Cheat sheet

WordPress Cheat sheet.

  1. Visit Website | Downloads: PDF | image

WordPress Help Sheet Wallpaper

WordPress Help Sheet Wallpaper.

  1. Visit Website | Download image file

MySQL

MySQL is an open source RDBMS that relies on SQL for data processing.

Common MySQL Queries

Common MySQL Queries.

  1. Visit Website

Flash

Adobe Flash is a multimedia platform used to add animation, video, and interactivity to Web pages. Flash is frequently used for advertisements, games and flash animations for broadcast. More recently, it has been positioned as a tool for “Rich Internet Applications”.

Flash Professional & Flash Catalyst CS5

Flash Professional CS5 & Flash Catalyst CS5 cheat sheet.

  1. Visit Website

ActionScript

ActionScript is an object-oriented language used for the development of Websites targeting Adobe Flash Player.

ActionScript 3.0

ActionScript 3.0.

  1. Download PDF file

Dreamweaver

Adobe Dreamweaver is a Web authoring and editing software that provides both visual and code-level capabilities for creating standards-based Websites and designs.

Dreamweaver CS5

Dreamweaver CS5 cheat sheet.

  1. Visit Website

Photoshop

Photoshop is a graphics editing program developed and published by Adobe Systems.

Photoshop CS5

Photoshop CS5 cheat sheet.

  1. Visit Website

Photoshop Keyboard Shortcuts

Photoshop Keyboard Shortcuts Cheat Sheet.

  1. Visit Website | Downloads: PDF | image

Colors

Color Theory Quick Reference

Color Theory Quick Reference Poster.

  1. Visit Website | Downloads: PDF | (1920 X 1200) image | (1440 X 900) image

Color Reference Guide

Color Reference Guide.

  1. Download PDF file

Fonts

Web Safe Fonts Cheat Sheet

Web Safe Fonts Cheat Sheet.

  1. Visit Website | Downloads: PDF (zipped) | image

Periodic Table of Typefaces

Periodic Table of Typefaces.

  1. Visit Website | Download image file

SEO

Search Engine Optimization is the process of improving the visibility of a Website or a Web page in search engines via the “natural” or un-paid search results. In general, the earlier (or higher ranked on the search results page), and more frequently a Website appears in the search results list, the more visitors it will receive from the search engine´s users.

SEO Cheat Sheet

SEO Cheat Sheet.

  1. Visit Website | Download PDF file

On-Page SEO Cheatsheet

On-Page SEO Cheatsheet.

  1. Download PDF file

Mobile Web

Mobile Web refers to the use of Internet-connected applications, or browser-based access to the Internet from a mobile device, such as a smartphone or tablet computer, connected to a wireless network.

Mobile Web Best Practices

W3C Mobile Web Best Practices Flipcards.

  1. Visit Website | Download PDF file

Website Usability

Web usability is an approach to make Websites easy to use for an end-user (user-friendly), without the requirement that any specialized training be undertaken.

Website Usability Checklist

25-point Website Usability Checklist.

  1. Visit Website | Download PDF file

What Beautiful HTML Looks Like

HyperText Markup Language, an authoring language used to create documents for the World Wide Web.

What Beautiful HTML Code Looks Like.

  1. Download image file

Your Turn to Talk

In this post I listed 37 excellent resources for cheat sheets and quick reference guides for Web developers and Web designers, and I hope that you find this resource useful. If you think I missed others or you have something else to say, please share your opinion in the comments section below. Your opinion matters, unless it is a Spam.

Nonetheless, I left out many more cheat sheets for other Web programming, scripting and markup languages, and for different frameworks and Web technologies, which is impossible to list in one post. That´s why in my next post I discussed the top 5 cheat-sheet Websites (Directories) for developers and designers.

If you enjoyed this post, please consider: linking back to it, subscribing by email to future posts, or subscribing to the RSS feed to have new articles delivered to your feed reader. Thanks!

About the Author |
Boutros is a professional freelance Web designer, Web developer, Software Engineer, and Blogger. He is the Chief developer at Blue Olive Online. He strives for pixel perfect design, clean robust code, and user-friendly interface. If you have a project in mind and like his work, feel free to contact him. Connect with Boutros on StumbleUpon, Twitter, and LinkedIn.
Visit Boutros AbiChedid Website.

4 Responses to “37 Must-Have Cheat Sheets and Quick References for Web Developers and Designers”

  1. Cody F. says:

    Great reference! Thank you very much for compiling it!

  2. Krishna says:

    superb thank you very much

  3. Kristin says:

    Hey Boutros,

    I just wanted to let you know that Wells & Drew made another Adobe Cheat Sheet. This one is for Adobe Illustrator. Feel free to share it, thanks a lot. Here it is:

    http://www.wellsdrew.com/education/illustrator/

    Have a good one!

    -Kristin

  4. porimol says:

    Hello,
    Thank you for your nice article. I found something useful on it.
    Thanks.