Select Page

:

Web Development Process

 

We view them, we use them, & we interact with them every day.  What really goes on behind the scenes in building a website….you’re about to take a deep dive into the entire development process start to finish. 

Let’s Get Started

Trust the process

Can we build a website in a few weeks?  Sure.  Will it be good? Probably not.  A beautiful, interactive, high performing website takes some time.  Skipping steps will only compromise the entire site.  While some steps may seem tedious or redundant, they are just one of the building blocks getting us to the end.

Pre-Production

Time to figure out what all is going on this site. Sitemaps, Wireframes, & User-flows will help get a pretty firm idea what we’re working with.

Pre-Launch

Write your code and check it twice….time to put the site through a fine tooth comb for any and all errors and do any final edits and touch ups.

Post-Launch

Websites are living things that need some tender love and care, even after they are launched.  We need to evaluate and renovate where need be.

Discovery

Let’s get to know the client, their goals, and start to get an initial idea of what kind of tools and resources will be needed.

Development

At this point we’ve gotten a beautiful design and we’re ready to roll. Time to put our head down & start writing some code.

Go Live

All systems are a go!  We snap our fingers and the site is live….or at least we wish.  Just a few more steps to take but the finish line is here.

Web Dev Process

Discovery

Kickoff meetings and client discovery sessions mean something different to all of us.  We each are getting information out of this that may help us better understand what our actual goals are and how we can achieve them. 

N

What We Need

What CMS platform are we going to use? Do we have to integrate with any existing systems? 

N

Size & Structure

How big is this site going to be? Anticipate any custom development that may be required.

Web Dev Process

Website Pre-Production

Now comes the time that is often overlooked or forgotten but if done right, can set the entire project up for success.  Some of these steps can really help flesh out ideas and allow client interaction that leads to less revisions down the road.

N

Sitemapping

Establish parent and child pages in a formal hiarchy chart.  This also allows us to get a final page count so the entire scope can be seen.

N

Wireframing

Getting this rough outline of design and functionality can help us properly plan out which areas will need more time and custom development.

N

UX/UI User Flow

This step ensures we’re driving traffic to the desired areas for optimal conversions and lead generation.

Do we really need to do this?

Time and budget can definitely be a big factor in a project.  Some sites may also have limited customer interaction where user flows may not be needed. So while we stress their importance, there is a world where they can be skipped.

Let the pixel pushers do their thang….

We’ve had meetings, we’ve strategized, we have pages of google docs and wire frames.  Now it’s time to send off the website to the creative department so it can grow and blossom into the beautiful website it will become; like sending your kid off to college and it coming back home with life and character it didn’t have before. 

Web Dev Process

Development

Websites can be broken down into two simple areas; the hosting server where the files reside and the code base for which create the actual site.  Without either we don’t have a website.  Each area does come with multiple options.  There is more than one way to skin a cat.

Development

Hosting

The size of site we have, the type of CMS being used, and the level of customization needed will determine which hosting platform we will use.  We offer:

N

Full-Service WordPress Hosting (WP Engine)

– Global Edge Security (CDN, WAF, DDoS Mitigation)
– Daily AWS Backup
– Smart WP & Plugin Manager; Auto updates
– Dev, Staging, Production environments

N

Full-Service Custom Hosting (Inmotion)

– Sucuri (CDN, WAF, DDoS Mitigation)
– Monthly Server Backups
– Monthly WP & Plugin monitoring/updates

Development

Framework

By this time we’ve decided on a CMS platform and identified all custom development that will be needed.  Each site will follow these steps:

N

Front-end Development

– Asset Gathering
– UIKit (HTML/CSS/JS) Framework
– Responsive styling
– Interactive/Parallax animations
N

CMS Setup

– Install and configuring CMS; WordPress
– Setup plugins and CMS customizations
– Create site theme

N

Integration and Content

– Integrate templates with front-end dev
– Insert all content; copy and imagery
– Setup all 3rd party platforms

Web Dev Process

Pre-Launch Checklist

Final Design Q/A

Ensure site spacing is correct and consistent. Site colors and typography  follow branding guidelines. Imagery is correct and final.

Cross-Browser Checks

View site across the 3 main browsers and check functionality; Chrome, Safari, and Edge.

Cross-Device Checks

Test the website on mobile and tablet devices, as well as both Apple and Android OS.

Site Speed Configurations

Enable CSS & JS minification, convert images to next-gen formats.  Activate LazyLoad for media content.

Lead Sources & Integrations

Check all site forms and notifications. Ensure all CRM connections are functional as well as any API integrations.

Link Testing

Check all links to make sure internal links are properly mapped and external links open in a new tab.

SEO Configuration

Creating and/or adding Google Analytics, Tag Manager, and Search Console accounts. Setup our onsite CMS SEO tools.

SEO Assessment

Ensure proper semantic structure being used. Meta Tags are in place. Open Graph setting are finalized.

Web Dev Process

Go Live

N

Archive Dev

We want to make sure we have an untouched, final version of the dev site for our records.

N

Update Site Reference & Enable Indexing

Till now the site has been hidden to google, we now to remove index blocking so google knows it exists.

N

Update DNS Records

Changing the domain’s A record to the new hosting IP Address.

N

Wait

As Tom Petty said, the waiting is the hardest part.  DNS propagation can take anywhere from 15min to 24hrs.

N

Double Check

By now the site is live, so let’s do one more lick through to ensure nothing was missed.

N

Confirm Google Web Tools

Make sure all tracking is now functioning correctly for the live site.

N

Archive Old Site

Download a version of the prior site and setup an online archive for viewing.

Time to Party!

We’ve made it to launch day.  Time to flip a switch, pop a bottle of champagne and celebrate!  Almost.  We’ve still got stuff to do. While we’d love to sit back and pat ourselves on the back, these final steps make for a smooth launch process.

Okay….now we can celebrate.

Yep, we mean it this time.  Site’s live, client’s happy, and we’ll call this a success.  Our multi-month process is complete.  We saw something come from the clients wants, to creative’s imagination, and built through our development process.  

Web Dev Process

Post-Launch Services

We know, we know…. we said we were done. We lied.  Websites are ever growing entities.  We have to watch them, see how they are used, and make changes where necessary so they are actually delivering our original goal.

N

Heat Mapping

We can use heat mapping tools to track users throughout the site.  This helps us see  our original user-flow is actually working.

N

Track Events and Conversions

Using Google Analytics we can track click and scroll events and user conversion to make sure we’re reaching our goals.

N

Re-Evaluate SEO Tactics

Sometimes we may not be ranking where we want to for certain pages or for certain keywords.  Now’s the time to adjust copy and keyword focus so we can get ranked where we want.