Web Design Resources
I wanted to make a place where I post a bunch of resources that relate to website design. So on this page you’ll find all sorts of cool resources and tools that you might enjoy if you are into website design. Enjoy!
Photoshop & Illustrator
- Photoshop Etiquette (A Guide to Discernible Web Design in Photoshop)
- Photoshop Etiquette Manifesto for Web Designers
- psd tuts+ – Photoshop tutorials from beginner to advanced
- Vector Diary – Illustrator tutorials and tips
Color & Design
- Adobe kuler – Create & share color combinations and sync with Photoshop and Illustrator
- Pantone Color Chart – Match Pantone PMS colors (not as nice as a swatch)
CSS
- CSS Tricks – All things CSS. Screencasts, code snippets, forums. Thank you Chris Coyier!
- CSS3 Gradient Generator – Make gradients with css
- Button Builder – A live design tool to create a button and get the generated code
- CSS3 Gradient Buttons – A post about how to make css gradient buttons
- CSS3 Box-Shadow Page Curl Effect – Examples and how-to get a shadow & page curl on an element
- CSS Drop Shadows – Several examples of different css drop shadows
- CSS Text Shadows – Examples on how to use CSS text shadows for shading type
HTML
- HTMLisEasy – HTML tutorial for beginners
- Dive Into HTML5 – Free Online book about HTML5
- Code an HTML5 Layout – Learn to use the HTML5 elements to code with proper tag structure
- HTML Ipsum – Great tool to copy snippets of lorem ipsum with html elements
Typography
- Dafont – Large library of fonts for download (most free for personal use)
- Eljbris Font Foundry – Well-crafted fonts, some for free
- Flipping Typical – A neat way to explore typefaces you have on your computer
- Font Park – Free fonts for commercial & non-commercial
- Font Space – Lots of fonts for download
- Font Squirrel – Download fonts free for commercial use
- Google Webfonts – Great fonts to use on webpages, also for download
WordPress
- Designing for WordPress – CSS-Tricks video screencast (part 1 of 3) on making a WordPress theme
- Theme Development – White papers from the WordPress Codex with general information about themes
- Theme from Scratch – Blog post walks though and explains building a theme from scratch
- Theme Tutorial – A text tutorial on creating a theme
- Make Your Own Theme – Another multi-part text tutorial on making a WP theme
- Starkers – Totally naked WordPress theme
- Stupid WordPress Tricks – This page lists code snippets, tips & tricks
Images & Things
- Lightbox 2 – How to get the infamous popup image viewer
- Make iOS Icons – This post tells you how to make those elegant iOS homescreen icons
- Facebook Decal – A post about how to make your own Facebook-like decal
- Wufoo Form to Facebook Tab – How to embed your Wufoo form onto a Facebook tab
- Iconspedia – Lots of icons for download
- Dynamic Drive – Tons of tools and things to put on your site (clocks, menus, image viewers, etc.)
- bxSlider – Nice responsive jQuery content slider
Reading & Learning
- Expert Advice for Students – This is a great Smashing Magazine article that interviews web experts for advice
- The Life, Times (& death?) of IE6 – Funny comic about Internet Explorer 6 from Smashing Magazine
- Smashing Magazine – As you see above, Smashing Magazine is a good source of reading material
- W3Fools – An intervention for the avid W3Schools reader
- Google Search Engine Optimization Guide – Online document by Google on SEO
- Codecademy – Learn to code
- 30 Days HTML & CSS – A free tuts+ premium course to learn html & css in 30 days
- 24 Ways – Advent calendar for web geeks
- Web Designer Wall – Blog about web trends, ideas, and tutorials
- Web Design Ledger – Web design blog, tutorials, & inspiration
- A Book Apart – Excellent books on all web design topics available in paperback or electronic