The Phases of Professional Website Design

14,407 designers received our email newsletter last week. Click here to sign up for free.


Research

When starting a project, the most important key to success is research. With website design, you need know how your users will react based on their wants and needs. Before you start, ask your client questions about their business, their customers, and their competitors.

This will give you a better idea of how to create a website the client and the customers will like, while also beating out the competition.

You should also research a specific demographic that will be most interested in their business and how they function on the web. For example, if you’re targeting a younger demographic, remember they are very social, and conversational, so social media integration would be beneficial.

By doing this, you can create the website with potential clients in mind to generate more business for the client.

Concept

Once you have researched and asked questions about your client’s business, your next step is to begin planning the website.

Personally, I like to grab a pen and create half-page sketches of the website. These sketches do not need to be detailed, but should give you enough to see a general idea of what works and what doesn’t work.

However, if you’re not into sketching, you can wireframe as an alternative. Wireframing works the same way as sketching, but you are creating a more in-depth mockup of the website’s skeletal frame.

Mockingbird is a great, free web wireframing tool that is easy to use and very helpful.

Design

After you complete the concepts, the next step is to finally create the design of the website.

Look at your concepts/sketches and start creating the interface based on what worked, and what didn’t. By creating those concepts before this phase, you eliminate the unnecessary hassle of redesigning the mockup because of a layout element not working with the rest.

Once you finish the design of the website, immediately present it to the client as a .png to preserve the quality (you can present it as a .jpg if you like). From there, the client will give you feedback and you should adjust the design until the client is completely satisfied.

However, don’t be afraid to defend your design decisions in this phase. If you feel a particular element is too important to be changed or discarded, tell the client and explain why. Clients often don’t understand the purpose of some elements, so the clients will most likely respect your wishes when you give your explanation.

Build

The last step is to build the functionality of the website. No matter what programming language you use, you should always adhere to clean coding standards and always have it validated.

Having clean and valid code will make sure the website loads quickly, and will work with most browsers. If you are unsure about the latest standards of your coding language, check the W3C (World Wide Web Consortium) website to help you in this process.

Also consider providing the client with a Content Management System (CMS) if they want to update the website themselves. WordPress is a favorite in the design community, but Pulse CMS is easy to use and easy to implement on your client’s website.

Extras

This step is optional, but I always recommend doing this for every client. Once everything is completed, simply ask the client if they need any other services or could recommend others to you.

  • Would you like me to maintain your website for an additional fee?
  • Do you want any matching business cards or other promotional materials?
  • Will you need future support from me?
  • Do you know anybody that could benefit from my services?
  • Would you be willing to write a short testimonial about your experience?

It doesn’t hurt to ask your clients these questions. Just asking could potentially draw in more work and create a professional relationship, and if they say no, you can simply move on and look for more clients.

Tell us about your web site design process

In the comments today, tell us about your process. What do you do differently and how does it benefit you? Not every website designer follows by this exact process, but finding a process that works for you can help you create amazing websites. Don’t be shy, leave a comment.

Like what you've read?

Subscribe to our M,W,F newsletter packed with awesome content just like this. We'll also throw in a free ebook just for signing up. Enter your email below. Download will begin immediately.

About Nicole Foster

Nicole Foster is a professional website designer from New York that loves meeting new people. At Nicole Foster Designs, she offers website, wordpress, and ecommerce services to unique businesses. In her free time, she enjoys meditating and chatting with other designers.

Comments

  1. Well said – I think the research and concept are very underused and under-appreciated values of any design work. I find the more questions I ask up front, the more smoothly the design process goes and the happier both I and the client are throughout the process. Also, pencil (I erase a lot) and paper are invaluable tools to the design process. What you can sketch and what you can lay out in Illustrator, Photoshop, or Dreamweaver vary greatly. So many more mediocre ideas can be flushed out quickly manually so that the really creative ideas can start to flow!

    One tip I’ve always found useful: even if you don’t like it, write down or sketch ALL of your ideas. I find that if I don’t get it out, it hangs around my brain like a fog and I can’t see the really great ideas because the bad/normal/blah/overused ones are in the way.

    • @April, I agree with you. The research and concepting phases are underappreciated, though they are very important. A project generally runs smoother with proper research and concepting.

      Your tip is very important to coming up with a great design. Never qualify your ideas. Write down everything because it could lead to something great!

    • @April,
      I am totally the same way. I have to get my ideas out (whether good or bad) before I can move on and get to the real meat of my brainstorming and designing.

      Glad I’m not the only one. :)

      April, how do you know when you’ve gotten past all the bad or mediocre ideas and hit the jackpot?

      • @Preston D Lee,

        Ha! I don’t know if there’s a single moment when I say, “Aha! That’s the perfect idea!” Design (and life, for that matter) just isn’t that easy. :)

        I take time to have a brainstorming session and just mind map all of my ideas. This is a step that I find is really important not to rush through, and usually works best if separated in time from the next step. I start with the main idea/concept/client name in a circle, and just let my pencil flow with words/adjectives/colors/feelings that come to mind. I draw lines to indicate relationships, as I generally go down several different paths. What’s really interesting and exciting is to wind up at the same word from two separate paths…these I tend to consider more heavily when I begin the next phase.

        As to what is “bad” or “mediocre,” I judge that by the norm to some degree. Just because I’m creating an elementary school website doesn’t mean it needs a ruler and an apple, or maybe I can use them more creatively than I’ve seen in the past.

        I always remember, too, that beauty is in the eye of the beholder:
        1) It’s important to think of how the audience will appreciate the work.
        2) Not everyone will like your design. You will always be able to find someone who thinks it’s bad or mediocre.

        Perhaps not a terribly satisfying answer, but nonetheless an honest one. Thanks for asking!

  2. Thanks for the a new challenge you have uncovered in your post. I’ve learned newer and more effective things from the post.Keep writing for us, i should come back to see what new in future in here.

  3. Great article and very helpful – if you’re designing sites for OTHER people.

    What I’d like to see more of on sites like yours is coverage of great design principles for people, like myself, who are online marketers and bloggers who publish multiple sites of their own. Most of us don’t have a graphic design sensibility – and we have to develop it over time. What are the best practices to follow when you are YOUR OWN consultant for getting a website up and running?

    I learned header graphic design largely out of necessity. When you manage a portfolio of websites, it’s not feasible to pay an artist to do work on each and every website you own. So many people in this situation cut corners and end up with those horrid, cliched, black and red and white and blue “minimalist” (aka: Ugly Ass) sites. Somewhere between that sort of minimalist and ugly style and sites with more of a high end graphic design is a meeting point where I believe more webmasters and bloggers can start coming together. It’s time to pretty up your websites – even if you’re creating and publishing them yourself!

    • @Jennifer Shepherd, Actually, there should be an article soon about creating a website for your business and what to consider. I wrote it myself as I have designed almost hundreds of sites, so keep an eye out for it (:

  4. Research is the most important stage that precedes to the other levels that dominate thought and user functionality. Spend some time to sit in with your client, thoroughly understand his/her requirements and you will spend less time doing after sales trouble-shooting etc.

  5. It’s easy to resent punctuation. Its purpose is to clarify sentences, so why are the rules governing it so complicated? There are so many exceptions, so many exceptions to exceptions — it’s enough to make you want forego punctuation altogether. Well, back when it was alive and kicking, the Latin language did just that — and it didn’t stop there. Written Latin also omitted spaces between words or lowercase letters.

  6. A graphic design conveys the concept in the specific method. Graphic design provides high end solutions for all businesses, expressing the brand or service with the business in the most valuable form.

Trackbacks

  1. […] The Phases of Professional Website Design | Graphic Design BlenderDescription : Research When starting a project, the most important key to success is research. With website design, you need know how your users will react based on their.http://graphicdesignblender.co .. […]

  2. […] The Phases of Professional Website Design | Graphic Design BlenderDescription : Research When starting a project, the most important key to success is research. With website design, you need know how your users will react based on their.http://graphicdesignblender.co .. […]

  3. […] The Phases of Professional Website Design | Graphic Design BlenderDescription : Research When starting a project, the most important key to success is research. With website design, you need know how your users will react based on their.http://graphicdesignblender.co .. […]

Join the conversation

*