Ways to Approach a Website Redesign

It’s not uncommon to see a redesign happening for any given website every 3 to 5 years or so. We can look at website redesign in a few different ways, but in short, it’s “a new look” in which one can change:

• Visuals only – content, pages, and everything else remains the same, but the site looks more modern now.
• Content and visuals – this would be the above + content changes like landing pages, reordering of articles, new types of data, and more.

The first one is way simpler for a designer to jump onto as there shouldn’t be that much content that needs to be readied. Which brings us to the first phase of website redesign, once it has been decided of course:

Create New Content or Use the Old

A designer needs to know what content he or she will be working with. For instance – what would be the title of the homepage, would there be any subtitles, paragraphs after it, maybe a list, a video, an image? All of this is information the designer requires to showcase anything really.

And this is the first question to ask when approaching a website redesign – will the content of the existing site remain as is or new will be written. If it stays the same, then all the client needs to decide (or the marketing team for that matter) would be the overall direction.

If the content is to be reworked though, the designer would have to wait for the new text to be ready and finalized. One way to present it is via wireframes where it is just boxes with text, which the designer orders or it would be a simple PDF with content per section.

Of course, once the whole website is ready, the editorial and marketing team would have the freedom to work with the content and do edits. Although having a copy of the content from day 1 will also allow the designer to make the right decisions for the visual elements that would accompany the content. Be it length, amount of headings, lists, features, media, and more.

Decide on the Visual Style

Next would be “How should it look?” This seems like a question the designer would answer, but that is not really the case. In fact, this is a question the designer asks the client more often than not.

The visual direction might be dictated by the rebranding of the company, which could be to modernize the website and fit a specific demographic or it could just be a new and updated look to the site as a whole. Sometimes, the website rebuild, the designer’s concepts, all could get in motion a rebrand of the company, not the other way around. And we are not always talking about large corporations here, smaller brands might also become inspired to rework their packaging, social presence, and more all because of the web designer’s work on their new website.

This is also the phase where designers often call their products “a concept”. Which is another way to say that it’s all about finding the correct language, look and/or feel. During such a phase, designs usually revolve just around the homepage or the main view of the site/app.

Depending on the commission/scope, there could be many concepts created. With such concepts, the developers, client, marketing teams and designers can discuss which one is the way to go, what type of elements work well together, and would there be any content changes or technical concerns?

The concept stage is maybe one of the hardest too, because this is when most of the decisions are made.

Here are example questions that a designer might need to answer:

• Would it be image heavy, are the graphics clean/minimal looking?
• If it uses graphics, what style would they be?
• What font/s are to be used
• Should the old color scheme be modernized or should a new one replace the old?
• How interactive should the site be?

Depending on the direction, there are a few things to consider in the concepts:

• Should the original feel of the site remain the same? That could be the color schemes, graphics, typography rules and more.
• Should a completely new feel be introduced instead? That would mean that all the constraint a designer would have is the content.

When one concept is picked (which could happen after many revisions), the next stage can commence:

Build the Design Comps

If in the original decision making steps it was decided that content/site structure would stay the same, then the designer’s work is a little easier. All they have to do is turn the old design into a new concept. That means that he/she can generally just go on a page-by-page basis and rework each component to follow the new look and feel. Here is where you would see smaller changes like component rework – spacings, typography, colors, or bigger changes like layout changes – position of elements, order and more.

The important parts of a site redesign are the unique views. As long as a page has a different layout and components, then a design should be prepared for the development team. Design-wise it’s also rather easy to showcase a slight variation as it would only require a copy-paste of an artboard with a minor change to ordering/content, so this is definitely a step that is not worth skipping.

When the designs are completed, they should be double-checked again by the designers and the client as well as by anyone else involved – marketing, sales, developers. This is the final ideal step in any major changes, because the designs are relatively easy to rework/change compared to the development phase.

The Development Phase

This is usually where the designers are done with their work and handoff the website redesign project to the development team. From here on, the designers most often just reply to questions, provide assets, and occasionally design specific component states that are missing from the designs.

Ideally, design changes should not be made during the development phase prior to launching the new site as this often results in delayed delivery or needless stress for all parties involved.

During development, there are usually two ways to approach it:

• A new build
• A rework of the existing site

In the context of WordPress, often a new build revolves around setting up a new project altogether, importing the database from the old site, creating a brand new theme with a clean codebase and implementing the design from scratch. Furthermore, in this case, there would be no legacy code apart from the possible plugins and the integration of the theme.

If there is a very tight deadline, there are a two ways to launch on time with a new theme:

1. Don’t go live with everything on. This is the most reasonable approach. List out the top priority pages and develop just those. Go live with them, then roll out any other features and/or pages in the weeks after the launch.
2. Go with a rough version. This means that you should have all the pages implemented, but not necessarily editable. There may even be a need to hide an element or two, or fix any bugs due to having little time to do testing or simply because you didn’t have time to fix them.
3. Simplify UI elements on the design that would take up most of the developers’ time. For instance, that could be complicated navigation menus (desktop and mobile), maps/toggles/searches, sliders or complex layouts.

Depending on the priorities – the deadline or the quality – the client should choose which of the two the agency or freelancers should work on first.

However if the rework has to happen gradually over a few weeks, then the agency or freelancer will have to often rework the existing theme. Here, the developers would most often create a new stylesheet for the new site that can be migrated when it’s all done and start rebuilding existing templates starting from the header/footer.

By replacing page by page and rolling out updates, the site would look inconsistent with the old and the new look across the pages. While not a website, Windows 10 is an example of this:

Going Live Phase

This is the long awaited phase of going live. In general, most of the QA and reviews of the site match the same steps as going live on a brand new website – lots of testing, clicking everywhere, making sure each menu item works, that pages function well, that content is good and that all integrations are functional.

The main difference between a redesign and a new site is the existing content, especially when there have been changes in the structure of the site. Would old URLs function? Would there be lost content? Has all of the old data been migrated recently? There is quite a long “launch day” list to go through, for which it’s safest to use the services of a good web development agency.

Summary

The website redesign is a long process that involves many people. It also has a lot of difficult questions to answer, and technical hurdles to overcome. Thankfully, most of the time. This change turns out to be very positive for a brand.