Using a Pre-Launch Checklist for your Website

Accounting for every aspect of a new website isn’t easy, especially at the last minute.

The problems aren’t the details themselves, but rather the process of making sure that seemingly minor details don’t add up to sloppy work.

The best solution is to write it all down.

The worst solution is to not take a pre-launch checklist as seriously as the planning stage itself.

With the hundreds of details that go into building or redesigning a website, overlooking minor points is easy, especially as deadlines loom—or pass. But missing details detract from the quality of a website.

Call it quality control or covering your butt, but every project has certain tasks that need to be accomplished before it is launched. Deciding what’s “good enough” is not something you should think about at the last minute.

A pre-launch checklist entails a systematic approach to ensuring that important details are addressed before launching or relaunching a website.

Most of the items on the list list will be common to all websites, including registering a domain name and removing dummy content. Following the same list creates a routine that can hopefully be improved with each project.

By adhering to a set list, both the designer and client are assured that nothing vital was assumed to be done but really forgotten.

If nothing else, pre-launch lists are detailed versions of the question, “I think we’re almost done. What else do we need to do?”

Accountability, Not Checkmarks

Here’s a scenario. A designer is ready to launch a website. The client is waiting for it to go live. The deadline is in 30 minutes. Hiding behind the “domain hasn’t propagated” excuse won’t last forever, so the designer hurries down his checklist. He seems to recall having done these things last week… until the client discovers otherwise.

Accountability is neither finger-pointing nor a mindless checking off of items, but rather is a conscious assertion. Taking the time to check and double-check that a task has been done can be as important as doing the task in the first place.

An industrial-strength pre-launch list does more than just remind you of critical details. It holds people responsible. It doesn’t just say that a task has been done; it tells you who completed it and on what date.

That’s why, for serious pre-launch lists, simple checkmarks are too easy. Each item should have four fields:

The task;

The initials of the person completed it;

The date it was completed;

Comments.

The task describes what needs to get done, like “Run spell-check,” “Randomize the admin password” or “Register the URL with Google.” The initials and date enforce accountability.

But not every task is either complete or incomplete. Creating an informative 404 error page is one thing; adding helpful links to it is another. The “comments” field provides space for a person to say that an item is done but could be improved.

Put your initials next to a task that is adequate for launch, even if it could be improved later.

An Item’s Value Is Proportional to How Much the Item Is Used

There comes a point when deadlines, budgets or other factors force a team to declare a website “good enough.”

But if the website’s quality can be measured, it might be the sum of the attention to detail and the extent to which tasks were followed through.

The value of any single item on a pre-launch checklist varies. The closer the deadline, the more trivial it seems, especially because no single item is critical to the success or failure of the project.

Details are like dollars: if a favicon is worth a dime, then who cares about dropping it if you’re clutching $20 in your fist?

Close to a deadline, uncompleted tasks jostle for attention. The diagram above illustrates how a task’s true importance becomes evident: time squeezes out less important items.

For example, validated HTML may seem important at first, but how does it compare to fixing last-minute database errors? Once a task has been deemed “less important” at the deadline, it tends to stay that way.

The danger of not having quality control is in dismissing any detail as unimportant. True, one detail among many isn’t a worry. But that’s not the point. The point is the process of checking details, not nit-picking about which are important.

Figuring out what’s “good enough” is not about determining the exact number of things you can do without but rather about understanding how much you have sacrificed to launch the website. How much are you willing to sacrifice? Which details are not important? What’s good enough?

Just as safety inspections don’t build houses, pre-launch checklists don’t complete websites. The more stringently they are implemented, the better the result.

The items listed below were selected for their importance and ease of completion. How well they’re carried out, if at all, will reflect how seriously the project is being taken.

Build Your Own Checklist

We’ve provided a sample below, but the best pre-launch checklist is one that you’ve customized yourself.

First, write a list of everything that you commonly do to prepare a website, especially things that you do at the last minute or that you remember to do after the launch. If you work with other people, give them access to this list.

Set aside uninterrupted time to review the list. If you’re on a team, include everyone.

Compile all of your lists. Each list should cover a different phase of your project, from conception to polishing. For example, hosting should probably be purchased more than a week before launch, but the favicon can wait.

Finally, use the lists. Treat them as sacred documents. Even if not every detail is finished on time, the process of using a pre-launch list will improve the overall quality of your work.

The timeline above is a generalization. It covers the basics, but not every team will follow this process.

Thus, you would have five different lists for a single project:

Set-up, which includes buying the domain and hosting space;

Pre-launch events, such as removing test data and ensuring that stock photos have been purchased;

Post-launch tasks, like adding analytics and sending press releases;

First and second reviews, when the team makes back-ups, changes passwords and assesses whether the website still meets its goals.

A Practical Example

The pre-launch checklists below ensure accuracy and accountability by requiring names and dates, not just checkmarks.

Dates also indicate which elements need to be rechecked if changes have been made. This should instill confidence that nothing has been missed.

The items in each list can be completed in any order, but the lists themselves are organized chronologically: before, immediately after and long after launch. Not every item may be appropriate.

For example, a website may not need a database or analytics. The designer is responsible for deciding which items are relevant to the project.

Beginning the Project

Notes

Task

Completed by

Date

Comments

Don’t put off obvious tasks, such as setting up the domain name and hosting package, until the last minute.

Buy the domain name(s).

_____

_____

_____

Set up hosting.

_____

_____

_____

Redirect sitename.com to www.sitename.com (or vice versa) for SEO

_____

_____

_____

Create the required email address(es).

_____

_____

_____

Set up the database.

_____

_____

_____

Set up a test environment.

_____

_____

_____

More Than One Week Before Launch

Site-wide

Notes

Task

Completed by

Date

Comments

Check the home page, contact page, and any pages with different templates. Update browsers and versions as necessary. Checking each browser on every platform is a separate task because not every browser may be representative of the target audience. Look for rendering errors in different browser layout engines.

Gecko browser: Firefox 3.x for Mac

_____

_____

_____

Gecko browser: Firefox 3.x for Windows

_____

_____

_____

Internet Explorer 7

_____

_____

_____

Internet Explorer 8

_____

_____

_____

Webkit: Chrome for Mac

_____

_____

_____

Webkit: Chrome for Windows

_____

_____

_____

Webkit: Safari for Mac

_____

_____

_____

Webkit: iPhone

_____

_____

_____

Presto: Opera for Windows

_____

_____

_____

A website’s appearance is affected by the size of the monitor it is being viewed on. Even if a website’s layout has a fixed width, say 960 pixels, it can look very different at different resolutions. Test the website at these various resolutions.

800×600

_____

_____

_____

1024×788

_____

_____

_____

1280×1024

_____

_____

_____

1920×1200

_____

_____

_____

320×480 (for mobile devices)

_____

_____

_____

Hiding photos, graphics, backgrounds and styling shows how search engines and screen readers see your website. To see how useable the website is (or isn’t), rename the images directory and CSS file.

Specific Pages

Notes

Task

Completed by

Date

Comments

A helpful 404 page tells people that they have entered an invalid URL and offers alternative links. It may include a search tool to help them find what they’re looking for, and it might automatically notify the website owner that someone has encountered a problem. If necessary, use Google’s custom 404 search widget.

Create a helpful 404 page.

_____

_____

_____

Make sure that the contact form works and that the domain hasn’t been blacklisted.

Send a test message through the contact page’s form.

_____

_____

_____

The website’s purpose may be obvious to the people who were involved in creating the website. Don’t assume that it’s obvious to newcomers.

Ensure that the home page clearly states (whether in the content, mission statement or tagline) the website’s goals and what visitors can expect to gain.

_____

_____

_____

48 Hours Before Launch

Site-wide

Notes

Task

Completed by

Date

Comments

Email is great when it works and lousy when it doesn’t. Ensure that messages get delivered.

Send a test message to the email address(es) associated with the domain.

_____

_____

_____

Reply to the test message. Ensure that it is received.

_____

_____

_____

If you don’t want search engines to index certain directories, such as the CMS, cgi-bin or members-only sections, then add them to the robots.txt file. Visit Web Robots or read about how Google respects robots.txt.

Make a robots.txt file.

_____

_____

_____

For Each Page

Notes

Task

Completed by

Date

Comments

Make sure your website contains no dead or invalid links using the W3C link checker.

Great post Ben, this should come in handy when getting ready to launch my new project! :)

http://twitter.com/Dreyer Dreyer

Great checklist. A helpful starting point for putting together your own tailored pre-flight checklist.

http://www.appsheriff.com AppSheriff

I am definitly doing the 6 Month Checklist. :)

http://www.pianetaricette.it/ Giovanni

Very interesting article… I had to rework my website heavily after lunch, this article would have saved me a lot of time!

http://mathiasb.no/ Bog

Will there be a downloadeble version or a pirnt version?

http://benthinkin.net Ben Gremillion

I have several web-based preflight and post-launch lists for use on client projects. They’ve actually changed slightly since this article was written — the perils of constant refinement in an ever-changing medium.

To date they’ve been strictly in house, though. I might open it up if there’s enough interest (and I can add security). Would anyone else be interested in signing up?

http://brandingdavid.com David

I’d love a copy. Having a printed version to keep posted next to my desk would be super helpful.

Scoorix

I’m also working on a rather big project at the moment, with release planned around september, and I would definately sign up! :)

Omniszron

WANT!

http://dreamosity.com Marcelle

Hey,
I’d be interested in seeing your up to date checklist.

Really appreciate what you’ve alraedy mapped out.

Marcelle

http://www.webgraphicdesigner.me Jennifer

Excellent checklist! Will keep handy for future projects. Thanks!

Mandy

Thanks! This is really helpful!

http://www.creativeindividual.co.uk Laura

Thanks for putting this together. I know this will come in VERY handy. Even just to explain to clients how you work and what are the various time-goals involved, both for you and them (like getting the information/images to you on-time, so that it doesn’t delay other parts of the site development, and therefore the final launch date). This should really help with quality control, especially coming up to the end of a project when things can get a bit rushed. Thanks Ben.

http://www.jordanwalker.net/index.php Jordan Walker

Excellent list, very helpful to launch and plan a website from a high level.

http://ntechnologies.co.cc/blog Nikunj Tamboli

really helpful checklist every web developer should follow this

http://www.skix.pl SkiX

Ooo great! It’s very usefull, especially for beginners!

http://www.visualswirl.com/ Chris Thurman

I love the idea of accountability to prevent things from getting lost in the shuffle. I’ll have to try and implement these ideas with my team. Thanks for the suggestions!

http://www.helfenberg.ch Vulkan Pfadi Helfenberg

Print the website. Check letter and A4 format.

Brian Jones

Excellent post – & thank you for sharing. This will be very helpful as I am preparing to launch my very 1st project.

http://tympanus.net/codrops/ Mary Lou

Wow, this is a great checklist! This just saved me hours of organizing! Thanks!

http://www.doublejdesign.co.uk/ Jack

This is pretty useful. Thanks very much!

http://gameloo.info gofree

Very useful indeed. Anyway, I’d love to request the .pdf files of checklists.

Great resource. As a designer sometimes I am so big picture focused I forget to check on the small details. This will definitely help out any designer.

http://www.carvillcreative.co.uk Michelle Carvill

Hi Ben
Great timing – I was just in the process of putting a checklist together. Marrying the technical aspects with the marketing ones. (Ensuring clear call to actions etc). So this post came in perfectly and has probably saved me the best part of a day. Thanks for sharing.

http://www.soula.com/blog Katie

Great list that should be on every designers desk. I think another important fact to remember is if the site is a redesign and links have changed then broken links should be checked regularly after launch, it is surprising how many 404s can be generated from a redesign site launch

http://wwwnopun.com Noel Wiggins

in many cases I find myself agreeing to design a website for far less than it should be, or the client asked for so many corrections that the scope creep grew 3 fold. And All I want is to be done with the project. SO I can understand how websites get pushed out the door without it being as slick as it could be.

The big realization is that each project you finish could lead to more projects. this last website you completed could be the sample that convinces that new prospect to give you a call.

SO I have learned to not think about the money lost on a project and focus on quality, its kinda an investment for the future…

—

Thanks and Regards

Noel

http://www.rezyde.com rezyde

Great Post, this will make my life easier with launching a site i am working on.

http://www.sekijitsu.com Bass

A great checklist, I gotta go through a ton of these myself before I can fully finish my site.

321webdesigner

It was really wonderful and will very well done.
I will must follow this checklist for all of my future projects.

Keep it up good work:)

http://www.rossmcnaughton.com Rosti The Snowman

great advice cheers!

http://bernardoruiz.com.mx Bernardo

Wow! This is a incredibly useful article I will use in my next web projects.

Thank you so much WDD!!

http://bass.MAKEMYWISH.INFO New York Web Designer

This is great list. Your tips are very helpful.

http://www.aviontechnology.net Chet

Great post guys. I have come to realize that launching a website is always like shooting at a moving target. Looking at this list, I realize that it need not necessarily be a traumatic experience. I am sure we have all had sleepless nights, tons of coffee, shouting on the phone, graying a few hair, right around the time of a site launch. Hopefully, this checklist will help me maintain the peace with the client around the launch sequence.

Alain

Printing it right now. Very helpful! I’ll use it as a reference, so I don’t forget anything before a launch. Thank you Ben!

http://www.dynamicwp.net/ Eko Setiawan – camp26

This paper provides a guide for us, so we can prepare and plan better, when he will make a new site.
Thanks, for share this guide

http://blog.ramenos.net Ramenos

Great post, thanks ! Pre-Launch are useful, especially if you give a good sample of Using ! :)

Great article about the web designing. Thanks for the information you provide me by that article. It will really help me in the web designing.

http://341design.com.au Chris Howard

Awesome post! Will use those checklists coz I’m lazy. :)

Rather than renaming your CSS and images directories to test, just use the FireFox web developer plugin and disable styles and check, and then likewise with images.

http://askewmedia.net Nissa Askew

Glad I found this. This will be very useful.

-Angelique – thanks for formatting this and adding the extra info!

http://www.efxdragon.net Nirmal

Thanks for the post :)
It will help me a lot to ensure the quality of my website deliverables :)

http://www.alejandroperazzo.com Alvaro Hernandorena

ok i didn’t know that it could be done a coustom 404 page and also didn’t know lot of things in this article i will save it to give it a decen read ahead
tnx

http://www.clippingimages.com Clipping Path

fantastic checklist… i’m going to do a checklist for next 2 months.. thanks :-)

http://www.ronalsanchez.com Ronal

Just what I needed to be more thorough

http://www.StopBloggingAndCook.com Joy

My blog was born yesterday & I am overwhelmed. This article is a godsend. I’m following!

http://www.myweddingveil.co.uk jeba

Great list. I will use this to my next website.

http://artisani.be ARTisani

Great checklist,

Thanks

Martin

Great advice.

I always work through a pre-launch checklist, along with comprehensive to-do lists during each project. Without them, I’d often revert to my default state of completely disorganised!

http://www.katefosson.com Kate Fosson

Very detailed! Thanks for sharing!

http://connorcrosby.me Connor Crosby

Very nice checklist. This will be helpful! Thank you so much.

http://www.fairfieldcountycentral.com Todd S. Jones

Very well thought out, thank you!

http://mobileshared.com eko mobile shared

complete step by step planning before lauch any programs.

its great post ben :)

thankz for sharing

http://freesitemanger.webs.com/home.htm lucy

thank you so much!as a website designer,iv’e been looking for ages for something and plenty of checklists till i found this.i learned more here in 10- minutes then i could have learned elsewhere in two days.thanks so much!

http://inspirationfeed.com inspirationfeed

Bookmark worthy!

http://www.mc2design.com/ Jarrett Barnett

Awesome list.

May or may not be a good idea to add these to a more development specific list (depending on how much coding related tasks you want to add to your testing):

Obviously you can get creative with performance improving todos such as minimizing js files and creating far-future headers.

http://expertchecklists.com Bob Rent

Great Post! To support creating a checklist there is a new site where you can actually work on checklists together with colleagues and discuss changes. You can also create your own copy and modify it for your site. http://expertchecklists.com/checklists/78