All good web designers are looking to make an impression with their work. Grunge design – with its myriad textures, patterns, and colors – can be a great way to do that, particularly for brands that are looking for an “edge” to their look.

The key is to make sure that it doesn’t come at the expense of usability and functionality. In the wrong hands, the complexity of a grunge design can become overwhelming, turning away users rather than engaging them.

It’s a sensitive way of designing your website. Depending on how you put in all the elements together, you might be able to come-up with an awesome design that’s going to “WOW” your visitors or… annoy them with how disorganized and messy your site is. That said, it’s a double edged sword that not everyone dares to pick-up.

Before I even share about how you can make your grunge design easy on the eye, I want to you to know that I am as much as interested to hear from you and what you have to say about it. Whatever comments, suggestions, or even brutal reactions you have (really?), I urge you to write it down on the comments section below.

So how do you make sure your website’s grunge design is easy on the eye? Here are a few tips to keep in mind.

Use handwritten typography for headings – but not body text

Some of the best grunge designs make use of fonts that are hand drawn, making it truly unique. But the downside is that it’s also usually hard to read, particularly at smaller sizes. Instead, reserve it for larger headings or even just the company name. It will still make an impression, but not at the expense of readability.

The impact of using hand drawn typography for your headings are stunning. This is one of the advantages of using grunge designs. You readers easily get captivated or drawn to your headings simply because its handwritten.

Now that they’re drawn to it, you just have to make sure that your contents or your actual heading are interesting enough for them to continue reading.

Be conscious about the psychology of colors

Simply using any kind of color combination won’t help if you want to make your grunge design easy on the eyes of the viewers. Although choosing color combinations that “mixes and matches” are important, what’s equally as important is thinking about the psychology of the colors that you are using on your site.

Studies show that certain colors can induce a specific type of emotion within the person viewing it. Under this premise, if we’re able to choose that specific color and compliment it with other colors that has somewhat the same effect, then you’d be able to add messy edges or dirty looking backgrounds while still inducing a feeling of easiness and calmness to the viewers. To give you just a few, here are some colors you should consider…

• Blue – It creates as sense of calmness and it does the exact of opposite of what the color red does. If red induces strong emotions, the color blue cools you down. Blue is said to lower your heart rate and blood pressure thus causing you to be more relaxed calm and relaxed.
• Green – This induces a relaxed and refreshed mood. It encourages unwinding but with enough warmth to encourage unity and comfort.
• White – White is a color of cleanliness, order, purity. Using white as the majority of the color on your site will help give it the clean and feeling of the entire thing being in order.
• Brown – The color brown symbolizes simplicity, structure and reliability. The feeling of simplicity and structure that it brings is a good way of counteracting the boldness and provocative effect that you want your grunge design to have.

These are the colors that can help give your grunge design that calm and “organized” feeling even if the you use messy edges or backgrounds. These colors can somehow help neutralize your design’s messy feeling if you feel that you overdid yourself.

Conversely, if you feel that your design needs more “dirtiness or disorganization” in it, here are some of the colors that you can use…

• Orange – Although the color orange has that feeling of warmth and comfort in it, it’s actually intellectually stimulating. So if you feel like your site needs a lot more “action” in it, using color orange is a good way to go.
• Red – Red is a color of passion. What better way to add an element of disorganization than to add a strong color that induces passion amidst all the other colors, right? Simply mixing a bit of this color in the right places and you’ll find yourself a grunge looking site in an instant!
• Violet – The color violet promotes creativity and it stimulates your reader’s artistic ability.

These are the effects that the psychology of color can cause to your website’s visitors. Since you are planning to use a grunge design, I urge all of you to consider how colors can affect your grunge web design.

Learn how to balance your grunge web design’s feel. Make sure that it isn’t too normal and neither is it too “grungy”. A good way of doing this is trying to step back a little bit and see where your design is up. Depending on what it needs, you can simply use the colors to make the changes fit your website’s needs.

Clean some edges

That “edgy” effect of Grunge is hard to achieve without literally making use of edges; messy, looping, jagged, ripped, or rough ones. But that doesn’t mean that everything on the page needs to have that style. Mix up clean edges with some dirty ones, and you’ll find it helps simplify the overall design.

As an important note, it’s ideal to use the jagged or messy ones on parts of your design that you want to emphasize. These messy edges do a good job of attracting your readers’ attention so adding these on your opt-in pages will surely get you more clicks or “actions” from them.

Considering how these messy edges are very catchy, using them anywhere in your website can cause you to lose lots of sales. Putting the messy edges on the exact opposite of where the products you’re selling is might cause your readers to ignore the products that you’re selling.

Define outlines

While we’re on the topic of edges, you do need some that clearly define one space from another on the site. It can be tempting to make it all one cohesive piece that simply flows together, but that can make it hard to know where to look. Make sure that you’re still clearly outlining the basic things that people come to expect from a website: top navigation, main content areas, and calls-to-action.

One of the key points that a designer needs to take emphasize on their design is clarity. Without having a clear definition of boundaries or outlines, a website will flat-out look like a lump of buttons and pictures.

If you fail to clearly define the outlines from your readers, there’s a very high chance of them getting confused thus clicking away from your site. You should never allow this to happen.

Get the details right

Even if the overall website design is fairly standard, just a few grunge details here and there can make a big impact, taking a boring or corporate design and making it feel fun and unique. Don’t overlook the way that you can make small changes to incorporate grunge – often subtle is better.

One of the details that you can change that has a dramatic result in your site is your fonts. Changing this detail can almost immediately shift your site’s feel from a normal one to a “grungey”. You can find some font samples from dafonts.com

Be aware of contrast

Grunge designs often rely on dark and moody colors to set to tone, but for a website, that can often translate into an undesirable experience for users. Overwhelmingly, people don’t like reading light text against a dark background. It can cause eye strain for many, plus it’s just not what we’re used to.

If you want to use a dark background, consider defining the spaces where blocks of text will live with a lighter background, making them easier to read. Or just lighten the entire design – consider lighter grays and browns as a color palette or go for a faded look. And perhaps most importantly, no matter what color scheme you choose: make sure there’s enough contrast between background and copy.

Complementing your crooked lines with solid straight lines

We’ve already emphasized how even a grunge design needs to have their outlines defined right? A good way of doing this is complementing your crooked and messy lines with straight and solid ones.

When people see straight lines, they think of boundaries from one element to another. That right there is the key!

With the help of this technique, your readers will be able to clearly identify on element form the other.

Less Is More

When in doubt, simpler is usually better. No matter what grunge element you are considering incorporating, be judicious about how you use it, and always try scaling back a bit to see if you can still get a good effect while increasing the usability of the site.

A grunge design doesn’t always have to be filled with messy edges or dirty backgrounds. Sometimes, less of these “grunge elements” will do the trick if you just make sure that these elements are in their proper places.

A common mistake that beginner web designers make when doing grunge designs is they tend to overwhelm the entire design by adding way too much on it. Never make this kind of mistake!

Perhaps more so than with other design styles, it’s a good idea to seek outside opinions and do testing to ensure that the final product is functional as well as awesome.

If you think of the word “confusing” almost immediately when you think of grunge designs, you can never be further from the truth. Although grunge designs make use of dirty, uneven, broken, and hand drawn elements, creative web designers are able to make a clear and organized yet “grungy feel” design.

Taking to account the tips mentioned above, you should be able to create a grunge design that’s easy on the eyes. Because grunge designs are a reflection of the reality where nothing is perfect and glossy, you are able to connect to your readers in a way that normal web 2.0 sites would. Capitalizing on this “uniqueness” and provoking stature will surely sky rocket your site’s popularity among the many readers on the web!