6 Easy Steps To A Better Web Design

by derek on May 23, 2011 · 51 comments

Designing a website can seem like a daunting task; especially if you are new to the design process. Here are six easy steps that everyone can follow to help ensure they are building a better web design. These steps can be used for brand new sites or even for sprucing up an existing site.

1. Determine the purpose of the site

Many people make the mistake of jumping into the design process without doing the necessary background work. Before you make the first sketch, or even contemplate colors, fonts or graphics, take the time to consider the goals of the website.
What are you trying to sell – is it a service, product or even simply information? Who is the intended audience – a 14 year old boy or a 75 year old woman? The answers to these questions are going to play a large role in all aspects of the design.
By having a firm understanding of the purpose and audience, you will be able to decrease the amount of time spent on finding the right look and increase the effectiveness of the site.

2. Plan it out

This second step will also save you quite a bit of time in the design process. First, you’ll want to gather all of the necessary information that needs to be communicated through the website. This will help you determine what pages are necessary for the site.
Next, take time to brainstorm the design. Don’t simply go with the first concept that comes to mind – review other sites that speak to the same audience as you are targeting; browse through design books and magazines; think about retail displays you’ve seen in recent months. You may end up going with your original concept, but taking the time to peruse other design sources will help you confirm that the path you plan to follow will captivate your target.
When planning the design, take into consideration the longevity of the look. Websites should be designed to last for years to come. Make sure that the design you are considering will be easy to update and modify as new goals and information are formed.

3. Make it functional

Websites first and foremost are created for consumers to easily get the information they are seeking. This makes it crucial to have an easy-to-navigate design. You’ll want to make sure that first time users are able to find what they’re seeking within a couple of minutes.
Also, you’ll want to ensure that the graphics load quickly and properly in all of the popular web browsers. This means that your design and the techniques you use to build your website need to be universal.

4. Embrace white space

It’s easy (and tempting) to overload websites with graphics. But it’s important to include plenty of white space in your design. White space helps the human eye process all of the information that is on websites, making it easier to locate the sought after information.

5. Don’t forget the text

As mentioned with functionality, design is about more than just color and graphics. You also need to consider the text in your design.
People will often notice the text on a website before the pictures and other graphics. This is because they are ultimately looking for information, which will be contained in the text. But this doesn’t mean that websites need to be plain or boring. There is quite a bit you can do with text to make it visually appealing. However, make sure that the text is still readable!
When considering the text treatment, also take into consideration the background behind your text. You will want to make it so the background doesn’t take away from the text. What is typically recommended is a white or light colored back ground directly behind the text.

6. Get feedback

Once you’ve planned your design, get feedback from people you trust. Ask your colleagues as well as some friends and family who fall into the target audience. Show them the navigation, color, fonts and other design elements you are considering.
Ask your reviewers what they perceive to be the purpose of the website based on your design. Also ask what emotions are evoked by your chosen design elements. Make sure that the answers to these questions match your goals. If the answers don’t align with your purpose, then it’s time to tweak your design. This exercise will help you increase the success of your website without draining a considerable amount of time.
About the Author
Anna Bailey is a blogger and social media advocate at the credit card blog, CreditDonkey.

Stay In The Loop!

Subscribe to the Derek Semmler dot com feed via RSS or Email to receive notifications when new posts are published. Follow the WordPress ninja on Twitter too!

{ 51 comments… read them below or add one }

Melanie May 24, 2011 at 10:00 am

Nice, I like your post. Your tip about white spaces on websites is very important. Sometimes we see bright backgrounds and our eyes suffer with only to focus on.

Reply

atlanta cosmetic dentist July 5, 2011 at 7:35 pm

I also like this post. I am very much interested when you talk about web design. This is my expertise.

Reply

Online Opportunities May 24, 2011 at 12:25 pm

The way a website looks is very important as it is the first image that a visitor gets when he visits a site but I think the most important is the functionality and the speed that a site loads because this determines whether a visitor will stay on the site or not!

Reply

Lynda May 24, 2011 at 1:14 pm

Derek,
What a great post my Anna. I think when designing a site, bloggers become excited and don’t put the appropriate time and thought into their site prior to getting it going and that’s probably why they sometimes fail. I particularly agreed with step #3 Making Your Site Functional, if a site takes too long to load, I will leave it and don’t usually go back. 🙂

Reply

fred@finallyfast May 24, 2011 at 5:55 pm

THANK YOU for posting #4: Embrace White Space.
This is a concept that is so commonly misunderstood, unknown and ignored. More does not equal better, whether you’re designing a website layout, painting a picture, composing a song, or whatever! Minimalism can be effective.
Freddy K

Reply

Andrew May 24, 2011 at 9:24 pm

This was a great post. It basically sums up what was in my head, but put to words.

Reply

Blogging on SEO May 26, 2011 at 7:30 am

Planning the layout is very important as you need to get appropriate content,banners and ads according to that.
Font size,font color and background color of the website should also planned according to your target audience. For eg: If your target audience is older people, then your content should be presented in a way that caters to that age group.

Reply

Techlinking May 26, 2011 at 10:55 am

We must design a beautiful theme for our website 😀

Reply

Bob @ Charlotte Dentist May 27, 2011 at 11:21 am

Thanks for the info….i’m just about to start up a site for the first time..i’ll use this as a good reference!

Reply

Ragab @ spinal surgeon May 27, 2011 at 6:57 pm

It is just nice to see someone recommending to plan out their site. So many people have no idea of where their site is going.

Reply

Most Wanted Cars May 29, 2011 at 3:29 am

Hi, Nice to see a pretty professionally done blog on the this rich subject. Many many thanks to you for this great share.

Reply

dian@Bowen Agency May 29, 2011 at 4:42 am

White space is something pleasing to the eye and that’s what most websites with advertisements tend to forget.

Reply

LowVm: Cheap VPS May 29, 2011 at 7:43 am

I like your post. Your tip about white spaces on websites is very interesting.

Reply

Allan@Effects of Prozac May 29, 2011 at 7:44 pm

If there was an upvote feature, I’d use it here. Thank you for the informative post!

Reply

derek June 6, 2011 at 9:39 am

There is now an upvote feature with the Google +1 system in place. Feel free to give the post a vote if you feel it is worthy.

Reply

Jenny @ BingoBabe.co.uk May 30, 2011 at 1:02 pm

Nice post, well laid out and methodical.
TBH, i wish i followed this advice when getting my site designed. It would have definitely turned out to look a lot better.

Reply

Gary June 1, 2011 at 2:05 am

I like the #6 tip.
But friends and family are afraid to offend your ego. I usually use the Amazon Turk or CrazyEgg to re-confirm what they tell me.

Reply

Harvey@Cheap Mobiles June 1, 2011 at 3:49 am

I agree Gary, friends and family always say ‘yh, that looks good’ and don’t tend to give good critiscm.
Is a light coloured space ok, rather than white space? I have a light cream coloured background on my site.

Reply

 Gold Star June 1, 2011 at 5:56 am

I believe a website should be simple but artistically done with full of functionality. 🙂

Reply

Online Opportunities June 1, 2011 at 9:26 am

I totally agree you should never forget to the functionality of your site!

Reply

Settlement Purchaser June 2, 2011 at 12:45 pm

I always try to make a well planned out wireframe and go from there. These are great main things to focus on.

Reply

 Gold Star June 2, 2011 at 11:35 pm

The last tip (Get Feedback), will determine how your potential traffic views your website.

Reply

Shauna June 3, 2011 at 6:11 am

Very informative post, even though you are not a web designer with these tips you can surely make a beautiful website. These 6 steps are easily to follow.

Reply

Richard Hill June 5, 2011 at 6:29 am

Like many of the comments I not only like the article but particularly agree with the points about purpose and planning. So many people leap straight into how they want their “web design” to look – I guess as it’s easier than having to actually think about what they want it to do. Unfortunately too many don’t think about budget too, thinking that the design and build is all that is required for success!

Reply

 Gold Star June 5, 2011 at 10:40 pm

I have to agree with you Richard. Those eye-catching websites aren’t built with just a dollar.

Reply

PHP Books June 6, 2011 at 10:12 am

Sometimes you get to meet difficult customers who cannot clarify their requirements thus making a Web Designer life tough.

Reply

timothy June 8, 2011 at 6:10 am

Thank you for your post. I like the ideas you’ve shared. This can be very helpful.

Reply

john@Riftsoulguide June 9, 2011 at 4:17 am

I like your site and your helpful comments especially about the “embracing the white space”

Reply

Joe@Leadinglocksmith June 9, 2011 at 9:24 am

I loved your point about making the site design functional and having the graphics load quickly. Keeping it simple, functional and easy to navigate is the key. Too many sites nowadays are burdened with unnecessary widgets and “features” that don’t add anything and just eat CPU cycles. I’m still amazed when a site makes my browser freeze up and my CPU spike to 70%.

Reply

Settlement Purchaser June 13, 2011 at 11:20 am

I have found that if you work with wireframes you can avoid many mistakes when dealing with someone else who is helping build it. It takes a lot of questions.

Reply

Fábián Gábor @ fotograf June 20, 2011 at 6:57 pm

Well, I’ve been a designer for a couple of years, but then I started a business as a freelancer photographer. I launched my website, made a few designs for it, but I’m still not satisfied with the look. It’s like something is always missing, or it isn’t enough catchy. I just don’t know what’s wrong. I always want to make it better but I can’t. Would you take a look please?

Reply

nanm June 23, 2011 at 5:51 am

For a very elegant web design of a website you must follow these tips and they all are useful for creating a better web design – i think the #2 is very vital. To plan for a good thing is always necessary and that can make the thing perfect in every sight.

Reply

4dable June 26, 2011 at 5:17 pm

I agree with most of these posts. The most important thing is the layout and the execution of it. Assign a good gameplan and follow thru with it. Customers can tell something that is thrown together as opposed to something that is thought out and executed well. Thxs for the tips, cheers mate !!

Reply

Ask Questions June 30, 2011 at 4:06 am

For making catchy web designs, we need to keep to follow guide lines of human computer interaction(HCI). What do you think?
Rabi.

Reply

Fábián Gábor July 5, 2011 at 9:30 pm

I redesigned my site, especially my galleries, tried to implement some javascript to position the most important thing in the center of the screen and everything else below the fold. Now it seems to be much cleaner, more minimalistic.

Reply

Gold Star July 9, 2011 at 8:45 pm

Last thing is make sure all the links are working. LOL It’s one thing I hate when it redirects you to the same page. 🙂

Reply

Online Opportunities July 23, 2011 at 10:46 am

I agree with you, this is very important for the functionality of a website and you should regularly check if all links are still workink

Reply

eÄŸlence July 12, 2011 at 1:54 am

very nice post. i am use

Reply

azdrian July 20, 2011 at 2:30 am

Nice 100 cents article,love it!

Reply

Jason July 25, 2011 at 12:01 am

Thank you very much for sharing this one. This only shows that i have to learn more about this kind of stuffs since i am just starting my website… it’s very useful.

Reply

Mike@how to get rid of a hickey August 1, 2011 at 12:15 pm

site design is indeed very imp and play a major role in decreasing bounce rate.. i m thinking of switching to premium themes now..they look gud 🙂

Reply

Settlement Purchaser August 8, 2011 at 10:56 am

Thanks for the post, I was unaware of some of these tips, Thanks.

Reply

Brian Kinkade@lakewood homes August 11, 2011 at 10:50 am

Designing a web site, particularly in advertising must be very engaging with the user visually. This keeps them on your website long enough to translate the advertising message to them.

Reply

@San Diego Web Design August 24, 2011 at 8:38 pm

A website is something that is very difficult to do.

Reply

Mark September 1, 2011 at 1:16 pm

Great advice! As a guitar player I can totally relate. I made much larger strides when learning by playing songs I enjoyed versus just trying to learn the techniques/tricks. Actively mixing the two together makes for a good time and quick learning.

Reply

Maja@fantastic sams November 22, 2011 at 11:59 am

All websites are build on some theme and today search engines also pays very importance to web site design. web site design also play role in ranking.

Reply

Jesse@Village Walk real estate December 18, 2011 at 9:53 am

Those are great steps but i think you missed one important aspect which is competition. You need to look at other web designs to be aware of what’s happening in the web design field.

Reply

Russ@Michigan Web Design December 29, 2011 at 7:53 am

Great post Derek! I really like how detailed this post is. Very informative and helpful for anyone who wants to start a website or improve their existing website!

Reply

James@basic computer skills January 19, 2012 at 9:28 pm

Step 6 (getting feedback) can often be a tough step. It can be hard to listen to others critique your design you have spent a lot of time on. I have to make sure I try not to be defensive and be open to suggestions because it can help tremendously.

Reply

Mary Lee@dental seo February 28, 2012 at 4:15 am

I agree to you James. Be ready if you heard negative feedbacks. And make it your challenge to edit your site the way they like it. But of course, not all feedback are good.

Reply

Brian@Digital Printing Chicago May 12, 2012 at 7:50 am

I think having a good amount of content is becoming more and more important. You really have to have something unique to offer the internet gods in order for them to bring you a decent amount of traffic.

Reply

Leave a Comment

Previous post:

Next post: