Steps To Follow When Redesigning Your Website

Last Edited January 24, 2018 by Garenne Bigby in Blog

redesigning website

Redesigning a website may come out of necessity or it may be purely voluntary. In the long run, a website redesign will save time, money, and effort for the owner of the website by identifying existing problems throughout the process of the redesign. This will ensure that the new website has a foundation that is strong and can be built on successfully. Redesigning an entire website is more than just updating information and changing the color scheme. Many times, a website redesign will also incorporate changing the content on the site, after performing a content analysis. A website should not keep content that is not bringing in traffic. This may happen when content contains incorrect information, is outdated, or simply has the wrong keywords associated with it.  

There needs to be a clear and concise plan in place when undergoing the redesign of a website. This plan should outline the target audience as specifically as possible, in order to be able to successfully design the website to their needs. Accessibility of the website should be kept in mind as well. Shaping the website around the target audience while keeping it accessible will ensure that the website and its content is being exposed to as many people as possible. 

Follow These Steps When Redesigning Your Website:

 

definition and planning Step 1: Definition and Planning 

You will need to define the goals and objectives of the redesigned website, create a project plan, and include any maintenance considerations. Think about the need to plan beyond the launch to ensure continuous maintenance and generation of content. This means using data from the analytics in order to evaluate what is working on the current website and what is not working. These analytics can also guide the technical specifications of the new redesigned website, including operating systems, browsers, and the like. You will need to learn what does or does not work when dealing with editorial workflow and other procedures that are essential for operations. The analytics feedback module can be used to learn which information is benefiting the website's visitors and then you may implement any changes that are needed, based on the users' comments and reviews. This will help to make the new redesigned website better and more efficient for users.  

Consider defining your audience like a character in a book. Create this clear definition as to who the audience is, helping to keep the focus on designing the website around their needs and in a way that will benefit them. Defining the audience in detail like this will help the webmaster to understand a bit more clearly as to what the audience is looking for or hoping to find on the website. 

selecting cms Step 2: Selecting a CMS 

You should select the Content Management System based on the website's needs, such as its size, the complexity of it, the author environment, and the functionality. This decision is crucial—it will have a great effect on every member that is working on the redesign of the website. The CMS will be used by content authors and editors each day after the launch of the website. Close to all of the modern-day content management systems have a plethora of built-in tools that are helpful, but no two CMS are the same.  

stucture review Step 3: Site Structure and Content Review 

This will determine the content that will be included on the new website, and will build the information architecture and wireframes. Using an inventory tool can be the basis for creating the inventory of all content and then performing the content audit. Inventory tools can help you save time, it relieves the stress of going to each page manually and will provide a spreadsheet of all content that is on the website. Analytics will help the webmaster to take the journey that the user is taking. Using behavior tracking, the analytics report can determine the optimum navigation for the website. Don't forget to develop an editorial style guide and other standards for the website. This will make sure that all content authors and editors will keep the content consistent and branded correctly.  

A policy tool may be used to monitor the editorial and web standards, allowing streamlining of the content process, including before and after launch. When these authors and editors are creating the content, they should include important metadata like keywords. An SEO tool can help to understand keywords and how they benefit a website. 

visual design Step 4: Visual Design 

This is when the overall look and feel is created for the new website. An accessibility tool will ensure that the new design will meet all accessibility standards. When thinking about the new design of the website, do not forget that all pages will need to look cohesive. This means that you will need to either use the same layout and colors or all pages, or use a layout that will complement the page highest in the hierarchy (usually the home page) with the same colors. The pages throughout the website should not be totally independent from one another, even if they all hold distinctly different information. Keep in mind background color or pictures, font size, and font color. All of the aesthetic choices for the website would ideally be totally streamlined.  

For those with other visual impairments, links that are underlines will help to stand out from the rest of the text on the website. Other things to consider are those with mobility or motor issues, auditory issues, seizures, and cognitive or intellectual disabilities. To make a website more accessible to this portion of the population, think about the things that would make it easier on them. Pages on a website can be coded so that they may be navigated by a keyboard if necessary, videos with a closed caption will benefit the users that are deaf or hard of hearing. 

Regarding accessibility, the website will need to be designed with inclusiveness in mind. The website should be designed so that all users, including those with disabilities, will be able to interact with the website. How does one accomplish this? Think about the HTML. When a website is coded with semantically meaningful code, blind users will be able to navigate the website more efficiently. Images should have textual equivalents, and links should be named meaningfully. For those who are hard of sight, making text and images with the ability to enlarge makes the website accessible to this portion of the population.  

When redesigning the website, think about not including flashing effects. This visual shock can put those who are prone to seizures at risk. Content should be written in plain language, or should be complemented with a diagram or animation- this will help users with learning difficulties or dyslexia. When all of these things are considered and accounted for, the website then becomes more inclusive to all users, disabled or not, while maintaining the usability for everyone.  

site development Step 5: Site Development 

The new website will be designed with templates, and then will be populated with content. A policy tool will monitor editorial standards and will help ensure that the content follows the style guidelines. An SEO tool will help to make sure that the new website is SEO friendly. Also in site development, you will need to clean up the content prior to migrating it to the new website. Check all spelling, accessibility, links, and the like. This is the point in which the website is actually created. All of the elements that are kept from the old design will now be moved into the new design, and all new prototypes will be inserted into the new design. 

Generally, this is done first to the home page, and then is made into a shell for all interior pages. This shell is the template for the content. It will contain the main structural navigation for the website. Once this shell has been created, the webmaster will take the content and distribute it through the website into the appropriate areas. As the website is being redesigned, the webmaster should have the website available to view, so that you are able to make any changes or corrections that are needed.  

testing website Step 6: Testing 

This is the final review of the new website before its launch. Testing the website will ensure that the website is free of errors and does maintain the quality of the site for as long as it is up. The webmaster will test the complete functionality of the website including forms or other scripts. They will also test for compatibility issues, such as viewing from different internet browsers. The website should be optimized so that it will be viewed properly in all of the most recent versions of the major web browsers.  

Your webmaster should be well versed in all current standards for design and development for web sites. When testing, the webmaster needs to check to make sure that all of the code that is written for the website will validate. When website code is valid, this means that it meets all of the most current web development standards. This is most helpful when checking the website with cross-browser capability. Not only will the website have capability to look appealing when it is checked on all browsers, this will ensure that all information is visible to any user.  

Pre-launch testing is different than post-launch testing, in that the pre-launch is usually done by the web master or those involved with the website. They will often times overlook minor details that can be found when conducting the post-launch testing, done by a random sample.  

launch post analysis Step 7: Launch and Post Analysis 

This is when the website goes live. Using a link checker will identify links on the live website, and point to the development server. Various tools will need to be used in order to ensure that the quality of the website is maintained as more content is added or even updated. A feedback module in analytics will allow the webmaster to continuously improve the new website based on reviews and comments from the users. When launching, a File Transfer Protocol (FTP) is used to upload the site's files to the server. 

After the launch, regular visitors could react either negatively or positively. They might react negatively because their normal interaction flow has changed, and they may react positively because they might feel that the change is refreshing. Wait until initial reactions from regular visitors settle down, there is no reason to celebrate or panic just yet. Once users have had time to learn their way through the new user interface (UI), now is the time to measure the difference using the key conversion rates. 

Testing after the launch is very important. There should be a group of test participants that represent the general population. Do not ask them to complete a goal. Ask them to solve a specific problem that real users of the website might face when trying to complete a goal. For example, the goal may be “see hot to keep up regularly with all of the website's new releases” rather than “sign up for the website's newsletter”. It is likely that the user will look for the RSS feed button or look for the social media sites like Facebook and Twitter. The participant should also be the one doing all of the talking while testing. Make sure that the participant knows that it is the website that is being tested, and not at all their own abilities. After all, the website should be accessible to all persons. The results from the testing phase should be communicated clearly to the market research and insights, marketing, and IT departments.  

After this is all said and done, the website should have a high conversion rate, achieve the outlined business goals, and will be something to be proud of when showing bosses. The design should be newer and better, and should aid in driving the conversion rate by being the best version that appeals to the target audience while still being accessible to all people. 


 

Additional Resources:

The Ultimate 9-Step Website Redesign Checklist

9 Steps to a Successful WebSite Redesign

The New 12 Steps of the Website Redesign Process

6 Steps: How to Plan a Successful Website Redesign

A Four-Step Strategic Website Redesign Process

 

Garenne Bigby
Author: Garenne BigbyWebsite: http://garennebigby.com
Founder @dynomapper
Garenne Bigby is freelance Chicago developer and founder of DYNO Mapper with over 10 years experience in both agency and freelance roles in design, development, user experience, SEO, and information architecture.

Back

Create Visual Sitemaps

Create, edit, customize, and share visual sitemaps integrated with Google Analytics for easy discovery, planning, and collaboration.

Popular Tags

Search Engine Optimization SEO Create Sitemaps Accessibility Testing Sitemaps UX User Experience Sitemap Generator Content Audit Website Content Audit
Create Interactive Visual Sitemaps

Discovery has never been easier.

Sign up today!