How is a Website Made? The 4 D's of the Web Design Process by Akamai Websites

How is a Website Made? The 4 D’s of the Web Design Process

We previously shared some myth-busting truths to the website design process, so today we’re going to get into some of the nuts and bolts of what happens when a website is built.  (If you haven’t read the other post, then be sure to check it out.  It will help put all of this in perspective.)  If you’ve ever wondered “how is a website made?” then this is the article for you.

Don’t worry, we won’t get too technical in this post.  This is just to provide you with the basic understanding you need to make informed decisions for your website.

It’s worth noting that every web designer has their own method for building a website.  Some of the details differ from person to person and agency to agency, so you may see some slight variation from what you’re reading here.

Having said that, these are the main four steps that most web design projects go through.  So, let’s get started with …

The Four D’s of the web design process

Each of these four stages of the web design process have a different goal, and at the end of each stage there is usually a “point of no return” where you can’t really go back and change things.  (More on “scope creep” in a moment.)  Here is a quick outline of each stage and their respective goals:

  1. Discovery: The goal is to understand the target market, calls to action and goals for the website.
  2. Design: The goal is to design a visual interface and design aesthetic that matches the goals from the Discovery phase.
  3. Development: The goal is to build a website that matches the necessary functionality to meet the Discovery goals.
  4. Deployment: The goal is to launch a website that maintains the design and technology requirements, while setting it up for long term success.

As you can see, the initial parts of the process are very important because they dictate how the website will be developed through the subsequent steps.  If you don’t have the discovery process dialed in, then the design, development and deployment of the website becomes moot.

So, let’s get started with phase one and see what happens during …

1. The Discovery Phase

In a nutshell: Understanding the purpose of the website and the needs/wants of the target audience

How is a Website Made - The Discovery Phase - Akamai Websites
It’s time to get out of your comfort zone and discover the truth of your audience and your business

Whenever we work with a new client we have a “discovery meeting”.   This is a meeting where we discuss the details on three specific parts of their website:

  1. The target audience
  2. The target action
  3. The target result

If you’ve already read our report on the 5 Steps to Your Best Website then you already know about the importance of targeting a specific persona to identify your audience.

If you haven’t, it boils down to this: get as specific as you can about the person you are targeting with your website. You need to understand your target audience.

The more detailed and narrow your audience definition, the more you will resonate with a greater range of people.  I know it seems counter-intuitive, but trust me, this is one of the truths of marketing.

The target action is identifying the main task you want a person to do on your website.  Whether that is “buy product A” or “give us a call” or “join our mailing list” or “read our blog”, you need to decide on the most important action and be sure that is the focus of your initial presentation on the website.

Here’s the thing: the more options you give a website visitor the more likely they are to take no action at all.  But if you give them one specific action (or maybe two) then you have a higher chance that they will take it.  Again, a strange, counter-intuitive truth of marketing and psychology.

The target result is the end goal you have for the visitor to your website.  Perhaps that is “join our organization” or “sign up for a class” or “visit our store” or “comment on our blog”.  Whatever the final goal you have should be related to providing value and assistance to your audience member.

If you make the end goal all about you, then you won’t have good results.  But if you make the end goal about providing as much help, service and value to your visitor as you can, then it will be easier to meet your goals.

Other things also happen in a discovery meeting, but these three are probably the biggest ones.  Perhaps in the future we will write a blog post about the discovery meeting process, but unfortunately we don’t have time for that today.

Once we have a deep understanding of the purpose and goals of the website it is time to start the next process.  Because if you have the goals worked out, it is time to figure out the best way to have them fulfilled.  And often this depends on how your website is structured and looks.  In other words …

2. The Design Phase

In a nutshell: Building the structure of the site (sitemap), the layout of the site (prototypes) and the look of the site (mockups)

How is a Website Made - The Design Phase - Akamai Websites
Let’s get down and dirty with the layout and aesthetics of your website

In the design phase there are three things that we typically do for our clients:

1. Sitemap

First, we work out the structure of the site using a sitemap.  A sitemap provides a general overview of the layout of pages and information on the website and makes sure that all areas are represented.  It also helps understand how a visitor might navigate their way through the website content.

Sometimes the sitemaps are simple and sometimes they look like the family tree of European royalty, but the main purpose here is to make sure the website’s structure is sound, and helps your audience.

Website Sitemap - Akamai Websites
A sitemap for a recent client’s website

2. Interactive Prototype

Once the client approves the site map we go into the prototype phase.  Some people produce wireframe mockups, which are rough images showing the layouts on each page.  At Akamai Websites we like to go one step further and actually build out an interactive website with placeholder content to show you exactly how the website will function.

This phase isn’t about having a website look good, but about making sure the pages and content are laid out in the right way.  This process usually takes some time to get right, but it makes all the later parts of the process much, much easier.

3. Visual Design Mockups

Finally, after we have approval on the interactive prototypes, then we move on to the fun part: visual design mockups.  This is where we take the page layouts and make them look super pretty.

Personally this is one of our favorite parts of the process because it is our chance to really wow the client.  We love the reactions we get when clients see what their website is going to look like.  This typically takes anywhere from 3 to 5 rounds of design, and also relies on another part of the discovery meeting: identifying the right look and feel.  Be sure that you work with your designer so they understand the visual aesthetic that you are going for.

prototype and mockups - Akamai Websites
The Interactive Prototype and High Fidelity Mockups for the same website’s home page

Okay, so now we have a finished visual look to the website, a prototype for the website, and are all ready to merge the two together, we move on to …

3. The Development Phase

In a nutshell: Building the functionality of the site through a CMS (content management system), and enhancing that functionality (commenting system, forums, blogs, etc.)

How is a Website Made - The Development Phase - Akamai Websites
Its time to become a hermit and lock ourselves in a room with a computer

This is often the phase of the website where we lock ourselves in a dark room and get to work on adjusting the code of the website to match the look we want it to have.

If we did our job well during the design phase then this can actually go pretty quickly. But if we didn’t, then we’re going to run into one of the nightmare scenarios of a designer’s existence:

Scope Creep

If you’ve ever created something for someone else, and just as you were about to finish heard, “actually, could you go back 3 steps and change this?” then you understand the stress of scope creep.  It is when the scope of the original project starts to creep into a longer time frame due to additional requests for changes and modifications.

This is one of the reasons we require written approval on each phase of the project, and the understanding by the client that once they give approval we can’t go back to re-do things.

Why?

Because much of what we do after each approval step is built on what comes before, so if we have to go back and change something, then everything else starts back at that same point.  It is like making it almost to the end of a movie and then being forced to go back and watch it again from the beginning.  It can be rather frustrating for both the designer and the client.

Mandatory Meetings

This is also the reason communication is so important and why we schedule mandatory weekly meetings with our clients to review the progress on the website and make sure they understand their role.  Even if the meeting is only 15 minutes, it is important to make sure everyone is on the same page.

If you are working with a web designer make sure they are available to meet on a consistent basis so you are kept in the loop.  Once a week is minimum, but for more extensive projects two or three meetings in a week is not uncommon.

Content Development

One of the other things that happens during the development stage is content development by the client.  After the design phase we provide our clients with a checklist of the content they will need to produce for the website, such as articles, images or videos.

Why do we wait until after the design phase?  Because until we know how the website will be laid out and structured it is impossible to know exactly what content will be required at launch.  A lot also depends on the future content development schedule the client is willing to take on.  (We’ll tackle how to develop content for your website in a future article.)

If all goes well, by the end of this phase the client has all the content ready to put on the site, and we’ve built the site out to about 90-95% of its finished state.

That brings us to the last “D”, which is where the website is prepared and launched for the world to see.  Specifically …

4. The Deployment Phase

In a nutshell: Integrating the content (copy, media, images), preparing the backend (security, backups, etc.) and launching the site for the public.

How is a Website Made - The Deployment Phase - Akamai Websites
Let the world see your beautiful new website!

Deployment is an exciting (and occasionally stressful) process.  It is broken up into three main steps:

1. Content Integration

When the site is ready and the client has completed the content, then we being the process of integrating that content with the website.  A lot of this has to do with copying and pasting, but also preparing images and media for inclusion on the website, as well as making sure the SEO (Search Engine Optimization) of the content is maximized so it can be easily found on Google.

This is also where you find out if the content you developed meets the needs of the website.  The main problem we see with content is that it is written without a goal in mind.  Specifically, a call to action that the client wants the website visitor to take after they read the article.  Again, we’ll get into more about content in the future article.  (Be sure to sign up for updates to be notified when that comes out.)

2. Launch Checklist

Once the content is on the website, we have a launch checklist that we go through.  This is a list of 40 to 50 items that help prepare the website for launch.  For example, setting up offsite backups, preparing site security scans, cleaning up the back end administration and others technical tasks are a part of this process.

Every web designer has a different checklist based on their personal preferences, but the big picture is typically the same.  It’s about making sure the website is secure, stable and ready to be used by both the client and their audience.

In a future post we will share more details on our specific checklist, but truth be told it is a constantly evolving list of tasks.  Based on changes in technology, better practices and other variables that change from time to time, our checklist often changes from project to project.  We actually get rather excited when we have to change the checklist because it means we learned something new or have a new tool in our tool box.

3. Post Launch Tasks

As I’ve alluded to in the past, the website launch is just the beginning.  You can think of it like the “birth” of your website.  Now we have to take care of it, and one of the ways we help with that process is to train all of our clients on how to use their website.  We install an entire website video training system on the back end of the website, and also work with our clients to make sure they understand what is involved in updating the content on their website.

We also provide a month of free support to make sure they are clear on how the website works, and we encourage clients to sign up for our website care plan, which will ensure that their website will stay secure, backed up and stable as the months go forward.  Even if a client doesn’t use us, we still recommend that they have a dedicated person or team to help maintain their website.  Otherwise it is the equivalent of having a child and then ignoring them.

But hopefully you have a wonderful experience with your web designer, decide to work with them to maintain your website (or find someone great to help you out) and your newly designed site is with you for at least a few years, generating leads, building an audience, and educating your customers.

So, how is a website made?

We covered quite a bit of information in this post.  In fact, we gave you our entire process for building a client website, from the ground, up.

With this information you should be able to better understand how you can work with a web designer, what you should expect from them, and what they will expect from you.  Proper expectations are the building blocks of a productive relationship and it is our hope that, no matter who you work with, you are able to create a great website and have an enjoyable experience doing so.

Of course, if you ever want to chat with us about your website needs, then feel free to reach out to us.  We love talking shop and can discuss what you would like to do, and how our process can help you reach your goals.  You can head over to our contact page to get that started right away.

Like what you see?

Subscribe to get the best of Akamai Websites straight to your inbox.

Plus, receive our free report 6 Steps to Your Best Website to get you started off on the right foot.

Powered by ConvertKit

Leave a Comment