Website Plan Template

The Website Design Project Plan template is the central hub for your project. It includes boards and placeholders to help you organize the goals, deliverables, visual references and content before you start a line of code. There are also checklists for your workflow so you have everything in one easy-to-access place.

It’s crucial to set a strong foundation from the start. A clear, inspiring, and informative brief provides the structure and direction for designers to do their best work. Website Design briefs typically include information about the brand/client, goals, specific deliverables, visual references, target audience, and important dates.

How will you know if the project is a success? Having a clear, realistic and measurable goal will help keep your team on the same page. For example, are you trying to increase inbound leads, or double the number of sales enquiries in 1 year? Alongside this, list any specific deliverables that will help you achieve your goal.

If you want to design a successful website, it's crucial to know who will be using it. That's where customer personas come in. Customer personas (or buyer personas) are fictional, composite characters that represent a segment of your audience—based on customer research. They'll help you choose a design style and write content that will connect with your customers.

Defining your customer's pain points is extremely important, as removing these challenges will likely be the key to winning your customer's loyalty. Next, switch modes and describe the ideal experience. This is the creative part of the process. It's where you can set aside any current limitations and imagine the best experience for your persona.

Next, it's time to start exploring some visual directions with a moodboard. Moodboards can help you visualize any aspect of your project. They can be literal and practical (featuring fonts, color schemes and images that you actually plan to use in the final design) or they can be more about exploring tone and mood. You can create a moodboard for each of these separately or mix them all into one board. There are no strict rules.

Start by adding any existing material you have—this could include client references, positioning statements or images you've saved as inspiration. Just drag them onto your board.

If you're the type of person who keeps a collection of images in an inspiration library, now's the time to see if you've already got something that could work. Or you can start by searching for visual elements from around the web. There are lots of fantastic sites where you can find great visual inspiration for free, like Dribbble, Behance and Designspiration.

Now that you have an idea for your website could look, let's make a Sitemap to plan the content and structure of your website. Designers, copywriters and marketers use them to map out website categories before jumping into the interface design phase. They become an invaluable reference for the whole team when estimating how much work is involved to build the website.

Start renaming each board to represent a category or page on your website. You can color-code each section to visually group related content. Choosing a relevant icon for each page will help you easily identify it.

A great content plan is the most important step in creating an engaging website. It's where you map out the copy, imagery and structure you need so your team knows what to design and build.

Start adding ideas for the written content and images that might appear on this page. It doesn't have to be the final copy but it will give everyone a feel for what you're aiming to communicate. Think about the key messages you want to communicate, sub-titles and even SEO keywords you need to include.

If you have a picture in your head of head of how the page could be structured, now is a great time to grab a pen and sketch it out. Repeat this process for each page in your Sitemap until you have a clear vision for the content on your website.

Whether you're working on a client project or collaborating with a team it can be helpful to bounce ideas off other people. As writer Louisa May Alcott said, "It takes two flints to make a fire."

A collaborative content plan is especially helpful for this step as you can easily connect and work together online. Bringing everyone onto the same page (figuratively and literally!) in real-time allows you to collaborate on copy, images and layout allowing you to create a coherent and engaging website.