There are over 2 billion active websites on the internet at the time of writing this.
With this number, one would expect that website planning is a common practice in the digital space.
Sadly, it’s not, which is why many of the websites you see around have terrible and inefficient designs.
While design trends change almost all the time, a few basic components of good web design remain universal.
- Easy to navigate
- Industry-appropriate design
- Clean layout
Users shouldn’t struggle with finding a particular page within your website.
Everything must be neatly organized, with simple navigation features and menus.
Your website could also do with a clean layout. Your page shouldn’t appear as if it’s crowded with information, video, and graphics.
It should also load faster than your users can bat their eyelids.
Compatibility is also a concern. Your website has to conform to the size of your user’s screen. You have to test every single one of its elements across different devices and make sure they all load fine.
Overall, every web development project calls for serious planning. Before you even think about hiring a web developer, it helps to sit down and come up with a detailed plan.
What’s a Website Plan?
Think of your website as the blueprint for building your website.
It’s like the specifications or architectural drawings for a new building. It contains all the information you’ll need to build the best possible website for your business.
It should contain the following information:
- Background information: your history since you started up until where you are now.
- Your Target market: what are their demographic and psychographic details? What are their goals? You have to make sure you have your buyer personas in place.
- Instruction on the Overall Structure of Your Website: Clear instructions on what you want to create and why
- Instruction on Each Part of Your Website: Instructions on how to design each part of your website, including the structure, design, and content.
- Metrics: What metrics will you use to measure the success of your website
As you can see, a website design plan is an outline with information on how you intend your website to look like, what information to carry, and what pages to fit each information.
It lets you see all your website pieces before you make any major plan on how to put them together.
The most basic website plan is an outline of your site’s navigation menu. A detailed one will contain more information on the type of content on each page.
You have the option of keeping it simple or adding notes, texts, images, or videos to fill it out.
Example of a Simple Website Plan:
This is a simple website design plan built using a mind mapping tool called MindMeister.
Must You Always Create a Site Plan When Developing a website?
The answer is, yes.
Imagine it as having all your ingredients ready before you start cooking (mise en place in French).
Or making sure you have everything you need when going out for a trip. It’s where you prepare in advance.
So, what should come out of doing all this?
First, it will make the web building process easier and faster. It’s also how you make sure that you’re not forgetting anything important.
Note that there’s no one standard way to prepare the plan.
You can draw it, write an outline, type it, or use a mind mapping tool – whatever works best for you.
The recipe for creating a bad website is not planning for it.
So, how do you tell a bad website?
An average person might not understand the difference between a good website design and a bad one.
It bears mentioning that it’s not about the site’s visuals. Having a good-looking website doesn’t necessarily translate to a good design.
After all, visuals are subjective.
That said, here are the common web design mistakes people make, which make their website design terrible.
A Website Without a Clear Message
The worst design mistake you can ever make is not providing a clear message on your website’s purpose.
Users should instantly be able to figure out what your website is about upon landing. They should know what you sell and stand for within the first few seconds of landing on your website.
CyberDsignClan is the perfect example of a website with a not-so-clear message.
The first thing you see upon opening the link in the large graphic that reads, “skip the intro.” On clicking on the page, the real homepage opens up, only to create further confusion.
It’s the perfect example of all the things to avoid while creating your website.
Any information that appears on your website before the user hits the scroll button is considered “above the fold.”
Some people like to refer to it as the “hero section.”
Since you also have a split second to communicate your business message, it’s always a great idea to make sure your business name and any important message concerning your business are featured here.
It’s also where some companies include their navigation.
The last thing you want to do is make your site visitors scroll your website to learn about your business and what it is that you do.
A Cluttered Homepage
In addition to having a clear message, you should make sure your website has a clear layout.
A cluttered website will make your website hard to both read and navigate. Consequently, your site’s visitors will leave without completing the intended action.
Angren is a perfect example of a site with a cluttered homepage. The site has no structure, and it’s like everything was just thrown around without any proper organization.
The site has no categories. Nor do they even have a navigation menu. Everything just looks jumbled up, which makes it the perfect example of the things to avoid when designing your website.
You can tell, nothing was planned. The developer just dived into coding without paying any special attention to the site’s design.
Angren has a lot to learn from a site such as Amazon or Alibaba. These two sites display hundreds of thousands of product pages, but still, it’s well-organized. Users don’t struggle to locate an item they want, and it’s all because the site owners took their time to plan for everything before embarking on the development process.
Not Optimizing Your Website for Mobile
Much of the traffic you’ll get will be from mobile. Meaning, one of the greatest website design mistakes you can make today is building your website for desktop first.
By not optimizing your website for mobile devices, that means most of your visitors will not be getting a good user experience.
Many sites boast responsive design, which allows them to adjust their elements to the size of any device screen.
With responsive design, you can design your website to change fonts, hide elements, and remove a background upon detecting a smaller screen.
Here’s an example of a website that wasn’t optimized for mobile (dequeuniversity.com):
Even adjusting your browser renders their site unreadable. It goes to show that they only designed the site with a desktop in mind, without minding those who visit their site on mobile devices.
A site with Poor Navigation
When users land on your site, they expect to find simple navigation.
They do not expect any form of complication while browsing your menu and finding the information they want.
Here’s an example of a website with a navigation system that doesn’t inspire you at all (uat.edu):
This website belongs to an educational facility. You bet it contains a lot of information. The problem sets in when you’re trying to locate their navigation menu.
Worse, their menu is almost unclickable. The floating graphics make it hard for you to click on it.
Unless you’re determined to find it, it’s easy to give up, leave alone be tempted to hop to the next site.
This is a common problem when a website is not optimized for mobile. When your website elements fail to adjust on smaller screens, sometimes they may become too small or overlap, and, as such, hard to read.
You can easily avoid this problem by completing a detailed test of your website before launching it.
Make good use of software and tools that emulate how your website appears on different mobile devices.
What’s the Difference Between Website Requirements, Brief, Scope, and Plan?
People use these terms interchangeably, even when it’s clear they don’t mean the same thing.
When someone asks for website requirements, what they’re simply asking for is a more technical guide rather than a complete scope of work.
The term requirement has also been evolving over the years to become more aligned with organisational needs.
Typically, your marketing team or department will be using the term scope or brief.
When talking to a web design agency, you’re likely to hear them use the term website scope or brief.
A website brief is like a business plan for your website. It details the design process, requirements, and timelines. The goal is to provide all the parties involved with a clear picture of what’s expected in terms of project deliverables, workflow, and post-launch services.
A website brief is also meant to provide clients with an accurate estimate of timescales and monetary expenses.
Who’s Supposed to Create a Website Brief?
Mostly, a website brief is created by a business after signing a website design contract with a design agency.
It’s key to identifying the key pieces of information that will help you stay on track and within your budget limits.
A website brief can also be written by the web professional building the site for you. The difference is that instead of referring to it as a website design brief, they’ll call it a website design proposal.
All the relevant stakeholders are allowed to participate in the creation of a website brief. However, much of the work will be done by the client or website owner.
A content brief also helps to manage expectations. Moreover, it can be used to prevent scope creep (unintentional expansion of your project scope or goal beyond what you had originally agreed upon).
Website Planning 4 Easy Steps
A website plan will save you many hours of headaches and frustrations.
The planning process doesn’t have to be complicated and time-intensive. It’s just a matter of slicing off a few minutes off your business schedule to answer some really important business questions.
The goal is to ensure the designing process sets off on the right foot.
Think about what you want to accomplish. From there, it’s a matter of making the right choices. At some point, you may be required to tear down everything you designed and start over from scratch.
In a way, website design planning is just as much about deciding what you don’t need, as it’s about figuring out what you do need. The principle of “less is more” still applies here.
Step 1: Determine the Content You’ll Need
You can begin by determining the kind of content you’ll need for your website. It’s quite unrealistic to write your website content before you have even created the website.
You don’t need to prepare a full list of all the content you’ll need. Just 1 or 2 content ideas for each type of content that you’re planning to produce for the website.
The content you come up with will guide you through the process of developing your website. It will also help you determine what theme to use.
Here are a few examples of content types:
It bears repeating that you should use a content mapping tool such as MindMeister to drive this process.
When it’s all said and done, your website will wind up with thousands of pages. While you should have that in mind while planning your website design, the design you choose only needs to handle what’s in your mind map. That’s because the other pages will only replicate the design you already have.
Consider all the Other Assets You’ll Need
There are other assets outside your content needs that you’ll have to consider before you embark on the web creation process.
They include things like:
- Your website logo
- Brand fonts
- Brand colour
- Brand summary
- Social media accounts
- Podcast feed
- And so on…
The biggest of these items are your brand assets.
Your brand assets don’t include something in particular. It’s about your brand identity.
Here’s a list of all the things you’ll need for your brand identity.
Note that you don’t need every single one of the items on the list, just the one you deem necessary.
- Your company logo
- Your brand colours
- Your brand fonts
- Customer reviews
- Customer testimonials
- About us
Nail Down Your Must-have Website Features
Create a list of all the features you’ll need for your website. Nail this list.
That demands that you carefully think through the type of website that you’re looking to create.
With WordPress, premium themes come already integrated with these features. Where you can’t find a theme with the features you need, then check to see if there’s a WordPress plugin for it.
However, this is a line you want to tread carefully. First, you want to make sure you’re using as few WordPress plugins as possible. That’s because too many plugins will affect your website’s performance. They’ll slow it down and even make it more susceptible to security risks.
Again, you don’t want to choose a theme with too many of the features you’ll need. The last thing you want is to heavily rely on a particular theme to a point that it will be hard for you to move to a new theme.
The goal is to try and find the perfect balance between theme and plugin features.
But before you get to that, you need to determine all the features that your website will need, and make a point to write them down.
Here are a few examples of features that your website might need:
Look Outside for Inspiration
By now, you know almost everything your website will need. You even have an idea of what WordPress theme to buy and which plugins to use.
What remains is for you to think about how you want the website to look and feel.
There’s no sin in looking around for some little bit of inspiration. You can start by looking at a few similar websites in your niche and see if there’s something you can borrow from them.
What to Include in Your Website Plan?
Your website plan should try to cover the following:
- Your website goals and objectives
- Your audience or target market
- Your business requirements
- A sitemap
- Research-based on your existing customers
- Content planning
- Functional requirements
- The site’s information architecture
1# Your Website Goals and Objectives
You have to start by setting up a clear destination.
Where do you want your website to take you?
Without a clear destination, then your business will be carried by any wind that blows.
The reason for setting up a goal for your website is the same as setting up a goal for any other thing. It essentially helps you focus your attention on what’s important while ignoring the rest.
It allows you to see if you’re succeeding or making any progress towards your dream.
It helps you to stay on track.
In web design, you’ll not just need a goal, but a set of goals that can help you communicate how to measure your website’s success.
Examples of goals you can come up with:
- Your number of leads and sales
- Number of requests coming in
- Search engine rank and the improvements made (this shouldn’t be your main goal, but a sub to another goal you have).
- Any other goal that’s relevant to your business or company
2# Your Audience or Target Market
Your target audience is arguably the single most important part of planning a new website. After all, you’re designing the website for them.
Understanding your website goes beyond writing buyer personas.
It involves doing a lot of research, intrinsically to figure out how to best communicate to your target audience.
Here’s how you research your target audience:
- Look at your existing customers
- Document your ideal customer, as well as how and why you want to serve them
- Understand the existing gap between where you are in the present and the future you see for yourself
- Create a string of personas, where each persona represents a particular audience you’re targeting
Understand how each audience group would like to be served.
If a particular audience is heavy on using social media or search engines, then be sure to communicate to them in a way that best appeals to them and their needs.
Developing a buyer persona will help you direct your information architecture, content requirements, and your overall website look.
3# Your Business Requirements
A common mistake people do when planning their website design is focusing too much on their customers or too much on their business needs.
You have to find a perfect balance between the two.
An inside-out marketing strategy is where you only focus on what your business needs without paying much consideration to what your prospects or customers need.
Your website planning brief should include must-have business items. For example, an e-commerce website must have a credit card payment gateway.
Failure to include it in the documentation means they may be left out in the development process or until it’s too late.
While this is a simple item to remedy, there are other even more critical components of your website that you want to outline earlier on in your website design brief.
The goal is to try and outline everything each section of your website will need to create a complete and well-defined set of requirements to submit to the web developer.
It’s common for website owners to make decisions based on a hunch, intuition, and anecdotes.
This is not the way to go if you’re serious about your business or setting up a formidable online presence.
Doing this is only bound to hurt your business in the long run.
We’re not trying to dispute what you already understand about your customers and competition. But as humans, we’re victims of our own biases.
There’s nothing wrong with having assumptions. What you want to do is make sure every assumption is backed up by hard or well-researched facts. Where you can’t find information about some of your assumptions, it helps to reach out to your target customers and ask relevant questions.
Types of researches to conduct/perform:
- Review of the best and worst sales, not just in your organization or business but the entire industry
- Review of some of the best-performing products and services, again not just in your organization but in the industry as a whole
- Review of your web analytics or any other similar metrics. Find out where your audience is coming from, what they do when they visit your website, and if there is any hole in your current website performance
- Run research experiments, including polls, surveys, and a series of tests on your existing users
- Install a site tracking tool to find out how users interact with your site
Go slow on assumptions and focus more on working with research-based data.
You’d be surprised to find out that much of the narrative people spread aren’t always fact-checked.
The more you research the more comfortable you’ll get with numbers. You’ll soon be able to make bolder statements to counter your previous assumptions.
5# Information Architecture
Information Architecture (IA) is the practice of organizing your website content in the most effective way.
It’s a lot more than content management. But how do you ensure your website content can be accessed by a user. It’s all in your website’s design.
IA Influences your site’s navigation, storage systems, use of the content, and ultimately the CMS you use.
6# Visual Sitemap
The term sitemap has multiple meanings.
But basically, it’s a file with information on your website’s pages, videos, and other files and the relationship they have with each other.
The Different Types of Sitemaps
- An XML sitemap is a technical page meant to help search engine bots crawl a site.
- A sitemap page is a page that’s been specifically designed on a site to help users find deep pages
- A visual sitemap, on the other hand, is a visual diagram portraying your site structure. This is what you should be focusing on in your website planning process.
Your website design scope must include a visual sitemap.
A visual site map shows your key content structures, and the relationships they have with each other.
It also helps to develop important guides to your website, including:
- Navigation guides
- Use journey maps and workflows
- Technical workflows
A visual sitemap will also help the designers and developers working on your project understand the size and scope of your project.
An e-commerce store might work with a few page templates that need to be designed, but a sitemap will present the extensiveness of the categories that make up the site.
You have a long list of tools to help you out with creating your site’s visual sitemap. Here are a few of them:
Wireframing is a critical part of the design process.
It allows you to break down each page’s interface and make sure it’s fulfilling its role or helping you achieve your website goals.
A wireframe is a two-dimension diagram detailing the structure of a web page.
Typically, a wireframe is used to make the priority of content, available functionality, space allocation, and the intended behaviour for any given page.
Wireframe, or wires as they’re sometimes referred to, don’t go into details. They’re all about positions. They don’t include styling, graphics, and colours.
Wireframes are usually prepared by UX or UI designers. Their simplicity means they can be used by absolutely anyone to communicate their requirements.
When used by a website planner, they’re basically to raise issues that require answers before the web designing process begins or before content is created.
Good website planning entails drawing up wireframes for both mobile and desktop versions of your website.
8# Content Planning
It’s hard to imagine a website without content.
And by content, we’re not just talking text, but images, videos, audio, illustrations, and more.
If anything, your website design planning document wouldn’t be complete without you providing a detailed guide on how content should be used on each page.
You want to begin by outlining the different types of content that you want to see on each page. You’re doing this to inform both the design, development and production team of the structure that you have in mind.
Content production is the most tiring and drawn-out part of the web creation process. Because of this, web owners usually leave it out until the very end of the web designing process.
This often leads to unnecessary delays or loss of momentum in their projects.
9# Website Specification and Functional Requirements
You’re not just scoping your website as a whole, but each page.
Outline the requirements for each page.
Look around at the different types of websites in the digital space. One thing you’ll notice is that most of their pages fit within one or two of their templates.
It goes to show most of them weren’t planned at all. The owner didn’t take time to visualize each page and list down its requirements.
Don’t expect your designer to do everything for you. After all, they cannot read your mind to figure out what you need.
If you’re looking to produce long-lasting results and create a website that will grow and evolve as time goes, you want to start by providing as many details as you possibly can on each page.
Every page must have a goal. After that, you want to narrow down to specific details about the page, including metadata, titles, and the functionality required.
15 Frequently Asked Questions About Website Designing Process
Already, we have discussed the process of creating a website plan. You can now easily tell whether a website was professionally prepped for by looking at the layout and other highlighted elements. As your business grows, you will need to redesign the website to increase your customers’ needs.
Creating a comprehensive plan to guide you through the process is important to avoid common pitfalls such as a drop in sales, ranking, and organic traffic. Today, we look at 15 frequently asked questions about the website redesigning process.
What is the Cost of Building a website?
The cost of building a new website or redesigning the existing one is dependent on the requirements. The estimated project duration is also another major factor that influences the total cost. Different website developers have varying rate cards, but the average cost ranges from SGD 16,000 – SGD 60,000.
You may have to pay more if the website needs a complete overhaul and not just tweaks on the main pages, such as the service pages and homepage. We recommend working closely with your digital strategist to know the specific areas to be improved or deleted.
MediaOne Marketing is best known for offering business-specific website development services that help clients save money and get a custom web design. We are happy to come up with a plan that best suits your business and budget.
What does a Website Redesign Process Entail?
The first stage of a website redesign is a kick-off meeting where the account manager, website designer, and content director meet to deliberate the project’s details. The scope of work, design recommendations, and objectives are discussed to ensure that everyone involved is working towards the same objectives from the onset.
After this meeting, the designer will create a new logo (if you agree to change the existing one) and a homepage. This step will help get the ball rolling, and the content director sources for search engine optimised content for the service pages.
Once the new designs and content are approved, the website development team will start implementing the changes on the website. An SEO audit and A/B tests will be done to benchmark the changes and highlight areas that need improvement.
The final stage is launching the website and re-optimising the digital marketing strategies to match the new website. For example, the new logo will replace the existing one on all your social media pages to avoid confusing target customers.
Which Platform Will My Website be Built On?
WordPress powers 39.5% of all websites in the world. Thousands of website developers prefer this content management system as it is user-friendly, secure, and scalable. Business owners can implement changes to the site by adding fresh content even if they have no design or coding experience.
Your website will be built on WordPress or any other credible content management system whose features match your unique business needs and expectations, such as FusionCMS. It is important to discuss the CMS functionality before its installed to avoid any inconveniences down the road. Insist on a CMS that gives you total control of your website.
Will My Redesigned Website Set-Up for SEO?
SEO is the pillar of your online business and determines how your website is ranked in search engine results pages. Google has a set of requirements that all websites must adhere to for high ranking and avoid penalties.
All website redesign processes adhere to these requirements, so rest assured that the web development team will not use bloated code and blackhat SEO strategies to beat the bots. An SEO audit will also be done at the end of the website redesign process to ensure that all elements are optimised and working properly.
Can I Fix the Old Website Instead of Creating a New One?
Firstly, a website redesign is only recommended if the existing website is functional but needs to be improved. Remember, a website is more than its aesthetics and appearance. It is also the technology and site architecture behind it. Both can either hurt or enhance user experience and Google rankings.
If you want new content or graphic updates or are worried that your website does not match your competitors, redesigning is ideal. However, consider investing in a brand-new website if the website has been underperforming for years and you intend to change your business structure.
In addition, modern websites are more functional and accessible than conventional websites. Updating and maintaining the new generation website is easy and can be done without any HTML or website development skills.
Again, consult widely and involve all the departments, especially the finance department, to avoid plunging your business into financial turmoil. Concisely, a website redesign can be a temporary solution to help you stay afloat and accrue enough resources for a brand new website.
Whom Can I Contact to Know the Website Redesign Progress?
The best website design agencies have a team of professionals that enable them to handle multiple projects simultaneously. Ideally, your project will be assigned to an account manager who has the necessary skills, expertise, and capacity. The account manager will keep you abreast of all happenings and ensure you get the best experience.
In a nutshell, your account manager will be the bridge between you and the website developer and content developers. They will always be available to respond to your queries and ensure the set milestones are achieved.
Can you Help with Content Creation and Graphics?
Copywriting is one of the most sort-after skills in the digital world of business. Your new website needs fresh content to convey the intended message to the target audience in the best way possible. If you don’t have an in-house content writing team, we can assign the task to our in-house copywriters or outsource it to a team of professionals we have collaborated with for years.
Graphics help enhance the appearance of the website. Graphics also pass the message better than blocks of text. The website design agency is happy to create custom graphics for your business to ensure that the final copy stands out from the crowd. Be sure to approve them before they are added to the pages to confirm they resonate with your brand’s vision and goals.
Which is the Best Platform for my eCommerce Website?
Unlike before, many eCommerce platforms allow entrepreneurs to create online stores in different niches. The best and most preferred two are Shopify and BigCommerce. Each platform has its features, highlights, and downsides.
Learn everything about each platform on the list before making your final decision. The skills and expertise of your digital strategist will come in handy when making this decision. Both BigCommerce and Shopify are SaaS platforms with the ability to help you re-launch your revamped website.
For example, customers will like the convenience of shopping via mobile devices and the multiple payment options. If you are new, we recommend starting with the free or trial package and then progressing to the premium packages that offer additional features.
How Will I Add Products to the New Website?
The process of adding products to the new website depends on the eCommerce platform selected. Leave this role to the website design team and the content team. The two will work together to add the product images, details, description, and CTA buttons.
However, it is also good to learn how to do it yourself as you may decide to add new products as the business grows. Learn how different information, photos, variants, and reviews are listed alongside the product. You will make mistakes the first time, but don’t worry, practice makes perfect.
What is Important When Building a Website?
As mentioned earlier in this article, there are many factors that you need to consider when building or redesigning a website. The most vital thing to remember is to create a clean design that is appealing to the target customer and in line with the recommended practices by Google and other search engines.
Concisely, a professional website design draws in customers, and its content is easy to read thanks to intuitive navigation. So, make sure that the website design is clean to provide the best user experience possible and transform first-time customers into loyal customers and brand ambassadors.
What are the Most Important Elements of a Website Design?
This question is related to the previous one, but it will help point you in the right direction. Here are the top ten most important elements that the final website design should have.
- Intuitive navigation
- Stellar visual design
- Search engine optimised content
- Seamless access to information
Use this list to determine the quality of the website design service offered by the agency. Please don’t hesitate to ask for clarification or changes if anything seems off. All the ten elements will work in tandem to muscle up your business past the competitors.
What Does Website Responsiveness Mean?
In the first quarter of 2021, 54.8% of the global web traffic was from mobile devices. As an online business owner, you cannot afford to ignore the importance of making sure that your website is accessible on mobile.
Back to your question about what website responsiveness means. Simply put, responsiveness is the ability of a website to adapt its pages to different screen sizes. Customers should be able to read and place orders on either desktop or mobile devices.
The user experience or shopping experience should be the same regardless of the device used to access the website. Google recently confirmed that mobile-friendliness is one of the factors used to rank a website.
Check how the different pages appear on multiple devices and browsers to know if they need to be redesigned. Rest assured that its ranking will improve once you make it mobile-friendly. Sure, it may take a few days or weeks to complete the process, but it’s all worth it, so don’t fret.
What is SSL?
SSL means Secure Socket Layer. As the name suggests, this is a security protocol that allows users to access websites safely. All websites with an SSL certificate have URLs that look like HTTP:// instead of HTTP://.
The data transferred from the website to the user’s device is encrypted and unavailable to any prying eyes. Google and other search engines consider websites with SSL more secure and alive to their user’s safety than non-secure websites. As a result, they reward them with a higher ranking.
What is User-Experience?
UX (user-experience) refers to how the users interact and feel about the website as they browse and interact with the various elements. It focuses on understanding the website visitors, their needs, values, limitations, and capabilities.
What is the Difference Between User Experience (UX) and User Interface (UI)?
UX is the abbreviation of user experience, while UI is the abbreviation for the user interface. The main difference between the two is that UX focuses on the experience that potential customers get when browsing a website, while the user interface refers to the aesthetic value and elements.
UX and UI designers work together to ensure that all website elements are fully functional and complement each other. If the UI fails, the customers will get a poor user experience, resulting in a low conversion rate, high bounce rate, and consequently, a low ranking in SERPs.
(NB: The existing article doesn’t have a conclusion, please use the content below)
Having a comprehensive website plan and sticking to it will ease the redesign or development process and help you maximise your budget.
MediaOne Marketing is well-known for providing the best website design services to businesses across the globe. Our services are customisable and affordably priced to suit your budget and requirements.
Get in touch with us for a free and non-obligatory consultation session. We look forward to being at your service.