Pitching a Web Build: How to Write a Website Requirements Document and Statement of Work

By Jonathan Tuplin

10 min read

Planning to redesign your website? Or perhaps you need a new one? You’ll need a statement of work and a requirements document, outlining everything you need from your web development team to communicate your vision and steer a course for success.

Here, we guide you through the process of pitching a new web project, with advice on how to write both an initial statement of work and a detail-rich website requirements document. We’ve also included a couple of free templates for you to download, which should make creating each document simple.

Contents:

What is an Initial Statement of Work?

An initial statement of work gives a high-level overview of a web project. It should outline goals and objectives, budget, deadlines and timescales, and other relevant information, such as audience, target market and risks. It should also include the personnel responsible for working on and overseeing the project.

A good statement of work should do the following:

  • Make clear the objectives of the web project
  • Provide an accurate cost estimate
  • Highlight the projected timescale of the project and completion date
  • Outline any foreseeable issues (risk assessment)
  • Identify the key audience and understand why they are visiting your site 

Things to Include in a Statement of Work

Project Overview and Team Information

The first section of the document is an opportunity to outline a basic overview of the project and list the key stakeholders involved. In your overview, focus on the following areas to give the developers and designers a useful introduction to your business and what you hope to achieve from the new site:

  • An introduction to your company – include a brief history and background, a rundown of your product/service offering, notable achievements, and a breakdown of your employees and departments.
  • Explain the problem – and more importantly, how a new web build will help solve it. Perhaps you want to attract more customers? Or make your site more engaging? Whatever the issue, include it here and explain how the project can help.
  • A high-level outline of the project requirements – what do you need from your chosen web development team? A completely new site or a couple of pages redesigned? Set out what’s required from a high-level perspective, giving the developers a clear vision of what you need from the project.
  • A high-level outline of your target audience – while the target audience deserves its own full section in the document, a brief outline will set the tone and help the developers get to grips with your objectives.

Following on from the project overview, it’s a good idea to list the stakeholders involved along with their contact details. Include their name, job title and contact information, as well as any other notes that can help the developers know who to approach with a specific issue.

Here’s an example:

  • Louis Blake (Project Manager) – Web Content Director – lb@business.org

Goals and Objectives

The next step is to outline your goals and objectives; what do you want from your website? And what specifically do you want the outcomes of the project to be? This is the most important section of your website requirements document, as it communicates to the developers what you want to achieve. It can also help influence the elements and solutions they integrate into the final build, as they will have a clear understanding of your needs.

Think about the achievements you’d like to attain from a web redesign or build. Your goals for the project should be measurable, specific and realistic, and based on quantifiable data from your existing site performance.

Here are a couple of examples of reasonable goals to outline in a website requirements document:

  • Achieve X% more monthly visitors
  • Increase sales of a particular product by X% amount over the next two years
  • Boost phone enquiries by X% on a specific service landing page
  • Gain 1K new followers on Instagram by X date
  • Improve the user experience to increase leads by X%

It’s crucial that any goals you set in the website requirements document are realistic and measurable. Remember that a web build often brings long-term gains rather than quick wins.

Audience and Target Market

Customer retention and marketing concept. Vector of a businessman making an announcement in megaphone to a targeted audience attracting new shoppers

You understand who your customers, audience and target market are, but external web developers don’t. To ensure objectives are met, outlining who your website is targeting is an essential step in creating an effective website requirements document.

Highlighting your target market is a useful way to get developers on board with what you’re trying to achieve through your website build or redesign. Whether you’re targeting prospective customers or clients with a brand-new site or are building a standalone portal for recruiting new staff; developers will want to know the intended audience to ensure they meet your requirements and hit the brief.

As well as outlining your target audience, you should also add information about what the website should do for them. Perhaps you want to improve the user journey to encourage sales? Or maybe you want to increase engagement through your blog and newsfeed? Whatever your goals and objectives, they should align with your targeted audience and what they want from your site.

When building your website requirements document, it may be necessary to include collateral which gives developers more of a steer on the type of audience you want to target. Include relevant data and statistics to validate your audience, and create detailed customer personas to make sure the developers have as much insight into your customer base as you do.

Phases and Milestones

To ensure that large web build projects are realistic and deliverable, it’s often necessary to break them into distinct phases, with specific milestones and deadlines assigned for each. Splitting a web build into phases will help ensure the project stays workable for everyone involved, while giving you opportunities to review, test and refine key stages before moving onto the next phase.

Here is an example of a web build project, split into four key phases:

  • Phase 1 – Basic web build: This forms the foundation of the site build, and focuses on refining the design, structure and key site elements.
  • Phase 2 – Incorporating advanced elements: The next phase focuses on incorporating specific elements, such as e-commerce functionality.
  • Phase 3 – UX and CRM rollout: This phase focuses on refining the onsite user journey and experience, tweaking individual elements to improve processes and maximise the ROI of your marketing activity.

Not all web builds and redesigns require individual phases, but it’s certainly something to consider if you’re planning a big project.

Budget

Outline your budget for the project in this section, with any constraints listed if appropriate. It’s important to be clear on budget from the outset, as the amount you’re investing will hold sway over the scope of the project.

If you’re concerned that the project will cost too much, it’s still worth putting your requirements to developers. Often, they may be able to find a more affordable solution that marries with your requirements which you hadn’t considered.

Occasionally, compromises will have to be made to keep the project within your designated budget. Be realistic about your expectations and open-minded to alternative solutions suggested by your developer, as they may be able to come up with a near-as-makes-no-difference approach which helps you save on ongoing project costs.

Exclusions

Include a section outlining any exclusions which the build team should be aware of. This may include things like:

  • Content development (copywriting, copy editing, video creation etc.)
  • Hosting fees
  • Integration with other parts of the site, beyond that which is outlined in the requirements document
  • Purchase of stock imagery, visuals, illustrations and photography
  • Content entry beyond that which is outlined in the requirements document
  • Changes to the functionality of the site, or wireframe amends, after the project has received signed off from senior stakeholders

Note – it can be useful to caveat any exclusions listed in this section, explaining why they’re not included as part of the project. This is also an opportunity to up-sell additional work which may be required after all phases of the web build are complete.

Deadlines and Timescales

This is where you set your preferred deadlines and timescales for the project. You should be realistic here, as web projects can be complicated, with the average job taking anywhere between six weeks to six months to complete depending on the scope of the work involved.

Set your preferred deadline in your website requirements document, but be prepared to negotiate on it after speaking with your developers. Often, they will be able to provide a more accurate completion date depending on the phases involved in the project, and may decide to launch certain aspects of your site periodically to keep the project moving forward.

What is a Website Requirements Document?

A website requirements document outlines the characteristics, functions and capabilities of your website and the steps required to complete the build. It should include technical specifications, wireframes, functionality preferences and notes on individual design elements.

A good website requirements document should do the following:

  • Set out the functional requirements of your website, including the sitemap, design and user experience.
  • Maintenance and support requirements when the site is set live.

It should also be:

  • Specific and focused; your intentions for the new site should be clear.
  • Considered and complete, with nothing missed or overlooked.
  • Prioritised by key objectives, with distinct deadlines and milestones outlined.

This guide will help you create a website requirements document that meets the criteria outlined above.

Things to Include in a Website Requirements Document

Content and Site Structure

This is where you pin down the ‘information architecture’ (IA) of your website – from its structure to the type of content you plan to use across the site map. A provisional site structure can help give developers a clear vision of what you hope to see from your site, but it may change later as budget constraints or technical requirements come into play.

Site Map

Begin by creating a site map for your website. This takes the form of a ‘tree’ chart displaying the hierarchical structure of your website’s pages. We’ve included an example of what a typical site map might look like below:

The trick to creating an effective site map is to consider your audience and analyse quantitative data which demonstrates the limitations and shortfalls of your current site. From there, you can look to improve the user journey and experience offered by your website’s navigation and structure; insights which should influence your new site map.

Taxonomy Creation

Outlining a taxonomic structure for your website is an excellent way to provide a better experience for the user, whilst also ensuring optimum performance in search results. Creating a classification system for your pages will make your site easier to navigate, and therefore more attractive to users and search engines.

When creating a site-wide taxonomy, consider the following:

  • What does the user want from your website?
  • What is the purpose of the content? What are you hoping to achieve (sales, engagement etc.)?
  • What are users looking for when they visit your site? This will inform how pages are classified; for instance, product or service pages would typically be classified ahead of informational pages on an e-commerce website.

Here’s an example of what we mean by a website taxonomy:

Say you’re building a new website for a record shop. One taxonomy could be ‘genres’, with ‘rock’, ‘folk’, ‘soul’, etc. leading away from the main ‘genres’ page. This may not be a site-wide taxonomy, but may refer only to a specific type of content on your site (informational content, for example).

Building taxonomies for your site can help steer the overall structure, ensuring that the foundations of an easily-navigable site are in place from the earliest stages of the build.

Page Template Wireframes and Mock-ups

Do you have a clear vision of how you’d like specific pages on your website to look? Don’t be afraid to include them in your website requirements document. Normally, developers will create templates for each type of content page on your site, be it the homepage, product/service page, blog page or contact page, so focusing on creating mock-ups of these templates can be a great steer towards building a site you’re happy with.

Design Elements

How much information you include in this section of your website requirements document depends on two factors: whether you already have a design for your site (including specific style elements) or if design work is being incorporated into the project.

Below, our interactive guide can help you determine what kind of collateral to share with developers depending on whether a design exists for your site or is required as part of the project.

Design Work Exists

  • Annotated PDFs
  • Flat image files
  • Invision project links and notes
  • Sketch files
  • PSD files
  • A style guide for your brand
  • Brand guidelines

Design Work is Part of the Project

  • Brand guidelines
  • A style guide for your brand
  • Examples of other sites, and what you like about them
  • Analysis of competitor sites
  • Relevant print media which can inform the digital design

Functionality and Technical Specifications

This is where you list the desired functionality of your website – highlighting what you want it to do. It’s also an opportunity to outline any third-party integrations your site requires, such as an interface connected to your live Instagram feed.

From a functionality perspective, it’s critical that you understand what your site is for and what users expect from it; that’s why audience research and customer personas are so important. Functional elements should align with the type of content and pages in your site structure, and should be geared towards streamlining the user journey towards your desired KPIs.

Here are a few examples of technical specifications you may want to list in your website requirements document:

  • E-commerce capabilities – payment gateways, shopping cart, ‘save for later’ options, stock checker
  • Multi-lingual options, allowing users to toggle between different default languages
  • Social media integration
  • Contact or sign-up forms
  • SSL certification
  • A responsive, mobile-ready version of your site – for total usability across all devices

Non-Functional Considerations

Aside from the technical requirements of your site, there are several non-functional elements to consider and communicate to developers. Here are some of the things you may want to list in this section depending on the needs of your site:

  • Accessibility – Accessibility is an integral part of all web design, and the WCAG guidelines can help ensure your site is usable by all. However, if your site has any specific access requirements or is frequently used by a certain type of user (e.g. children or the elderly), this should be communicated to developers.
  • Security – Does your site need to meet specific security legislation, such as the PCI Standard? Tell your developers here.
  • Legal – If your site has specific compliance or legal requirements, or if customers need to accept certain terms and conditions, you should list these here. An example of this is a date of birth gate for legal-age sites, such as alcohol or +18 video games sites.
  • Page load speed – Given page load speed is one of the top SEO ranking factors of 2019, it’s critical that you emphasise its importance to developers – particularly if you’re running an e-commerce site.
  • Hosting – Do you already have a hosting platform that you’d like your site to sit on? List it here.
  • Browsers and devices – Which browsers and devices do your current visitors and customers use? And which platforms, if any, would you like to target? Listing the browsers and devices you want your site to perform well for will help developers test and refine your site more effectively.
  • Maintenance and support – Will your website require ongoing maintenance and support to maintain security and ensure it continues performing at its best? Inform your developers of necessary maintenance, as well as any limitations you may have in maintaining the technical aspects of the site.

Download Your Free Website Requirements Document and Statement of Work Templates

Now that you know what goes into an initial statement of work and website requirements document, it’s time to start building these documents for your upcoming web project. To help you brief in a detailed website project to your developers, we’ve put together free templates you can use to create your own website requirements document and statement of work. Simply download them to your preferred device and you’re on your way to transforming your website.

At Banc, our web design and development team create user-centred websites to your exact specification, helping you build a powerful, fully-optimised platform that can help drive business growth. Click here for more information on how we can help you with your next web project or call our team today on 0345 459 0558.