Web Design Strategy for Successful Websites

tIn building a website, it’s highly recommended that you have a strategy in mind. A strategy that guides the web design process to efficiency and meeting the website goals. This means the web design strategy is aligned with the website communication strategy: the way of communicating with clients, and the manner of transmitting the company message to clients should be in line with the website design.

In other words, making your website look fine does not, in any case, conflict with the website purpose and objectives.


We’ll take the web design strategy step by step and show you how to create one and start on a solid basis in building your new website:

Keep in mind that a website is the carrier of the message that goes from one company to its potential clients. So, it’s obvious you need to first perfectly define the company who transmits the message and the potential clients who receive it.


1. Create a unique persona representing your brand


As much as buyer personas, your strategy needs a seller persona, that’s exactly the company profile you want to market in the website. Your company has to be defined through some personality traits (young and creative, established and well-reputed, official and serious, professional and friendly, etc.). Besides the personality characteristics, the seller persona should also integrate a set of colors, impress through a certain mood, express through a certain “voice” and build trust through key elements in website.

Depending on the findings at this point, you’ll note down some website characteristics that reflect this brand persona.

The brand persona should be presented on a card, in a similar way to the buyer personas.

2. Create buyer personas to be strategic


This is one of the first steps in creating a website design strategy. You need to answer questions regarding who the site is addressed to.

Buyer personas might be cards containing information on demographics, psychographics, life condition, budget and profession of the target audience. The technique helps you segment your audience based on such criteria, and create the message according to these findings.

Example of buyer persona:


design buyer personas

Source: https://www.flickr.com/photos/rosenfeldmedia/9203796918


Buyer personas are useful for segmenting the public and configuring the right message that covers the whole area of people with different characteristics that are inclined to buy from you.


3. Figure out a buyer’s journey, within your web design strategy


To connect company and potential clients, you need to make visitors pass through key steps in browsing your website. This takes the form of the buyer journey, and accompanies the decision-making process, from research to actual purchase.

The buyer journey should include the following steps:

  • Attention
  • Interest
  • Decision
  • Acquisition

(AIDA model)

As the message will be deployed across multiple pages, it’s important to mark the above-mentioned steps in key locations of the new website.

Here’s an example of the buyer journey:


figure out users' journey, as part of your web design strategy

Source: https://www.flickr.com/photos/briansolis/5909243790


The buyer’s journey is important to engage users at every stage, and move them along, from the consideration stage to making an acquisition.


4. Not the least important, study the competition


It’s essential to look at the competitors’ websites. What are they doing well, what improvements should you bring to the market, how might your offer and your website be different from the competition’s?

Studying the competition can have some advantages, such as:

  • Relying on previous research competitors made to find out what works well and what doesn’t
  • Discovering what flaws and drawbacks competitors have, and how you can compensate for them
  • Finding out how you can fulfil some uncovered needs onto the market, which competitors haven’t covered
  • Identifying what can make your website different, and stand out from the competition, to the point of gaining solid positioning in users’ minds

5. What’s the website goal? (Fundamental for your website design strategy)


It’s time to ask the most important question: what is the website built for?

A website goal can take one or more of these forms:

  • Increase traffic
  • Increase leads
  • Convert more leads into buyers
  • Increase user engagement
  • Decrease bounce rate and make users stay longer on the website

It’s recommended that you set one main goal and 3 secondary goals that sustain the main one with adjacent results. Depending on these goals, your website might have a distinct design supporting them, with strategic elements in key locations.


6. Create a mood board is an essential step in your web design strategy


A mood board is a way to collect different creative ideas with a view to preparing for a new project. It’s the first concrete form of a website, before actual web design takes form. It’s used to convey a general idea about how the website will look like.


7. Integrate brand strategy into web design


At this point, you have to define the brand: what is the message and what is the unique value proposition?

To correctly define the brand, you have to answer each of the following questions:

  1. What’s the brand purpose?
  2. Which is the positioning of the brand?
  3. How do you formulate the brand promise?
  4. What are the brand’s beliefs? What traits can be associated with it?
  5. How would you characterize the brand personality?


After having thoroughly answered these questions, you’ll be more prepared to properly integrate the brand strategy into the website design strategy.


8. Create a sitemap that integrates your website goals and the pages hierarchy


To have a referring chart of pages and key points where the brand has put its imprint, you should create a sitemap. This might turn into a reference point, according to which web design develops within the agreed path. A sitemap will be a reference point that serves as guidance for the website development.

Example of sitemap:


sitemap and site hierarchy

Source: https://www.flickr.com/photos/nez/159580421


A sitemap gives a clear picture of the page architecture and of the website structure. It defines whether the website has a flat design or a pyramidal design (a flat design is recommended).

Structuring the information according to a strategy guarantees the efficiency of the web design. It helps working methodically, according to pre-established rules and in consonance with the website communication strategy.

You set up the categories which pages fall in, the various levels of pages, and how each page links to other ones in the website structure.

This also increases the efficiency of modelling the message and organizing information within the whole website.

Having a sitemap is an essential condition of designing websites according to a strategy.


9. Choose keywords to include in your copy


When it comes to search engine optimization, you need to think of keywords. Or better, topics with correlated keywords. In the era of semantic search, you’re free to use synonyms and other words that form a topic through complementary terms.

These keywords have to be included in your copy (text that’s visible on site). Also, you should place keywords in title, META descriptions, heading 1 and heading 2, for better exposure. This way, linguistic terms signal to Google what the pages are about, and help them rank better in search engine results pages.

Also, you should avoid using the same terms repeatedly on two or more pages, as you run the risk of keywords cannibalization.


Each page should have its own specific set of terms, that are different from other pages’, and define the specific topic of that respective page.

But keywords should be naturally included in the copy of every page, and be a good representation of natural language. You address to people as you are a real person, and your language should naturally reflect this. Search engines will more than love this, as their algorithms are based on natural language processing.


10. Think web design strategically. Create site pages as if they were landing pages


Landing pages are independent web pages that can be well integrated into marketing campaigns. They have a meaning in themselves, and they can communicate a message irrespective of the other pages in the website. They contain their own message (which is part of the website message overall) that reaches users who see only those pages in the website. It’s up to them if they continue browsing the website, or they make a purchase based on that convincing page itself.


The anatomy of a landing page:


think web design strategically

Source: https://www.flickr.com/photos/[email protected]/14220966495


The image below indicates which are the required elements of a landing page. Designing each website page as a real landing page will more than help with your marketing actions (each page should have its own purpose).

Therefore, when users land on one of the website pages from Google, they can treat it as a whole source of information, and enter the decision-making process from visiting that very page.

Important: a Call-to-Action should not miss from a landing page, hence from every page in the website. Strategically place content around that CTA button, so it naturally integrates into the page copy, and sustains the message with the incentive to buy.


11. Place one, or better, two CTAs on each selling page


In fact, we highly recommend you consider the latter variant: two CTA buttons on a selling page (one at the top of, another one at the bottom of that page). Since the purpose of the page is to sell, it’s best to make sure call-to-action buttons are at hand whenever visitors are on the respective page.

At the top of the page: maybe visitors are in a more advanced stage of the decision-making process.

Also, at the bottom of the page: after visitors have browsed through the useful information in the page and reached its bottom, they approach the buying stage, so they need a handy CTA button.


You need to catch the user in the decision-making phase they’re in. That’s why it’s best to provide 2 CTA buttons in a selling page, a page whose main purpose is to close deals.

The new trend of placing a CTA button at the end of the menu is more than welcome: it leaves the web designer the sole concern to place one CTA button within the copy of the page (the second CTA is part of the menu).


Example of page with 2 CTA buttons:


CTAs in website pages, based on a web design strategy

Source: https://prezi.com/

12. Strategically design structure of information in each website page


When starting the website design, you should know how to structure information in each page. The goal is to make that page interesting to readers. You should avoid placing whole blocks of text in the website pages.

Structuring information in a web page has to account for: separating ideas through headings (h1, h2, H3…); clearly delimitating paragraphs; underlining important information; marking key terms in bold or italics, and including much white space into the page. Also, illustrations and photos should support text, and reinforce what you present in the web page.


Example of content structure:


structure of information, based on a web design strategy

Source: https://www.siteguru.co/seo-academy/page-structure-and-headings


If you have two or more variants of structuring content within a page, and you’re unsure which to choose, you should think of creating A/B or multivariate tests. This way, you check which version is best, and more profitable for the website. Depending on which version gathers the most traffic, you’ll choose that version for your website and thus maximize profits.

Maybe a different organization of your content, another sequence of arguments might entail different results. And being attentive to this difference in results might indicate you the best and most efficient page variant.


13. Strive to have a mobile-responsive website


Having a mobile-responsive website is key in today’s world. About 58% visitors come from mobile devices, as compared to 42% coming from desktop (according to a study reflecting the 2018 situation).

In this mobile-first world, it’s essential that your website looks well on mobile devices.

So, your web design strategy should take into account optimization for mobile and tablet, and constantly check your website looks fine on smaller screens.


mobile-responsive website

Source : https ://elite-strategies.com/learn-seo/on-page-seo/responsiveness-mobile-friendliness/


To wrap up


We hope this article gave you a clear picture of what the web design strategy should include. It should ease your work and make you design websites with clear objectives in mind. A well-created strategy connects the dots between website as a plan and website as a product. And the product cannot but be excellent, as we mentioned at the beginning…

+ posts


How to Kickstart Your Wordpress Website with No Coding Skills

[Marketing plan included]