You’ve got an interested client and you’re ready to hit the ground running. Before you start pounding out code, there’s something you need to do first: lay out a plan. Sure you’re eager to start turning out pages, but a website development project management plan is crucial to maximizing success and minimizing the chance of failure.
Methodical may sound boring, but it can be lifesaving (or client-saving).
But exactly where do you start in making this website project plan? If you’re not well-versed in the ins and outs of the web development project management process, you are not alone! But no worries, we’re here to help set you on the right track.
What is project management for web development?
Project management for website development is an organizational process that focuses on managing project timelines, goals, and the resources needed to execute on-schedule. Project management for website development involves keeping track of all of the smaller, more granular tasks and milestones that comprise a much larger project, keeping things rolling along on schedule.
Manage your web development projects with GoDaddy Pro
Managing a web development project may sound daunting. But it doesn’t have to be! One of the perks of being a GoDaddy Pro member is access to The Hub, which (among other features) includes project management capabilities.
From The Hub by GoDaddy Pro, you can access project management tools such as templates, timelines, and customizable checklists to stay organized. The Hub also offers to-do lists that you can set up to stay on top of client projects and their milestones.
9-step website development project management plan checklist
Every web development shop is unique and no two designers follow exactly the same process. However, identifying a standard task list for web development project management that you can step through over and over again has lots of benefits. The following checklist is a solid starting point.
- Outline the project and define objectives.
- Sign the contract and collect a deposit.
- Begin design.
- Start development.
- Beta test.
- Sign off on deliverables.
- Invoice final payment.
- Hand over the keys.
- Follow up.
This web development task list is designed to help you (and those who work with you) stay on track and ensure you don’t miss any important steps. You’ll always know where you are in the process and what lies ahead. Each website you develop will be different, but having a streamlined project plan template will allow you to determine how to manage each web development project with ease; just expand and refine as you see fit.
1. Outline the project and define objectives
Speak to the client to get a general idea of what they want. Turn this into an initial list of objectives that can be discussed/confirmed with the client. This doesn’t have to be a 30-page proposal with professional graphics. A simple list will do at this stage. Here’s a partial example:
Two types of users:
- Visitor (a person not logged in)
- Registered User (a person who is logged in to the system)
Visitor privileges:
- Can view all product pages
- Can complete guest checkout
Registered User Privileges:
- Can store credit card for future use
- Can manage personal profile
This helps you set a price for the project and clarify the scope.
If your client balks at the price, you haven’t wasted a lot of time writing a fancy proposal only to have it rejected.
If the client signs on, you can have further discussions and add greater detail to the outline.
Your final proposal can still be in list format, but be sure it includes all deliverables and details all functionality. It should also specify what will be delivered when. This document is your protection from scope creep.
Related: 14 project estimate mistakes that freelancers make (and how to fix them)
2. Sign the contract and collect a deposit
Don’t start work without money changing hands. Completing all work and invoicing at the end is a recipe for stress and unhappiness.
Instead, collect a deposit up front.
Then set specific milestones for additional payments. If the project is small, the second milestone might be completion. If it’s large, you may have multiple milestones.
Related: How to create a web design contract that converts new clients into long-term customers
3. Begin design
Now that you and the client have agreed on the specs, it’s time to lay out what the website will actually look like.
This is where prototypes come in.
With a small web development project, prototyping is completely unnecessary, but on larger deals, you may need to create one.
A prototype is basically a nonfunctional version that allows the client to see what the finished product will look like before you’ve invested in developing the behind the scenes functionality to actually make it work.
Often you can get away with wireframes. A wireframe is a layout of a web page that shows what will exist where on key pages. This can also help ensure the navigation layout hits on all the user expectations. Wireframes focus on the site’s structure and don’t have to include design elements or fonts.
In either case, prototype or no, show the client your design and tweak as necessary.
4. Start development
At this point in the website development project management plan, this is where you (or your team members) put your fingers to the keyboard and really start cranking. This is the time to:
- Set up your development environment, including SSL if you’re going to use it.
- Determine your URL strategy, including setting up www to non-www redirection or vice versa.
- Install necessary software.
- Obtain graphics and other collateral.
- Create an error-handling strategy.
- Create an accessibility strategy.
- Build out the site and navigation.
- Add social media links.
- Set up and test contact forms.
- Set up analytics.
- Optimize for SEO (if you’re using WordPress, read this article.)
- Optimize page load speed
Even though you may be elbows deep in HTML, CSS and JavaScript, it’s important to pick your head up from time to time and communicate with your client. Otherwise, to them, it’s like you’ve just taken their money and disappeared. Instead, make them feel taken care of even while you’re head down working. A few timely emails will do the trick.
5. Beta test
Next up on the web development task list is ensuring that your work is up to snuff and squashing any pesky bugs.
Things to check include code quality, page content, and user experience. Verify that the site works properly on a variety of devices (you made this responsive and mobile friendly, right?).
You can use tools to help with this proofing, such as:
Verify that you have the necessary SEO tweaks in place, such as unique page titles, appropriate keyword placement, and relevant alt tags.
Don’t leave any lorem ipsum text behind and make sure images are appropriately optimized.
Related: 25 bug tracking tools for websites
6. Sign off on deliverables
Release the site to the client. Make tweaks if necessary. Bask in the glow of your amazed client’s appreciation. Most importantly, obtain agreement that you’ve delivered as promised.
Related: How to perform a website launch and handover
7. Invoice final payment
You’ve met the objectives, the site is up and running, but you still hold the keys — i.e. the hosting information and relevant logins. You don’t need to point this out to the client, but you’ll know that you still control the site until final payment is received.
8. Hand over the keys
Payment in hand, pass the site over to the client.
This might mean simply handing over the relevant credentials, or it could involve transferring the site from your development server to a live server. If the latter, be sure to run those quality checks again — make sure forms are sending to the right place, links are working, etc.
9. Follow up
A successful launch should not be followed by radio silence.
Instead, keep in touch with your client and make sure they know you’re available for future needs.
As the final step in your web dev project management plan, this is the time to send a follow-up survey asking about their satisfaction with the process and the final site. It’s also a great moment to grab a testimonial.
Related: 14 tips for successful web design projects
Website project plan template
In The Hub, you can use the Projects feature to set up individual tasks and create phases for projects -- taking your website development project through planning, design, QA, and launch phases, without missing a beat. Due dates can be assigned to tasks, helping to keep you on-schedule. If you need to change a due date, that’s editable, too!
To set up a project:
- Click on Project in the left-hand navigation pane.
- Add a new project by clicking on the yellow New Project button in the upper right hand corner.
- From here, you can use the appropriate fields to add a Project Name and Estimated Due Date, as well associate a given project with a specific client, using the Add Client button, or Exiting Client.
- Start adding tasks to your project by clicking the “New Task” button, giving it a title, description, status (to-do and done), as well as assigning it to a specific phase of a project.
- You can reorder tasks simply by clicking on a task and reorganizing the task blocks to suit your preferred order.
- If you don’t like to drag-and-drop, no worries! You can use the ellipsis button to reorder tasks, moving them to the top or bottom of your to-do list.
- To see a list of all completed tasks, click on the “Done” tab of your To-Do list. (This is especially helpful if you’ve accidentally marked something as completed and need to resurrect it on your To-Do list.)
- You can also set up Phases within the Project section of The Hub to create major milestones for each project. Simply click on the New Phase option in the upper right corner of the page.
- Name your phase, the duration of the phase (how long that phase will take), as well as where it falls in the order of your overall project plan.
- Phases can also be edited in the same way, by clicking on either the ellipsis button or the project due date calendar.
- From there, you can add individual tasks for each phase.
The Hub provides you with everything you need to manage projects for each of your websites, including project plan templates, timelines, and to-do lists.
See for yourself how easy it is to use The Hub to create a project plan and manage website development projects. Check out this short video for a website project plan example and how to use The Hub’s Project feature to build more efficient workflows and stay on top of tasks.
Start planning your website development project
A key decision when choosing project management software is whether you want a particular tool, such as one focused on task management or specifically on web development, or an entire toolbox that handles a greater range of project management functions.
The former will be quicker to learn; the latter offers greater power to those who need it.
Whichever you choose, remember you can always save time with free tools and resources for web designers and developers by joining GoDaddy Pro for free!
