Early website with no CSS styling

How to Revamp Your Website Without Changing Your Theme

Posted on Posted in Content Marketing, Inbound Marketing, SEO

Websites have come a long way since 1994 when they were text-based. Adding styling elements and images made the user experience far more rich and engaging. It has also created potential headaches for anyone managing their own website. The truth is that overhauling your site need not be a headache. With careful planning you might be able salvage time and resources and still end up with a completely new design.

Website Design: Form Should Follow Function

Ultimately, you need to start with an end in mind. Your web presence should have clear goals (e.g., facilitate transactions, share information, increase branding, customer support, etc…). This article assumes that you have already identified the purpose of your site and you are simply making changes to improve performance.

Layout and styling can make a huge difference in the customer experience. Today, most of the styling elements of a website sit within the Cascading Stylesheets (CSS) file. This tells the browser how it should display text, but can can also do some basic interactivity with the user without the need for JavaScript.

You might surprised how powerful CSS actually is on its own. CSS Zengarden is a website which highlights the scope of CSS. All of the underlying HTML code is identical between the sites. The only changes are done via CSS.

The image on the left and and the image on the right have the same content. The only difference is styling. Depending on your brand guidelines, you could make changes to your site entirely on the styling side to improve your user experience and your business goals.

All of these screenshots have the exact same HTML, the only difference is the CSS styling

Another Example of CSS
Source: http://www.csszengarden.com/212/
Yet another example of CSS power
http://www.csszengarden.com/219/

 

 

 

 

 

 

 

 

…to build a theme on…

For some business owners, the entire website is built and maintained by a third-party. In other instances, the site is maintained in-house. Usually, if you lack the expertise or time to do coding for a site, you will use a theme.

A theme is simply a prefabricated set of rules of how the website will behave. Think of buying a house with some unchangeable basic design elements rather than building a house from scratch.

A theme allows you to change layout, but won’t allow you to really change the functionality beyond a certain range. The biggest downside to using a theme is that it can be a heavy and slow site.

The upside is that it can be implemented in a relatively short amount of time. In addition, most commonly used themes have extensive document and active user forums that simplify troubleshooting.

In general, the default theme includes all sorts of things you COULD use, but may not necessarily WANT. The unintended consequence is a bloated site with all sorts of things running in the background (however, there are simple things you can do to fix and optimize your theme-based site).

If you have the time, budget and staff resources, a customized site could be the best way to go. The key here is to have the right staff in-house to handle ongoing maintenance and make minor changes.

However, there are perfectly legitimate reasons why you would use a theme instead of having a site built from scratch.

It should be noted that some major corporations use WordPress themes for their sites: Chicago Sun Times, Sony Music and Bloomberg Professional sites are all run on WordPress Themes.

So what distinguishes their sites from yours? Likely two very important factors. The first, is planning. The second, is a thorough understanding of theme functionality.

A Meeting Without an Agenda, is a Social Event

Without a plan, or structure, you’re not going to have a good experience for your user. You won’t be able to consistently measure performance and you’ll have no one to blame but yourself when you don’t get the results you want.

Launching a website with no clear plan or architecture is a recipe for disaster. As mentioned above, the prerequisite to a high-performing site, is a good plan. You need a clear idea of what action you want the user to take when they arrive at your site and a clear feedback system to alert you if things are not working.

However, even with a good plan, implementation can go awry if you don’t have a good understanding of the particular theme functionality.

Example: Website Overhaul with Same Website Theme Template

Recently, we had a client who wanted to overhaul their website. They are a Singapore-based fintech start-up targeting other businesses. As a B2B company, there are certain functional requirements that differ slightly from a B2C company. Yet, by and large, sites targeting consumers or businesses share 90% of the same requirements.

In this case, the initial project seemed to revolve around content and copywriting. The old site didn’t have clear messaging and site visitors gave feedback that they weren’t sure what their required action should have been.

The team from Perioko presented the client with a range of options, from simple copy changes to a new site. After a review of their budget and objectives, the client wanted to proceed with a new site with a different WordPress theme.

At this stage, we did another look at the old site and the theme that was being used and concluded that it had the functionality they needed.

The risk in migrating from theme A to theme B is mostly around losing data. In addition, it could delay the migration process if your team is unfamiliar with the new theme. In this case, we decided the problem could be solved by using the old them, but changing the site structure and leveraging a few plug-ins to add a few features.

In the end, this project involved keeping the exact same theme, but drastically improving the functionality as well as new copy, images and styling elements for the site.

Website Refresh Without Changing Theme

Website Refresh without changing Theme

The major changes were the following:

  • Multi-page user experience instead of single page navigation.
  • Increased use of white-space to draw attention to calls-to-action
  • Messaging targeting specific audiences (e.g., bank partner, merchant, consumer)
  • More detailed use of headlines, meta descriptions and keywords to improve SEO

So what impact did these changes have? The new site went live on 1 March 2017 and within 20 days of changes, the client had an increase in organic leads, banks reached out to them to find out more information. 

For a variety of reasons, the new site was unveiled with minimal fanfare. There was no other display or social media activity during this period, so leads generated can be directly attributed to the site changes. However, the new website also coincided with a change in the corporate branding and logo. While it’s possible that improved performance could have been influenced by that as well, it’s unlikely to have been the driver of improved performance.


Bounce rate has fallen from 83% to 63%
Bounce rate has fallen from 83% to 63%
Avg daily users has risen from 17 to 27
Avg daily users has risen from 17 to 27