Follow this step-by-step guide to learn the modern process of planning website content in Milanote, a free tool used by top creatives.
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.
But often, the planning is done in isolation. The copy is written in a Google Doc, the images are stored in a Dropbox folder and the Sitemap resides in a spreadsheet. It's hard for anyone on the team to see how it all fits together. A visual content plan solves all this and lets you plan everything in one place so your team and client have a clear vision for your new website.
In this guide, you'll learn the modern approach to planning content for your website using Milanote. Remember, the creative process is non-linear, so you may find yourself moving back and forth between the steps as you go.
We're going to tackle the content plan one page at a time. So pick a page on your website and try to define its purpose. Why does this page exist? What problem is it solving? What does it need to communicate? This simple exercise will lay the foundation for the content, tone and imagery on this page.
Create a new board for your first webpage plan.
Drag a board out from the toolbar. Give it a name, then double click to open it.
Add a note to describe the purpose of the page.
Start typing then use the formatting tools in the left hand toolbar.
Now that you have a clear goal for the page, start putting it into words. Create an engaging headline and introduction that helps your readers know they're in the right place. This will set the scene for all the content and imagery on this page.
Add a note to explore ideas for the introduction.
Start typing then use the formatting tools in the left hand toolbar.
Next, begin adding ideas for the written content 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. Don't worry about the structure of it yet—just get it out of your head!
Add a note to explore content ideas.
Start typing then use the formatting tools in the left hand toolbar.
If you have a picture in your head of head of how the page could be structured, grab a pen and sketch it out. Even if it's just some boxes and arrows, it's a great way to figure out which messages are more important than others. A simple sketch is also a useful reference for the developers who will need to build the website.
Click the Pen tool and sketch a rough page layout.
Next, think about the images that would suit this page. Again, these don't have to be the final images, but they'll help bring it to life. You can use images from the web or open Milanote's built-in image library to quickly find inspiring examples.
Choose example images from the image library.
Search over 3 million beautiful, free photos then drag images straight onto your board. Powered by Pexels.
Embed video from Youtube.
Copy the share link from Youtube, Vimeo, Soundcloud or many other services. Drag a link card onto your board, paste your link and press enter.
Animation is a great way to communicate how users could interact with your website. For example, if you're planning to include an image gallery that cycles from left to right, it's much easier to show it in action rather than trying to explain it in text. Grab some animated GIFs from Giphy or a video from YouTube or to help explain how the interactions could behave.
Upload animated gifs.
Click the "Upload" button or just drag a file onto your board. You can add images, logos, documents, videos, audio and much more.
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.
Invite someone else to edit to your board.
Open the "Share" menu from the title bar of your board. Add email addresses of the people you'd like to collaborate with—they'll receive an invitation via email.
Start a comment thread.
Drag out a comment from the toolbar on the left and place it on your board. Other editors can reply to your comment.
When you're happy with the content for your first page, take a step back and look at the overall structure of your website by making a Sitemap. This lets you organize the content for your entire website in one place. You can learn more about this process in our guide How to create a Sitemap.
Use the Sitemap template to structure the pages of your website.
Now that website content plan is complete, everyone on your team has a clear vision for how your website will fit together. And remember, you can continue to refine your content plan over time as your website grows. If you're starting a new website design project right now, use the free template below or read our full guide on How to plan a website design project.
