The 7 customizations you can do to Thesis that will take it from looking mediocre to looking badass and professional. In my experience, these tweaks separate the okay looking designs from the spectacular.

It doesn’t take much. Thesis is optimized in a way that you cannot really mess it up too much, thanks to Pearson. Hence why the default layout actually looks pretty damn amazing all on its own, but there are some small adjustments you can make to really kick ass with customizing.

1. Create professional navigation bar settings with a great color combination
Some of you think it’s really fancy pants if you have a hover color that is different or bold. However, if you’re going for professionalism, your hover state should be useful, not aesthetic. If you are using a light color for the background of your nav bar, then use a darker color as the hover state. I tend to be fond of using a shade lighter or darker than the original color.

And, please use a current page item state. I can’t stand when I go to sites and they don’t make it easy for me to see what page I’m currently on. Use CSS styling to make it as seamless as possible for a user to navigate your site. Each embellishment should add to the experience in some way, whether it makes it easier to glide through the different areas of a site or helps with overall organization. Make choices not for aesthetic purposes, but from a user’s perspective.

2. Create a header without beveling, embossing, or using common fonts such as Impact (and no clip art, for godsakes)
It’s not too tough to make a class act header for your blog. Seriously. Download Gimp, an open source Photoshop-like software program (or use Photoshop, if you have it). Find a great font. The typography in your header will make or break the professionalism of it. Don’t get fancy in Photoshop or Gimp with filters and bevels and embosses. For the most part, a great font stands on its own.

For some beautiful free fonts, check out:
40+ Excellent Free Fonts for Professional Design at Smashing Magazine
All things fonts at Smashing Magazine (they rock, obviously)
DaFont has some decent free fonts if you comb through it

If you want a picture of some sort, choose the right one. Don’t rely on Google image search to give you anything even remotely quality (uh, or copyright free for that matter). Use iStockphoto or Getty Images to spring for a high quality perfect image.

3. Incorporate a splash page and have the blog be secondary
The trend I’ve been noticing is that many people want their Thesis site (and WordPress sites in general) to act as a web page, instead of solely a blog. Whether you’re designing a site for your small business or for your big writing voice, you can establish some credibility by having a splash page. If you are doing anything on top of blogging, a splash page is necessary, in my opinion.

It helps people to understand what’s going on at your site. If you are a business, why is your blog the front page?

Here’s what you do to make a splash page happen:

Create two Pages in WordPress. One will be called “splash” and the other will be called “blog.” At this point, you don’t need any content in the “blog” page because that’s where your posts will soon be housed. You can add whatever you want on your “splash” page at a later time.

In your WordPress dashboard, go to Settings > General > Reading. You’ll see that you have an option to have a static page. In the dropdown, select “splash.” Then, for your “latest posts” page, select “blog” in your dropdown.

And, done! You have now created a dynamic splash page (well, once you add your killer content to it) and a different page to hold your blog posts. You rock, right?

4. Use your color combination in a smart, design-friendly way
Picking a strong and effective color combination for your site design is one of the most important things you can do. Thankfully, Thesis gives you all the control you’ll ever need to implement your color combination in creative and interesting ways.

Oh, I found THIS! and it’s kind of amazing – it’s a color scheme generator. *design geeked out!*

My suggestions for color usage?

• Use 3-4 colors maximum
• Make sure the colors stay within the same palette – pastels, neons (not recommended, but maybe could work), warm, cool, etc.
• Seriously, unless it’s really necessary, always use black as body content text (unless, of course, you are using a dark background for your content box, then use white)
• Throw in splashes of color by stylizing links and headlines
• Links should be the same throughout the site (sometimes I break this rule, but for the most part, I want to keep my links consistent, which, don’t forget, includes post titles)

5. Make sure that each picture or icon you add is consistent with your overall style
I can’t even tell you how many times I’ve seen a mish-mosh of crazy icons all over someone’s site. First, it completely diminishes your credibility, since consistency throughout the site is actually a subconscious indicator of professionalism. Second, it just looks lazy. Make sure the graphics you have throughout the site all are consistent with the style you have gone with.

Design is really intuitive, so if you have an inkling that something feels or looks out of place, then it is. Change it. You don’t want someone discounting your business or your writing based on a clumsy design or for your lack of consistency.

6. If you’re not graphically inclined, focus on intelligent and simple designs
Photoshop brushes are really fun. Yet, they make it really easy for people to go overboard. Same with fonts. Pick smart choices for your fonts and embellishments in whatever you are customizing.

The best design tip I have? Focus on placement. I was on the phone with my friend Greg the other day and he was wondering why the hell everyone loves my Shatterboxx design. He was all, “The first thing I thought of when I saw your site was, ‘Seriously? It’s one column and has a graphic by someone else as the background.’”

And I was all, “Exactly.” Because, you know what separates a mediocre design from a great one? Professional and intelligent placement of simple images and typography. I’ll give you an example. Both of these headers are the same size, use the same colors and the same Photoshop brush. Notice what a small font change and minor placement adjustments do to the header:

NO

YES!

Rinse & Repeat.

The first image is just all wrong and please, for the love of god, STOP! using Impact as a header font. Actually, stop using Impact all together. It’s everywhere, boring, and adds no stylistic goodness AT ALL. While we’re chucking fonts out, stay away from Comic Sans MS, Mistral, and Arial. These fonts are ubiquitous and are just lazy choices in terms of aesthetics.

Small details will set your site apart. Color changes, smart looking nav bars, and great typography/image choices for your header will make a huge difference. Trust me.

As I said before, design is extremely intuitive. Sure, complex designing is tough for people who don’t have the knowledge and tools to execute their ideas, but simple and compelling imagery is right at your fingertips. Oh, and pssst, if you don’t have Photoshop, you can download a 30 day free trial at Adobe. Go wild, people!

flickr credit