It all starts with planning. Everyone who wants to build a website should think of planning first. For the website outline to take form, you have to start from the beginning:
What you should take into account when creating your website outline
- Put your main content front and center (for eCommerce sites, you’ll show products; for blogs, you’ll show blog posts; for a video site, you’ll show videos)
- Figure out your customer conversion funnel, meaning, how you make money from your visitors. If you rely on advertising, then properly interlink content, use sidebars, and other pop-ups to encourage users to visit as many pages on your site as possible. If your site is an eCommerce store, make sure you have important tools such as reviews, comparisons, search bars, well-defined categories etc.
- It’s important to carefully plan the website creation, given that, once a web page loads, users form an option in .05 seconds. There’s a short attention span, and your website has no second chance for a positive evaluation. The website message should be clear right off the bat, so take all the needed time to formulate it the right way.
- Prepare the information structure of the website with the users in mind. Research has shown that 55% of consumers will pay more for a better customer experience.
- Thorough understanding of the audience and planning ahead ensure your website will be well rated by visitors. You should treat this point seriously, as 94% of negative site feedback is design related.
General Principles for a Website Outline
There are some basic steps you should follow in creating the website outline.
Basic steps to follow:
- Brainstorm ideas, and note them down.
In the first phase of creating the website outline, we recommend you should gather as many ideas as possible. They’ll be the material from which you can choose what’s needed for the site outline and site-building.
- Organize the ideas, grouping them into categories and subcategories
The second step involves reviewing your ideas, selecting the valid ones and analyzing them. In this phase, you should also group them by categories and subcategories. Depending on the content you’re supposed to generate from them, and the correlation between the items, you should have, at this stage, a logical approach for your website outline.
- Create a website map
In the first steps of drawing your website outline, you should draft a sitemap. It refers to the website information architecture.
A sitemap shows how pages are organized in the website and on how many levels. As a best practice, you should try and restrict the number of page levels to 3. However, it’s not a standard you should strictly follow, if your website content needs a more complex structure, go for it.
Templatelab.com provides a diversified list of sitemaps you can start from. You can choose one that suits your content, and replace the sections with your own.
From simple sitemaps to more elaborate ones, there are many structures you can use for inspiration in the creation of your website outline.
Here’s one such sitemap:
A sitemap helps you give a definite structure to the website, and map everything out before proceeding to the actual creation of the website.
Also, a sitemap ensures all parts of the structure reinforce the purpose of the website. This way, the website outline will be the sure path to building an effective website of your own.
Below we give 2 examples of website outlines, as they might define websites for eCommerce and websites for consulting services.
Website Outline for Ecommerce – an example
- Home Page
- Products List
- Product Categories
- Products
- Checkout pages
- Services
- Shipping
- About Us
- Contact
- Terms of service and privacy policy
Website Outline for Consulting Services – an example
- Home Page
- About Us
- Expertise
- Services
- Consulting
- Idem
- Idem
- Testimonials
- Contact
- Think of and search for a layout
Now it’s time to think of a layout. A website layout is a pattern that defines the structure of a website.
You should have in mind the content you intend to put on your website. It’ll help you better understand what layout you should be looking for. Also for this step, you should browse through different versions of website layouts, carefully examine them and decide what to put on a shortlist. Then, you’ll have to test the shortlisted layouts, against your content structure.
- Overlap content structure onto the several layouts you’ve chosen
This stage is useful for testing the validity of the selected layouts. Overlap your content structure onto the several layouts you’ve chosen, and see what works best for you. You can use techniques to cut, crop, resize, rearrange, to find the best fit. The techniques could apply to content structure and also be reflected in advanced functionalities for adjusting the layout.
- Draft the first version of the website architecture
Once the layout has been chosen, you can draft the first version of your website architecture. Also, you should pay attention to keeping it simple and easy to browse through. Your users should have clear navigation paths that reflect your message coherence.
- Write down some notes on website branding and design
Branding and design principles used for your website will much influence its effectiveness. And the earlier you think of these aspects, the better you’ll build your website. You need to only have a record of the main branding and design schema at this stage to know what functionalities & resources you need for building the website.
- Make a quick draft regarding specific branding and design elements
You should think of elements such as colors, typography, content types (text, video, audio, etc.), design style (formal, friendly, etc.). All these are things that will enliven the website and give it the force of expression.
Website Content Outline
A website content outline is more specific than a general website outline. It refers to mapping out content elements within a website page. It involves deciding if a call-to-action button should be placed in the menu, or a section on the company’s mission should be part of the About Us page.
Once the general frame of the website has been created, you can start developing it and adding details for each page.
- You need to think of a content outline from the perspective of your company’s message. It has to be clear, and it has to follow the users’ website surfing behavior.
- You should base your content outline on data (data regarding warm and cold areas, heatmaps, clicks, events generation, page scrolling, etc.). In the absence of such data, you should base the content outline on your assumptions, provided you know well your audience.
- You can test 2 or 3 variants of one page, to gather actionable data for the final version of the website.
Repeat the process for every page included in the website sitemap, then analyze the website content outline as a whole. There might be tweaks and refines you should make, before starting to actually build the website.
Some useful tips and tricks
Do not plan in much detail, as you might make changes on the go. Instead, leave room for unexpected inspiration and creativity, that will make the website shine. Keep in mind that the website outline is not equivalent to making the website, it’s just a pre-design stage. It has the role of helping you follow certain directions, work on a plan and stay organized.
If you find it useful, include timelines in your website outline. However, be careful to set realistic timelines, that will really help you in the website creation process.
In a nutshell, website planning is meant to help you build the website, by giving a structure to your or your clients’ requirements. It’s a prerequisite that makes you avoid inconsistencies in creating the website and ensures it transmits its message correctly, effectively.
