rewdy

My Most Useful Web Design Tools/Resources

Posted in: design, resources, tools at about 10am

Every web designer, over time, develops their set of go-to resources to use while designing. I have been making websites professionally for over three years and amateurly for closer to seven. In that time, here are the top tools and resources that I’ve come to appreciate and rely on.

A little note on my selection: these are all things that I regularly use. There are tons of awesome resources that I think are cool, but for whatever reason, I don’t actually use them. I’m choosing to share here just the stuff that I have found myself using the most.

Tools/Resources

jQuery. I first discovered javascript frameworks about 2 years ago. I found mooTools and was completely taken by the accordion. I used that for a while, before realizing that there were a wide range of javascript frameworks to choose from. I tried, from there various others, but when I discovered jQuery I put my use of all the other ones to rest. Without going into any detail at this point, all i can say is that with jQuery I can write far less code and do far more than with any other framework. I use it in almost every project now. It’s amazing.

Fireworks. Adobe Fireworks is an amazing program that I, for one, don’t think gets enough recognition. I use it nearly everyday and I love it. I supports both vector and bitmap graphics; it handles and makes use of alpha-channels in ways Photoshop and Illustrator still don’t; and it’s basic user interface is more intuitive when doing work for the web (you’ll have to try it to confirm that last point). A little note: a lot of people use Photoshop to do preliminary design work for websites. That’s fine, if you that’s what you want to do, but I have found that Fireworks—which was specifically designed for web-destined graphics—works much better than PHOTOshop which was designed for use with (surprise!) photos. If you don’t believe me, download the free trial from the Adobe website and use it for 30 days. You won’t be disappointed (unless you’re stupid.. jk).

Color Picker. When I’m designing, it’s always nice to have access to a little color picker. I use a Mac at home and a PC at work so I have two solutions here:

• For Windows. there is a great little application that I have come to love called ColorCop. It’s really simple. There’s an eyedropper that you can drag over anything on your screen, then it will tell you the hex code for the color and automatically copy it to your clipboard. Simple and lovely.
• For Mac OS. Here’s an awesome little tutorial about how you can use a little AppleScript to write your own. I did it myself. It was one line of code or something. Try it.

Briar Press. I really, really don’t want to share this. It’s kind of been my little secret for a while. BUT, because I love you guys, I will share it. Briar Press is a letter press community that has, among other things, a collection of clip imagery called, “Cuts & Caps”. To get the clips, they take letter press ornaments and initials from old specimen books, scan them, vectorize them, then offer them on their website. Some are free, other are for sale. But, all of them are really cool.

Lipsum. This is very simple website that generates Lorem ipsum text. I use it frequently when making mock ups. For those of you who use Dreamweaver, “Lorem and more” is a free dreamweaver extention which does the same thing. You can download it here.

Character Codes via Digital Media Minute. Periodically I’ll need an (X)HTML character code for an infrequently used symbol. Here’s a nice list of them all, sortable by a variety of characteristics.

1 2