The 7 Step Web Design Process

Escher, M.C.. Relativity. 1953. Lithograph. Museum of Mod. Art, New York.

STEP 1: Stakeholder Interviews: Why guess when you can ask?

This is an important step that is overlooked by most web designers, but has the potential to save you the most money in the long term. I have never launched a website that did not first involve several hours of meetings listening to my clients’ needs. More than that, I want to find out what every stakeholder in your organization needs your website to do for them – from the president to the sales team to the labor force to your customers. When we are able to avoid complications, improve customer service, simplify work and make everyone a little bit more productive this is where the cost benefits start to accrue and your new website begins to pays for itself.

STEP 2: Sketching & Wireframing

Long before I start designing, we will agree on the basic framework of your site. If you already have an existing site and/or sales collateral, I will conduct a content audit to determine what your copywriting needs are by ranking all your existing content and determine what the best flow of information is based on the answers your stakeholders gave me in Step 1. During this step we will also identify the parts of your site, if any, that need to be editable and choose a content management strategy to allow you to quickly and easily make changes.

STEP 3: Prototyping

In manufacturing, no successful product goes to market without first being prototyped and tested. Yet most websites are still launched from a finished graphic design based on the best guesses of the client and designer, and turned over to a programmer to be implemented pixel-by-pixel into a finished product. I cannot stress enough that this is the wrong way to go about things. When I worked in advertising agencies, every decision we made for our Fortune 500 clients had to be backed up by data and it will be the same with your website. I will launch a simple development website based mostly around your highest quality content and drive traffic to it using Google AdWords. We will then take a look at the Google Analytics data to answer several key questions about how real people are accessing your information. What makes them click in the first place? What pages do they stay and read? What content persuades them to click through to the next page? All these questions will be answered definitively before you start wasting money designing and programming based on potentially faulty assumptions.

STEP 4: A/B Testing

Once we’ve got some hard data from the prototype site, I will sit down with you again to try and come up with better messages and retire those that don’t work. When we are confident we have a better version, we will split-test the new approach against the old one to further refine your messaging and calls-to-action. As in Step 3, no decision will ever be based on guesswork. Instead, we will let data drive the decisions we make. This ensures that I deliver a finished website that is the most effective vehicle for increased sales and provides your customers with the best possible experience.

STEP 5: Graphic Design

As you can see, it takes a lot of leg work before I ever start to design the polished look and feel of your new website, but at this point in the process we have already learned a lot about what makes your brand unique. I will now use all that we’ve learned to apply graphic design elements in multiple rounds to your development site and split-test each round of refinements to make sure they actually increase conversions. Since we’re still working in prototyping pages, you’ll be able to test different images and messages quickly without having to incur extra costs or worry about how many rounds of changes are ‘included.’ Because I won’t have to pick apart a finished product, this saves you an enormous amount of time and money.

STEP 6: Programming

We’ve obviously been programming since setting up your prototype website, but at this point we have a hard-working design and it’s time for me to refine and optimize your code. By following the standards established by the major web browsers and Google, I will optimize your code for speed and searchability, leading to higher rankings and more traffic right off the bat. We will determine which parts of your site need to be secured using encryption and implement a trusted security certificate to further improve your credibility. Your images will be optimized for fast loading and the code behind the site will be ‘minified’ as recommended by Google. Lastly, your site will be verified as compliant with current industry standards, best practices and published recommendations from each of the major search providers.

STEP 7: Quality Testing

Once your new site is in full production, I will go back to the same stakeholders in Step 1 and ask each of you to try and break the site. I want to know if there are any confusing navigation menus, broken links, spelling or grammar mistakes, missing images, unreadable fonts, slow load times, missing metadata or layout mis-alignments. I will test your site page by page with every known web browser and mobile device to ensure that it performs, if not identically, at least in the most pleasing way possible.

MOBILE FIRST PHILOSOPHY

To anyone with eyes in their head or a smartphone in their pocket, it shouldn’t be surprising that all of my clients’ websites are now accessed roughly 50% of the time by mobile-only users nor that this number has been growing steadily for years. Yet web designers have been slow to adapt to the change, and a vast majority of websites are still designed with a desktop monitor in mind and then gradually degraded for smaller screen sizes. Flipping that concept on its head, I begin all of my designs with the most vital elements optimized for smaller screens and I progressively enhance the content as the screen size increases. This means that your site starts out fast, clean and lean and always serves only the minimum data that is able to be displayed by whatever device your customers use. By following my mobile first philosophy, you will benefit by saving resources, reducing load times and from higher search engine rankings.

ENOUGH ALREADY… HOW MUCH DOES IT COST?

If you’ve read this far, you can probably guess that I’m not going to answer that question. It’s not because I’m trying to squeeze maximum cheddar out of you. It’s not even that I don’t want to leave any money on the table. The fact is that if you need a web ‘presence’ that functions as a simple calling card, you don’t need a web designer. There are plenty of services out there that will allow you to build your own site for a set fee per month or even for free. If on the other hand, you want to increase your online sales and/or leads, get higher search engine rankings or track the effectiveness of an online advertising campaign, then the steps outlined above will provide a return on investment worth every penny you put into it. Give me a call to setup a free consultation and I can walk you through an estimate based on these 7 steps and the scope of your project. I’ll be more than happy to negotiate a rate that fits your budget.