🔜 👨🏿‍🎓 👨🏻‍🚒 Great Guide to Website Content Design and Planning 🕖 📑 🐹

So, you decided to be consistent and start developing the site from the most important and fundamental stage - with structure and content. Ok, then you are in the right place where we have put together instructions and effective tips for you on how best to do this and where to start. May the force be with you, since such a fundamental guide for one squat is unlikely to be mastered. Website structure example (Blocks are clickable)

What sections to include? What about the content? We seriously thought through everything, spent more than a month on research and collected all our 18-year experience in creating websites in this guide. After reading this article, you will gain a comprehensive understanding of why the site of the company or product should be structured in this way, we will also touch on the fundamental principles of SEO and content planning.

, , , , — , - , . .

Creating a website structure from scratch may seem like an elementary task, but often it is not at all. And that's why.

Creating a consistent structure means creating a solid foundation for your successful online presence. Thoughtful planning and implementation of this stage contribute to the achievement of all subsequent goals as efficiently as possible.

Surely you know how a well-structured site is important for search engines. And if the expectations of the search engines are not met, then in this case you should not rely on the organic influx of visitors. And in this symbiosis, our goal is to build the optimal structure and achieve the perfect balance between the robot and man.

This guide will provide you with detailed instructions on how to structure your site, practical advice on content and examples of finished projects for heating interest.

It sounds promising? Then we begin!

Main tip

Navigation and footer

First of all, focus on the navigation bar and footer of your site.
These elements must be present on every page. Your visitors always want to know where they are currently located and where else they can get. The main navigation menu usually includes a logo and links to the main pages. The footer contains links to other sections and links to your pages on social networks.

If you have doubts about which links to which internal pages to include in the footer of your site - that's good! Because later in the text we devoted a separate section to this.

Consider using sticky navigation so your users always have a menu on hand, no matter how far they scroll.

Maximize CTR

, .

Therefore, by placing the most valuable information and call-to-action call-to-action elements in the effective first field of the screen, you will increase the click-through rate (CTR) and capture the attention of the visitor. It is literally about 3-4 seconds, for which the visitor scans the screen and, not finding the right information quickly, most often leaves the page immediately.

Call to Action (CTA)

The next step is to make sure that the call-to-action (CTA) elements that call for the specific target action are located in the right place. The standard way to place a CTA is to add the corresponding button, but other forms are also common - pictures, videos, links.

Based on practice, the main rule for CTA is that the element should stand out. The more elaborate these elements are, the more user clicks you get.

GDPR privacy policy

If your target audience is customers from EU countries, then the processing of user data must comply with the General Data Protection Regulation (GDPR) accepted in Europe.

Cookies contain personal data and can be used to identify users. And if you collect (for example, an Internet statistics program for your site is installed) and process this data, then do not forget about the pop-up form on your first visit so that visitors can give their consent or decline cookies.

Remember that regardless of the user's choice, your site should be accessible to everyone.

Structure

We have already done this for you , but if you still decide to independently conduct research on high-quality sites, you will find that their structures are similar. These are time-honed models that are unlikely to change much in the near future. Naturally, the manual below is not the gold standard. This is the base, the main starting point. Starting with it, focus on your field of business, study the sites and structures of competitors to achieve the best results.

These are the pages that make up a well-balanced site structure:

home
About us
Products / Services
FAQ
Jobs
The blog
Contacts
Error 404
legal information

We are sure that you have met them on almost every site visited. This is because such a structure is effective for almost any business, regardless of size and scope. Okay, okay, of course, there are differences, but the basis does not change much.

Moreover, we can imagine a basic structure with even fewer pages. Here is a shortened version of the list:

home
About us
Products / Services
Contacts
legal information

The clear and thoughtful organization of the pages is able to give the visitor what he needs most clearly and quickly. Search algorithms that mimic the behavioral patterns of people appreciate the same thing.

The goal of each page included in the structure of your site is to convert visitors to customers. Pages form sequences, gradually fostering the interest of visitors moving through them, so that they end up on the page of your product or service. Everything else is part of user flow.

If you look at a site’s journey from the point of view of a sales funnel, the top of the funnel will include the main page or blog, educational pages in the middle, and product or price pages will be the base of the funnel, the end point of the journey leading to sales.

Main page

Why create: catch attention, make a first impression, optimize navigation.

Content:

Hero image / Basic visual message
Product / Services
Key Benefits
About us
Jobs
Feedback (case studies, recommendations)
Cta

An example of a homepage is iea.org.

It might seem that the homepage is the most important part of your site. However, recent studies show that visitors do not spend so much time on it. The average session time is about 2 minutes 17 seconds, while visiting the main page takes about 7 seconds. The reason is that people often immediately search for something more specific.

Therefore, your main page is a control panel designed to help users get where they need to as quickly as possible. This is the main hub where incoming traffic flows are collected and routed.

“The home page is like a hotel lobby. Although this is an important part of the hotel, it is not the place where your guests would like to stay. They want to get into their room. ”

Hero image

Hero image is the first visual effect that a user sees when he gets to the site. Images tend to convey information faster and create a more engaging emotional response. Therefore, make hero image something unique, catchy and, most importantly, closely related to your brand.

, JTBD (jobs-to-be-done), , / , , (), . — , .

Your Products / Services

The sooner you show people what you offer, the better. If your product line is limited to just a few items, consider showing them all on the home page. If there are many products, then you need to create a catalog and classification with brief descriptions for each category. Add visual explanations and a product category.

Identify product features and benefits.

As Simon Sinek said in his famous speech, people buy not WHAT you do, they buy WHY you do it.

Therefore, identify three to five core values of your product. Make their descriptions concise and present them, along with catchy visual elements that match the recommendations of your brand book, if you have one.

Social Impact

People tend to listen and trust their surroundings. Another great way to quickly implement and disseminate information is to add feedback about your company or products. Focus on your target audience and add relevant reviews. The more famous and public the author of the review, the better. Do not worry if you have not yet appeared on TechCrunch or Forbes; Your visitors should quickly establish positive emotional contact with reviewers, which is important at the moment.

About us

Why create: tell the story of your brand or company, describe the mission, present your team and any other valuable information that will help your conversions.

Content:

History / timeline
Company goals and mission
Reviews
Team
Partners
Video
Statistics
Interesting Facts

Example company page - hines.com/about

Contradictory, but the main page does not exist to spend a lot of time on it, similarly to the “About Us” section. In fact, he is not really about your company.

This is more about your audience and what consumer value you provide. Keep this in mind when you go into the details of your company. With each post you add, think that it has value for visitors and their needs.

People do not appear on this page by accident. They purposefully want to get an idea of what you are doing and why you are doing it. And to provide them with the information they need, here are some tips to help you create a great page.

First of all, determine your target audience. Who is the main recipient of the information? Technical person? Decision maker or not? Your story and the form in which you present it should be correlated with the values and objectives of the target group, motivate people to action.

Company History

Many companies prefer to acquaint visitors with a brief history of their company in a timeline format. And if you choose event tags correctly, then the history of your company will help to create a reliable emotional connection with your visitors. Even if your company is young enough, there are many significant and interesting facts.

Your basic principles

. , . . , — .

And again, reviews

If you have not added reviews to your home page, now is the time to do it. This is a great way to declare yourself as a reliable partner and show your true value.

You can also add aggregated customer reviews, achievements, badges and awards. Consider placing your company profile on various information platforms (online listings). This will provide two main advantages. First, high-quality backlinks to your website are extremely attractive for SEO. Secondly, if you invest resources in collecting customer reviews on such platforms, then they usually include you in mailing lists and give you badges. And this is a wider reach of the audience and increased brand awareness.

People backstage

Introduce your team. Your tough employees benefit you not only in carrying out your direct duties. For example, it is claimed that the image of a human face brings us a sense of trust and confidence. This is the very feeling you want to arouse among your visitors, isn't it? Some companies even include dogs in their staff.

But a blessing can quickly turn into a curse if you are not careful. Keep in mind that your top employee can be an easy target for headhunters. You do not want to lose your best people? So think well about what and how you will tell.

When adding visual content to the About Us page, focus on real shots, stay away from stock images.

Partners

Almost the same as above applies to the publication of your business partners.
If relevant, add this information.

Record a video

Consider making a short video where you greet visitors and tell them a little about your company and products. People tend to spend more time on a website with attractive video content, so having a video will positively impact your SEO.

Statistics and interesting facts

Last but not least, add specifics to confirm your statements. Focus on your key metrics as if you were reporting to your shareholders. It will be up to you whether this number of completed projects or impressive growth compared to last year.

Spice up your story with humor and fun facts, such as the number of cupcakes eaten by employees over the year or liters of coffee drunk. This will cheer up and empathize with your visitors. After all, you are people, not just a brand or a company.

Products / Services

Why create: showcase your products in detail and outline their values.

Content:

Images
Description
Features and Benefits
Prices
Reviews / recommendations
contact form
FAQ

Example Services / Products page - stripe.com/payments Product

pages are important for every customer located on your site. The overall goal of these pages is to convert visitors to customers, directly or through intermediate pages.

Together or separately, the

Product Section of your site should be structured according to their quantity and variety. If the number of products is small, start by placing them all on one page. If there are a lot of positions, then they will require categorization, so consider creating a catalog. Make a description, include images and cross-references.

Visual language

Product images are of great importance and contextual images perform their functions best.

, . , . .

Product Description

Combine the image with a detailed description of the product. By itself, this is a separate science, so we will not delve into it. Focus on your target audience. And remember the JTBD approach, we have already touched on this topic.

Features and benefits (value)

It is important to summarize the best qualities of your product and present them as features and benefits. Keep them separate from the main product description so that they are easy to read. Brevity - the sister of talent, describing the features and advantages of the product, try to keep within the size of the tweet.

Prices

Go ahead, prices. There are different opinions about whether to indicate prices on your site or not, which mainly depends on the nature of the product offered.

In some cases, direct placement of prices on the main page increases the conversion rate. In others, on the contrary, hiding causes more interest in the product.

Having a separate price page (products / services) is good for your SEO: more pages in your index, more keywords for ranking in page content. Another advantage of a separate price arrangement is the ability to fine-tune your customer’s path, especially in B2B funnels. But the general rule is that it’s better to immediately save resources and indicate prices on your home page.

If you want to gain the trust of your future customers, do not forget to inform them about the safe processing of payments, about your rules for refunds, cancellations and exchanges. Another good way to build trust is to have a trial period.

Relevance of feedback

We have already touched on the importance of feedback and recommendations. Adding customer reviews for specific products is a great way to show the value of a product to your target audience.

Testimonials can range from customer recommendations to demonstrations of projects that you are proud of. Having both is an advantage.

Stay in touch

Consider adding a contact form so your site users can quickly contact you. This is important for effective contact and customer support, measuring the consumer loyalty index, and obtaining other valuable information and indicators.

Once you have gained momentum, consider introducing comprehensive client management platforms, such as Intercom or HelpScout, with their chat features and an interactive client communication environment.

Prepare answers to questions in advance.

Another way to improve user interaction on the page of your product or service is to include the FAQ section. Focus on frequently asked questions in your inbox and on SEO semantics.

Short and accurate answers are important. Your visitors will be grateful that you answered their questions in advance.

Navigation

A product page can serve as a Pillar page - it can be a hub that accumulates valuable organic traffic. And already relevant cluster pages (Cluster pages) are linked to it. In addition to improving SEO, using the Pillar-Cluster model greatly streamlines the user flow on your site.

FAQ

Why create: answer typical questions of customers without contacting them directly.
Content:

Questions and answers
Search
Live chat

Example of the Help / FAQ page - help.dropbox.com

Often, incoming questions are not directly related to your products, billing or delivery; Users can request a variety of information that is not available on your site. This is where the FAQ section comes into play.

The FAQ page is quite simple and offers many benefits. As mentioned above, focus on answering real customer questions and recurring specific questions found in search semantics.

Separation by topics

Sort your questions and answers. Each topic should have a separate section. Thus, visitors to the site will be able to go directly to the desired question, without wandering about everything else.

Search

If your analytics shows that even despite the classification of the question, visitors cannot find what they are looking for, consider implementing a search. This is a common feature on sites and there are good reasons for this. The less time it takes to search for information, the better the user experience.

Answer questions directly

Another channel that you can use to answer questions (and also to get statistics on them) is chat. Chat is usually presented on the page as an interactive beacon, with which you can ask questions or get useful information.

Live chats have gained popularity in recent years because they significantly reduce the time spent searching for information. Nevertheless, as in everything, there are pros and cons in realizing the function of live chat.

Chatting does not necessarily mean that he is “alive”. Chat services can be configured to forward requests to customer support. Thus, you do not provide answers on the page in real time, but receive an email with a request from your visitor to continue communication.

Another option is to make the chat automatic: use the chat bot. Chatbots analyze questions and can automatically provide answers, direct site visitors to pages or sections of the site that they could not find or simply did not want to spend time searching.

In general, creating a FAQ page just for the sake of having one is a waste of time and resources. Make sure you carefully work on its content, and then you have good potential for increasing end-to-end conversion rates.

Jobs

Why create: to develop your HR, attract employees and niche ranking by keywords.

Content:

The advantages of working with us
Jobs
Filters
Application form
Media related to your corporate culture, events, work environment, etc.

An example of the Jobs page is spotifyjobs.com

Basically, the Career section is for those who are interested in working with you as an employee. Tell them more about your company so that they understand that you are the brand with which they would like to connect their lives.

Why are you better than the rest?

Begin your story by describing the main advantages of working in your company, no matter how mundane they may seem (at least the same free coffee). Try to state your advantages along with relevant images and brief descriptions in order to better convey your ideas.

Who exactly are you looking for?

The key section of your Career page is jobs. Like the FAQ, this section needs to be classified. Segment your vacancies by level of professionalism, or department. If you have many vacancies at the same time, consider adding a filter or a search field.

A separate page for each vacancy

Each vacancy should have its own separate page where you can learn more about job requirements, necessary skills, payment, and more.
Add an application form. The easier it is to use and more understandable, the better. In addition, the form is a great way to create and customize an automated search and selection process.

Argue

As in other sections of the site described in this article, visualization will help persuade applicants to choose you. Whether it’s an infographic showing the progress of your company or informal photos from your office, show them. This will demonstrate to your potential employees that you love to have fun as well as work hard.

The blog

Why create: share your knowledge and experience, research and ideas, get powerful SEO support .
Content:

Content That Creates Value
Attractive images
Video
Comments
Cta
Links to profiles on social networks

Example Blog Page - goodonyou.eco/category/stories

, , .

Blogging allows you to cover niche topics from the perspective of your brand, complementing your content strategy. Depending on the strategy you follow, the return on investment in content may vary. Let's look at the benefits of having a blog in more detail.

“In vain did you acquire knowledge if you did not pass it on to others”
Dvarim Rabba (commentary on the Book of Deuteronomy)

If your blog is regularly updated, search engines see that your site is “live” and index your site more often.

We have already mentioned the ranking for relevant keywords. To do this, make sure that your texts have a relatively large volume of at least 250 words. For longrid - from 800 words. Carefully stick with SEO text optimization.

By adding a blog, you naturally get another advantage: an increase in the duration of user sessions, which raises you in search results. The more interesting your posts and posts are, the more time visitors will spend reading them and, by the way, do not rewrite other people's blogs, this is inefficient.

Next, you will already convert the time that visitors spend reading your blog into achieving their goals - add CTA blocks, pop-up windows offering to subscribe to the newsletter (but moderately and elegantly), links to other articles, etc.

In terms of structure, the blog page is very similar to the job page. There is a main page with links to all your blog posts, and each of them has its own separate page. It’s not difficult at all.

Lure the reader

The top page of a blog usually consists of individual links to posts and page numbers. Links are usually placed in page elements having: cover image, post title and description, where the latter can be identical to the heading of the article. Thus, visitors to the preview immediately get an idea of the record and are more likely to open it. And one important tip - never click clickbait headers!

If your visitor is a search robot, add the appropriate keywords in the alt-tags of the images (this is good for the whole site as a whole), post headers and descriptions. You can also implement the tag feature on your blog.

From the point of view of the Pillar model, this will allow URLs such as “https://yoursite.com/blog/#seo” to act as ideal hubs for accumulating organic traffic from adjacent cluster pages. Robots identify pages as contiguous if they are correctly stitched.

Organize content

Another thing to consider is pagination. The most correct thing is to have from seven to ten posts per page. This creates a visual order and allows your readers to switch between pages rather than scrolling through your endless list of posts. This is especially true for mobile devices.

Images and videos

A cover photo or video is always a great way to spice it up. When the images are matched to the theme, they automatically attract the attention of the reader, increasing the duration of the sessions.

Let the audience comment

Add a comment section to each post so readers can leave feedback and interact with each other. Comments can also complement your text body.

However, without proper moderation, comments can become bogged down in anarchy. So make sure you have enough resources to manage your comments effectively.

Navigation buttons

To help readers navigate efficiently, take the product page as an example and add the Previous / Next buttons on the page of each post. There should also be a button that returns readers to the list of all your posts.

Share content

Finally, make it easy for your visitors to share their knowledge with others by adding share buttons on social networks. This has many benefits. Among the most valuable are increasing brand awareness and referral traffic to your site from other platforms.

News Page

What do we have on the news? It seems that on company websites less than 1% of visitors consider news worth their time. In addition, corporate news is often perceived as too subjective and self-praising. Learn the behavioral patterns of user groups; you may find that the small percentage of visitors who are interested in your news are those who convert better than others.

If you decide to create a news section, follow the same principles as on the blog page. Publish your notes with clear, concise visual and written messages.

Contact information / contact us

Why create: let visitors quickly contact your company and improve SEO.

Content:

Phone numbers, e-mail (for different purposes)
Feedback form
Map

Contact page example - rndhouse.com/contact

Although the contact information page is one of the basic pages for any website, it is also one of the most important.

For example, search engines analyze your site map and rank you higher if they find this page.

Categorization

One way to distribute request flows by email and phone numbers is by topic, for example, general inquiries, cooperation issues, vacancies. Then you add the contact information to your page and wait for the site’s scanners to collect e-mail and reveal all types of spam distribution. But there is a better way - contact forms.

Create a form

A more convenient solution would be to have a contact form with spam protection. There are many ways to create an excellent contact form, all of which are focused on sorting user requests and redirecting them to the desired inbox.

Location

Another useful feature for the contact page is to display the location of your office on a map. It's just that the address is no longer interesting to anyone. Some companies go beyond the standard Google Maps or Yandex Maps and turn their map into something unique.

Error 404

Why create: Informing users about errors and redirecting them to other pages.

Content:

Images / Video / Interactive Elements
Error message
Links to other pages of the site

Example of Error page - netflix.com/notfound

We all ended up on page 404 more than once and encountered other errors. Most companies do not consider these pages worthy of attention. However, if you competently work on them, error pages can be a find, not disappointment.

Key Points

First of all, place links to other pages. At least there should be a link to the main page.

It’s bad if your error page is essentially a dead end, neither your visitors nor SEO will like this option. You can and should redirect traffic from the error page to the right place.

Secondly, add the information. It can be an automatically generated message or something more creative. Post a fun picture or interactive elements so that visitors appreciate your meticulous attention to detail, even as underestimated as error pages.

There are so many great examples of error pages on the web, get inspired and use your imagination.

legal information

Why create: tell us about your compliance with legal requirements.

Content:

privacy policy
Copyright Notices
Terms and conditions of use
Disclaimer
Abuse or complaints contact information
Patents
Corporate policy

Obviously, an ordinary visitor will not be interested in visiting this page. But legal pages are required by law and should be available on any page of your site. Therefore, it would be wise to place links to them in the footer of the page.

Make sure that the documentation is accurately presented and verified by your lawyers, as well as:

Contains all the necessary information, divided into numbered paragraphs
Written in a form understandable to most people
Corresponds to the overall site design

Conclusion

Planning the right structure and content is not such an easy task as it might seem at first, it requires thoughtful planning, research, and painstaking work. But this is the foundation!

This should not be neglected and treated as a secondary task, quickly moving directly to the creation of the site itself (design, programming), believing that this is more important.

We hope that our guide will help you realize this and create a really good website with the right structure and organized content.

As for us, the authors of this guide, we have been doing this for 18 years. And they tried to accumulate all their experience (in addition to this guide) in the powerful and at the same time simple tool Octopus.doWith the help of which you can create a website structure for free, plan content and share it with anyone. Registration is optional.

Great Guide to Website Content Design and Planning