An eye doctor’s guide to web design

You’re sitting in the exam room and there’s a huge machine covering your eyes that looks like a combination of the lone ranger and a super hero character’s metal mask.

The doctor pleasantly asks you – which is better? This one or this one? You get to view a teeny, tiny line of letters projected on the wall and then to respond to the doctor. Your answer will lead  to another set of choices. At the end of the appointment, you learn that your sassy lime green ‘over-the-counter’ reading glasses just aren’t doing the trick. You need prescription lenses.

Your eye problem required an expert to assess your eyes and prescribe a custom solution.

Just as eyes need professional assistance so, too, do soloprenuer websites. These resourceful soloprenuers found a quick DIY website solution so that they could quickly get an informational website up and running. Initially, the DIY site worked, just as those lime green reading glasses worked.

As a business grows and/or evolves, clients realize that their (fill_in_the_blank_cuz_there’s_tons_of_them) template  is looking a bit dated and, perhaps like you, they envision a site that better reflects the uniqueness of their business with a blog and graphics that are relevant and interesting. It’s time for a website prescribed to meet your goals and needs.

Just as the eye doctor asks you which is better? This one or this one? A professional web designer will work closely to make sure the site you ‘see’ is the site that frames your best business face.

How? By listening to your preferences, then creating a design brief and then showing you choices from which you’ll be able to create a more dynamic and customizable website.

Once you have your preferences carefully documented. Your designer will embark on a quest to create a website that combines those preferences, with his/her graphic design, web design and visual problem solving skills and knowledge. Here are several steps along the way in this process (your results and steps may vary):

1. wireframing: this can be as general as a sketch of the main navigation with references and placeholders for images and content on the main page and  inner pages. For relatively complex sites including e-commerce sites, the wire frame process is a vital way of creating a picture of how website visitors will navigate the new site and wireframing can be particularly informative for both client and web designer. Recently, I used InvisionApp to prototype an e-commerce site and found it’s user-interface was easy and intuitive for the client to use.
2. menu prototype: whether or not the project requires a wireframe, I set up a simple html/css based menu of the client’s site. This step helps the client actually see what happens when a site visitor hovers their mouse over the navigation bar and acts as a mini-prototype of the overall design of the site.
3. two design choices – I typically prepare two design choices for the client to review; two options for the home page and two options for the inner page. I prepare these in Photoshop, then save them as a PDF and email and review them with the client.
4. two revisions – once the client reviews the design options, he/she has two more revisions of each of the pages above. And, the client has the flexibility to do any of the following: ask for revisions to one of the choices, ask for a revision based upon a combination of the two options or ask for another fresh, new round of two options for the home and inner pages.
5. coding: once a design for the site has been completed, I move to coding phase and take the designs and create them in xHTML and CSS
7. if the client needs a content management system such as Unify or WordPress,  I either embed Unify into the site’s root folder and train the client how to update the site through Unify. Alternatively, if the client prefers a WordPress site, I modify WordPress so that it reflects the design of the PDF and xHTML and CSS I’ve prepared. Then, I’ll train the client to use the WordPress dashboard.
8. Nearly ready: The new site is nearly ready but there are lots of search tasks/details to be done including creating a sitemap, adding Google Analytics  and other search engine friendly details that need to occur to make sure your ideal clients can see your spiffy new website, too.

In the end, with the help of a professional web designer, you, too, can see the transition from a foggy, out of date website, to a much clearer vision of a new web site designed to help your ideal clients see your business in its best virtual light.