Thought we’d share just a few tips we’ve come across as we design each day. Seth Godin says lists are cool so I’m going to try one.
1. Think like a website. Try to keep in mind the limitations and strengths of the web when designing. For example, look for backgrounds that can repeat easily, or avoid designs that have a lot of overlapping transparency (at least until IE6 isn’t on so many computers).
2. Web typography. Your web typography will set your design apart from other studios. Study optimum line heights, widths and look for inventive ways to guide the viewer through your layout only using CSS rules. There’s something refreshing about only having 3 or 4 good fonts to work with. Flash replacement (sIFR) is alright, but don’t overuse it.
3. Subtle effects. A subtle gradient or shadow can add dimension without being tacky. Please keep the word subtle in mind, and only use when necessary. We don’t need shadows and gradients everywhere.
4. Variations of the same color. I like complimentary colors as much as the next designer, but not all designs have to be so polar. Again, subtle is the key here. Look for ways to implement your color, but at a different intensity.
5. Grids aren’t evil. There are lots of studies on grid based design, and generally I think they are a good idea. It helps you line things up and keep them organized. But hey, you gotta know the rules to break them, right? Pick your moment and break that grid for some visual interest.
6. Graphics and icons. Your icons or images need to be awesome. If you make them yourself, pay attention to detail and try to keep them uniform if you’re doing a set. If you can’t make them yourself, go buy a good set to use. Crappy icons or images will bring down the feel and professionalism of the site.
7. Details. Honestly, it’s all about the details. Sweat over them, pour over them. Work on it until it feels right, both as an individual section and when viewed with the rest of the site as a whole. It takes time, but it’s worth it. You’ll be happier with your work and your client will be, too.
8. Beauty can’t be skin deep. You can’t just make it look good, it has to be usable, too. Your grandma should be able to figure out how to use it. Don’t be too proud to change it if it doesn’t work the first time. Or if it can be better.
9. Design solves problems. We have our work cut out for us. Not only do we have a short time to understand an industry we’re probably not familiar with, but we have to satisfy the client and create a great user experience for the end user. Not to mention increase sales and traffic. Again, your job is not just to make it pretty. Make it useful. Solve the problems.
10. Code architecture. If we’re coding the XHTML and CSS, then a whole other discussion on design comes up (maybe another Top 10 list in the future). We are given the task of designing the architecture of the site from a code standpoint. The way we utilize HTML elements like header tags, blockquotes, divs, etc… has very important ramifications for accessibility and search engine optimization, and can help future proof the site for new designs down the road. Our design to the code that most people will never see can be almost as important as the part that they do.
Share This Entry with Your Favorite Social Networking Sites.Do you any website where to get good color combinations?
Thanks
Thanks for the kind words, Brad!
Paul, I just usually “go with my gut” on colors, but I hear Adobe Kuler is pretty cool.
Here’s one that Darren Hoyt just turned me on to: ColourLovers. Awesome.
And yes, I’ve seen Adobe’s Kuler - cool, too, especially the Monandrium (sp?) plugin.
Another excellent article. I am just getting back into he swing of things after a week or so doing other things… I am about to embark on the first full web project I have done for many years, from concept, layout and design to coding and cms implementation. It will be challenging thats for sure, so thanks for the inspiration.
Hey there, nice list. I’m just building my first site (and I’m no designer nor anything like a web expert so far). But I’m looking forward to the first redesign and to apply some of this.
Really nice work boys, you’re in my design rss folder from now on!
Hi,
You have gathered nice tips about web designs. Very informative article.
I can’t get innovative ideas like u.
If you have more, pl post here.
CSS Tricks has a nice, plain english version of major CSS bugs in IE 6.
Number six in my article on Top 10 Tips for Web Design was to make awesome icons. PSDTUTS has a great article on how to design them effectively.
At first I thought the CSS framework generator was great...just pop in your XHTML and you get a nicely defined CSS file to start with. But it seems to add a lot of bloat, which we try to keep down on right? Well, go check it out at least.
I’m loving these limited edition Jawbone Bluetooth Headsets.
Cameron Moll is starting what looks to be an awesome series.
Finally, I can stop iPhoto from opening when I plug in my iPhone.
Inspiring article from Shawn Blanc.
The best Content Management System for designers. Feature rich, completely customizable, and easily extendable.
Basecamp is the smarter, easier, more elegant way to collaborate on your internal and client projects.
Brad
April 09, 2008
Very nice tips! I found your page through thebestdesigns.com and I really like the designs you guys put out. Will definitely be checking back in the future.