Working at a college, I get all kinds of questions from students about resources, tips and things to help make their (web design) lives easier. Most folks know I’m a web geek kind of gal, so a lot of questions relate to CSS and HTML and things of that ilk.
A couple of my friends kept asking me week after week for tips, and so I compiled a few of my favorite things into this handy list:
Mockups and Planning
GoMockingbird (www.gomockingbird.com)
I use Mockingbird to make wireframes. I really like the interface and have been using it since it was in beta. I was actually able to make a super quick wireframe on the spot for a client to illustrate a potential layout for a web page. The client was impressed. Anything that makes you look like a genius, eh?
Mockingbird is not free — I think it’s $9 bucks a month or something like that — but it’s totally worth it to me. I hate drawing wireframes in InDesign…
SlickPlan (www.slickplan.com)
I use this to draw sitemaps. Some of the exporting is a little funky — especially if you export to a PDF. I usually export out an HTML version of my sitemap and then just take a screengrab of it. Using SlickPlan totally beats having to draw sitemaps in Photoshop, Illustrator or InDesign!
(Did I mention it’s free?)
JumpChart (www.jumpchart.com)
I really, really like JumpChart. A friend of mine hipped me to it after I’d been using Mockingbird for a while. It’s kind of a mash between Mockingbird and SlickPlan. It’s a great way to plan the content of a site into actual pages, and also a great place to have your client enter in their content (so you can all make sure there’s not something missing).
Create an account for your client, determine the structure of your site, and you’re on your way to hopefully managing website content in a neato interface.
Various pricing plans are available. I’m a little cheap, so admittedly, I only have one active project on my free account. But it’s really super sweet if you’re willing to pay monthly.
Tips and stuff
Son of Suckerfish
I used to get asked about dropdown menus in CSS all the time. This is my Bible when it comes to dropdowns. I use this and don’t even bother to use plugins in WordPress whenever I need dropdown menus.
Bonus: It works in Internet Explorer! (Well, sometimes there are bugs, but they’re easily fixable.)
Rounded Corners reference
I always forget how to do rounded corners in CSS. I reference this page a ton. CSS3.info also has other fun stuff.
CSS ribbons
Very cool tutorial on how to do nifty ribbon effects. This works in Internet Explorer too. I found this article via Twitter one day and actually needed to do this effect for a project at that exact time. How fortuitous.
CSS3Pie
My friend Micah told me about this resource once, and it was a godsend. Many times, you bang your head against a wall because Internet Explorer refuses to cooperate with you. But I want rounded corners! And drop shadows! And gradient backgrounds!
CSS3Pie makes certain CSS3 decorations possible in Internet Explorer. You will never leave home without it.
Web Fonts
FontSquirrel
One of my favorite web font resources. Lots of fun free fonts for use. It even has a handy tool you can use to convert fonts so they can be used with @font-face on the web. (Make sure you check your licenses, though … you can’t just do this willy-nilly! I like to play by the rules.)
Google Web Fonts
Well, of course Google has some great web fonts. Copse is a particular favorite of mine. They even make hosting the font easy.
Smashing Magazine
There are always great tips at Smashing Magazine, whether it’s one of their lists of great WordPress themes, an article about a web trend, or tips on CSS. This is a staple on my Google Reader account.
Web Content & Strategy/Marketing
Clout: The Art and Science of Influential Web Content
This book is a terrific resource if you want to learn more about content strategies and writing for the web. I bought this book on a trip to Seattle and wound up reading half of it on the plane ride back home.
It’s a great book if you want to educate clients about their content and how it can further their website’s cause and get people to buy things. It can also help you formulate some plans if your client hasn’t a clue about what they need to write for his or her site.
Other Books I Like
Web Designer’s Idea Book Vol. 1 & Vol. 2
I love both these books and flip through them for ideas and inspiration a lot.
Bulletproof Web Design
I think there is a newer version of this book. I bought my copy several years ago, but it taught me a lot about CSS and is a great resources. If you’re still used to coding in tables, get this book to learn how to break out of tabledom.
Codin’ for the Web
I actually own several books by Charles Wyke-Smith. (He has a book about scripting with JavaScript and AJAX that I need to jump into soon.) Codin’ For the Web talks about PHP and forms and creating a super rudimentary content management system. It’s written for non-geniuses (like me). If you want to learn a little bit about PHP and coding for educational purposes, pick up this book. You may not know everything when you’re done reading it, and you still may not want to write a line of code, but at least you’ll have a basic understanding of what’s going on.
jQuery for Dummies
I’m totally a dummy when it comes to jQuery. This book helped me understand some scripts and jQuery on a super basic level. Heck, I was able to use some of the stuff in this book for a client project. I was proud as punch … and you will be too if you get to use some of the tips in the book!
On my iPad
Codosaurus
When I bought my iPad, one of the first things I looked for was a tool for web development. I found Codosaurus and was hooked. Pretty interface — hey, I’m a designer and I pay attention to what interfaces look like! Easy to use. You can edit files directly on the server. It’s nifty for quick edits.
It doesn’t have an FTP client so you can work with files locally and I do miss my pretty colors from Dreamweaver, but it’s a solid program. I’ve been able to do quick updates from airports, the passenger seat of a car and all kinds of mobile places. Nifty!
Lastly …
Google and Twitter.
I think 85 percent of my questions about anything development-related have been answered by Google and carefully bookmarked in my Evernote account. And if I’m really stumped, I’ll throw out a question to the Twitterverse and someone will answer it.
The internets rule!
If you’ve got other great resources, please share in the comments. Thanks for reading!
