EDTECH WEBSITE REDESIGN PROCESS AND BEST PRACTICES

At some point, every company comes to realize that their website is no longer relevant and doesn’t work as it should. And it’s not about the effectiveness of marketing strategy or ad campaigns alone, the problem lies much deeper and requires website owners to introduce more significant changes to a website.

But what actually to do in this case? Do you need to completely take your educational website apart and rebuild it from scratch or will the basic makeover be enough? In this blog we’ll try to answer these questions, show what makes the process of website redesign different from website refresh, as well as provide important educational website redesign tips.

Educational Website Redesign vs Website Refresh

Before we proceed to the subject itself, it’s necessary to sort out the main differences between redesign and refresh as these terms often get confused with one another.

Website refresh. This process involves introducing minor enhancements to the website and does not heavily influence its structure. It can be considered as a ‘quick makeover’ that leaves the technical base of a platform unchanged, only slightly sprucing up its appearance. Requires minimal investments to do. The main characteristics of the website refresh are:

  • Low initial investments;
  • Relatively short delivery timeline;
  • Small code adjustments;
  • Limited design customization.

Website redesign. The more complicated process involves extensive changes in website structure, content, navigation, etc. It also includes a complete makeover of a website appearance and thus requires significant investments to be made. The website redesign normally follows the establishment of a new marketing strategy or rebranding process. When doing a redesign, the website owner should be ready for:

  • High initial investments;
  • Long delivery timeline;
  • Full code customization;
  • Complete website design change.

Now after we get through the definitions of both approaches, let’s look in more detail at the redesign process, in particular the reasons that can make the website owner decide to start elearning website redesign.

When Does Your Edtech Website Need Redesign

Stagnancy

If your site hasn’t received any updates from day one, looks old, and struggles to provide convenient UX, then it’s time for an upgrade. Among the most common symptoms of the design obsolescence are slow loading speed, text overuse, and poor mobile responsiveness.

Slow loading. Basically, the longer it takes to load your website the higher are chances that users will bounce off — without waiting for a page to fully load. The rapid development of digital technologies made users accustomed to high internet speeds and less tolerant of slow website performance.

Text overuse. Adding too much text on a page was a common practice 10-15 years ago, and it is still to this day, especially in the educational industry. Lots of visitors will find a website with lots of textual content hard to interact with, and abandon it right from the main screen. Due to large amounts of text, users won’t be able to spot important links, CTAs, and understand what you want them to do next.

Mobile responsiveness. According to Statista, in the Q1 of 2021, 54.8% of the entire web traffic was generated via mobile phones, and this trend will only continue to grow in the future. This means that mobile-friendly designs are a must for modern websites. So if when your website gets opened on a mobile phone the text font becomes too small, media fall off the display, or scrolls become unavailable — this means it’s time to update.

Decrease of online sales

Buying isn’t a straightforward process, and often people take several touch points before they buy anything. Making sure that the customer journey is as smooth as possible is especially important for EdTech and MOOC platforms where users make their decision regarding not physical but digital products.

This is where credibility and current level of UX can make or break a sale — according to Credibility Research carried out by Stanford, 75% of users say they judge a company’s credibility according to its website design. On the other hand, the initial opinion about the website gets normally formed in less than 50 milliseconds.

So, if the website neither looks professional, nor offers all the needed information, prospects won’t trust such a company. This, in turn, will lead to the decrease of conversions. Aside from that, websites with obsolete design also struggle to get properly indexed by search engines. Low ranking means less traffic to a website — less traffic limits the amount of leads that you can generate — less leads means your website isn’t using its potential to the fullest.

Full rebrand

A website redesign is required also in case of acquisition, merger, or change in branding strategy. Rebranding would typically assume changes in visual identity, logo, color scheme, storytelling, or even renaming a company/platform.

It’s important to note here that oftentimes with the rebranding, companies try to adjust their mission, values, and vision, enter new markets, or even target a completely new audience. In terms of a website this could mean that — aside from media, colors, and text copies — the entire sections can become irrelevant and will need to be replaced.

Thus, the basic refresh won’t work here and the platform owners will need to approach the rebranding process holistically — reconsidering customer journeys, fine-tuning UX, adjusting website structure, etc.

Outdated technology

All edtech projects rely heavily on technology, which means that — in order to correspond to modern trends and market requirements — over the course of time, their techstacks may change significantly. For the websites this also means that its components will need to be updated/redesigned once the change in technology occurs.

Another reason for website redesign may lay in the fact that lots of the older platforms were built using now outdated technologies (like flash), which cannot be properly read or processed by search engines. There also can be old plugins that website owners haven’t updated in years. Because of all these issues the website can start to experience performance issues and will struggle to provide a significant level of security to its users and administration.

Advanced integrations

Edtech websites normally incorporate dozens of third-party integrations that all come from different vendors. Here, each vendor may have its policy regarding the tech that needs to be utilized by a website in order to support their solution.

Most commonly, all these requirements will be wrapped around some modern technologies though. So, in order to be able to integrate a payment gateway or a simple live chat software, you’ll need to make sure your website architecture is compatible with those solutions.

It might not be obvious from a first glance, however, introducing third-party plugins or other types of integrations may reshape the customer experience completely — like adding a live video chat can change the sales funnel, marketing integrations can influence website’s structure, navigation, etc.

Digital strategy makeover

Marketing strategy of your business and the website itself are always inextricably linked to one another. Whenever big changes occur in your ‘game plan’, they will most probably require you to redesign existing educational website as well.

For example, incorporating a new SEO strategy may involve both small changes (like adoption of the new components for site pages) and big ones (like completely rebuilding website structure). Content marketing may influence the site structure as well: content audit can inform platform owners of content gaps, media overuse, etc. All these findings will affect the appearance of site pages too.

Educational Website Redesign Process

Benchmark Your Current Metrics

The very first thing you want to do when preparing for a website redesign is conducting a website audit to figure out where you are at the moment, and in which directions you can move from there. You want to precisely know the current state of all integrations and website assets to understand what’s working and what’s not working.

Aside from that, you also should analyze website performance and current metrics, such as number of visits/visitors, bounce rate, linking domains, keywords, page indexed, sales generated, etc. Ideally, you want to come up with a spreadsheet that details performance (metrics) of each individual page of a website. This document will serve as a reference, helping you conduct the redesign process with less performance losses.

NB!

  1. 1
    Make sure that after the redesign process the same tools are used for measuring the website current benchmarks. Otherwise, comparing reference (pre-redesign) benchmarks to current (post-redesign) ones may become senseless.
  2. 2
    Before introducing any changes, make sure to back up the current version of the website so you don’t lose any data or components after moving to a new design.

Find Most Valuable Pages

Even though the redesign process may involve significant structural changes, it should never cause damage to those assets (pages) that are most valuable in terms of performance.

What is already working well should continue to do so once the redesign is done, so we recommend to refrain from blindly redesigning everything as it can cause irreparable damage to the platform.

You need to identify your most valuable pages and make sure that you treat them as carefully as possible — to keep the website from losing its positions and conversion rates after the redesign is done. It’s also important to identify relationships between different pages to understand how changes applied to one will affect others.

No doubt that there may be lots of less significant pages that you can simply tear apart and redesign from scratch (or even delete), however, make sure that you always conduct a thorough analysis first.

Understand User Journey

Users journey covers all steps that users ‘take’ on site to make a purchase (or buy a course in case of educational platforms). Understanding how users make their decision is very important when doing website redesign as it is the only way for you to figure out whether the changes you are about to implement will match user’s expectations.

By mapping out the user journey it is also possible to find gaps and barriers that stop users from performing target actions. This information can then be used during a redesign to understand what needs to be added (or removed), and how user behavior correlates with your website structure in general.

To figure out how users interact with the platform, interview them asking a few questions about their experience on site, for example:

  • Where do you get stuck on this website and/or experience issues?
  • What do you like/dislike about your experience on this site?
  • Does the experience you get with this site on mobile differ from experience on the desktop?
  • What stops you from [target action] ?
  • What made you decide to navigate to page X, Y, Z…?

Another effective way of mapping out the user journey is website heatmaps: these can help you visualize user’s interactions with different elements on the page. By using the information you can better shape the goals of the redesign strategy.

Analyze Competitors & Gather Inspiration

During this step you basically decide how your updated website will look like. By gathering inspiration from similar websites and analyzing industry standards you’ll be able to come up with the unique style for your platform. However, here’s one trick to be aware of: don’t try to blindly copy everything because you never know how well this or that concept works on another website.

Instead, pick two-three websites and sit down with your team to discuss what you like, and what you don’t like, how incorporating a particular idea will influence UX or your business strategy, etc. Ask yourself what feel you want a user to get once they open a platform, what features should a website offer, what type of media should be added, etc. Gather inspiration but always be selective and base decisions on the needs of your audience and product in the first place.

UX/UI Stage

This is where you or your team get to create a design itself. The best way to approach this process is taking it slow — instead of redesigning everything at once, introduce changes incrementally, in orderly fashion.

Start with wireframing — a process during which you establish wireframe (structure) for each of your pages. Wireframes come in a form of sketched out black’n’white schemes that show how the content will be laid out on the future page.

Once that’s done, design a few sections of a page to understand whether the obtained result matches your vision. By doing so you can save yourself a time designing dozens of pages just to find out that some ideas, in fact, aren’t working. So, moving through the process step-by-step will allow you to revise and adjust the visual style on the go.

Development Stage

The final stage of the redesign process is where all the code work happens, and previously created mockups (designs) get transferred to CSS/HTML. This step will take a big chunk of a time as here aside from the development process itself you will also need to check lots of other aspects, like cross-browser compatibility, mobile responsiveness, correct functioning of all integrations, features, etc.

You’ll also want to make sure that the SEO strategy is correctly implemented on your new redesigned platform: web pages contain correct title tags and meta descriptions, images are optimized, website load speed is high, website utilizes internal linking, and contains relevant keywords.

Launch New Website

At this point you’ve reached the most anticipated moment of the redesign process and can finally launch your fresh site. But before that, however, it’s important to do a few final checks to ensure everything works as it should:

  • Check whether there are any broken links, media;
  • Have the 301 redirects set in place;
  • Make sure that all pages are rendering;
  • Install all necessary tracking codes;
  • Set up analytics and heatmap;
  • Update the sitemap in Google Search Console, etc.

After the website launch you can start collecting user data, assessing the performance of the new website structure/design, testing different layouts to improve UX and carry out other related activities that will help you boost site performance.

Tip: in order not to drown yourself in testing hundreds of design ideas and website pages, pick 4-5 the most important pages and work on those first.

How To Budget Edtech Website Redesign

Whenever we at WTT Solutions are approached by a new client with the question regarding the edtech website redesign costs, the one realistic answer we could give is: “It depends”. In our opinion, making people knowledgeable about the aspects that influence the redesign budget is more helpful than giving a broad estimate like “from $5,000 to $150,000”.

In order to budget your project correctly and avoid unexpected overruns, you need to know where your resources will be going to. Here are the six main components that normally influence the costs of the edtech website redesign process:

Redesign strategy

Putting together a redesign strategy helps to set a foundation for an entire project. It will normally include expenses connected with interviews of all stakeholders, audit of the plugins and integrations, analysis of current metrics and overall state of the website, etc.

In other words, the amount of resources needed to be invested into the establishment of redesign strategy will be identified by the number of deliverables produced. Normally, these are:

  • Value proposition map. Also referred to as ’empathy map’, this document encompasses user interviews and helps to define their fears, pain points, and proposes ways of solving those.
  • Proposed website structure. This document contains a complete list of website pages that will make it into your new redesigned website, and also defines their place in website navigation.
  • Strategy for high-level pages. This document details layouts of each of the high-priority pages (like the main page), describes user journeys, lists recommended components and design elements that need to be added, and sets primary and secondary goals for each of those pages.
  • Keyword analysis. This spreadsheet details all keywords that you want each of your pages to be ranked for. It also includes the analysis of keyword strategy adopted by your competition.
  • SEO strategy. This document may come as an addition to the keyword spreadsheet, and contains the URL structure, SEO titles, metadata recommendations, and alt title suggestions for media.

UI/UX design

Estimating the costs of the design part itself might be the most subjective thing to do. Here, the budget will depend entirely on the project requirements, complexity of animation, layouts, graphics, etc. Don’t forget also about the number of pages that need to be designed.

Another side of the coin is imagery — what media is required, will it be sourced from stock websites or created from scratch, do we need a professional to edit stock photography or not, and so on. The ultimate recommendation for keeping budget within acceptable range would be not overthinking and overdoing designs — in any case, you can always go back and add some custom design elements to your pages later on.

Custom functionality

This aspect of the redesign process can really affect your budget as more complicated tech stacks usually demand for significantly higher investments. Today, platforms like Coursera, Udacity, or Skillshare rely on hundreds of third-party tools and technologies in their daily operations.

You will be totally correct if you say that there are lots of free plugins on the market that you can use; however, if you’re looking for some specific functionality (like the advanced reports), then most probably you’ll need to opt for a paid technology.

Content

In general, the term ‘content’ encompasses several activities, each of which can affect the budget, either decreasing (if activity is carried out by a website owner) or increasing it (if activity is carried out by a dedicated professional). So what are these activities?

  • Copywriting. This is basically, the creation of all page copies, blog posts, texts for popups, etc. Most often, copywriting is carried out by a dedicated copywriter.
  • Content implementation. This is the process of posting or adding ready content to a page and can be carried out either by a copywriter or website owner themselves.
  • Content review. Large companies normally have a dedicated copy editor who reviews the content before it goes to a website. In small and mid-sized companies, this process can be carried out by the website owner too.

Content production area is the one which many website owners tend to invest a minimum budget in during the redesign process. Even though it’s okay to try to save up some budget here, it’s still highly advisable not to push the budget down hard as it may damage the website appearance in the end.

Website size/number of pages

The number of pages directly affects the length of the redesign process, i.e. the larger your website is, the more time it will take to update it. To make sure you allocate the budget wisely, get rid of duplicate pages or those that basically do the same thing. Also keep the website navigation easy for users to operate as they can easily get lost among dozens of pages in dropdown menus.

Talent in charge of the redesigning process

This will be a team responsible for the implementation of your website redesign plan. Here you can choose either to assemble an in-house team or go outsource. With an in-house team you get more control over the project; however, be ready to account for all the associated expenses, such as hiring, payroll, office renting, energy bills, etc.

On the contrary, when hiring an outsource team, you can achieve the same level of control (when working with professionals) while paying only for the amount of time that team spent developing your project. You won’t need to bear any additional expenses. In general, going outsource will cost you 2-3 times lower compared to the ongoing maintenance of an in-house team.

Redesign Your Website Without Any Loss

The redesign is a complex task that needs to be approached carefully. It requires you to have a clear edtech website redesign strategy that would precisely detail steps to redesign elearning website. Only by knowing exactly what you want to get — and how you will do that — will allow you to carry out the website redesign with minimum loss.

In this educational website redesign guide we tried to detail the best practices of the redesign process as much as possible, so when it’s time for you to do a website makeover, use this information to tackle any challenge that you may come across.

If you need help with planning edtech website redesign, or are looking for the consultation regarding the development of your edtech project, contact us. At WTT Solutions we’ve accumulated 5+ years of experience developing edtech products for private organizations and established educational institutions. Check our portfolio — there you’ll find edtech products we’ve worked on and technologies we use.

To get in touch, simply fill up a contact form that can be accessed via a dedicated button in the top right corner of the page, and one of our managers will respond to your inquiry as soon as possible!


Comments

Leave a Reply

Your email address will not be published. Required fields are marked *