So, you want to redesign a website. You have spoken with the client. They are excited, you are excited. Cloud 9 is officially your new home address. Little do you know the dangers that lurk around each corner of this process, waiting to pounce when you least expect it.
Successfully redesigning a website can be one of the greatest challenges for web designers and developers. Lucky for clients, most designers thrive on these kinds of challenges. The trick to a successful redesign is creating and executing a carefully laid out plan. In this article, I will demonstrate an effective way to redesign a website without crippling your SEO.
Preparation for Design
The first step, as with any design process, is research. Delve into your client’s company. Learn their history, their branding, their values, the company culture, and their children’s names and birthdays. (I was only kidding about the last part, but hey, it couldn’t hurt!) The point is that you will never be able to create a successful design for a company you know nothing about. Design is essentially a solution to a problem. Your job as a designer is to create the most elegant solution for your client. Please note that the most “elegant” solution does not necessarily mean the most “intricate” solution or the “flashiest” solution. An elegant solution for a website redesign must consist of the most user-friendly, functional, efficient solution for each individual client. And to do this, you need to know your project inside and out. The best way to do that, of course, is to ask questions. Some of these questions for example, may help get you started:
1- What is the goal of the redesign? Do you want your users to buy? To call? To email?
2- Will the redesign be major or minor? Will you be making changes in stages or all at once?
3- How effective is the current design? What do the statistics say? What should we retain from the current design? Why?
4- Who are your target users? What are they like? Find out their:
e. What is your user looking for/looking to accomplish by visiting your site?
5- Should the redesign be consistent with the current logo, colors, branding materials? Is the client happy with their current logo- will that be something that changes sooner or later? How will that effect the branding?
6- Should the site navigation remain the same? What pages will be kept, removed, or added?
7- Should the textual content on the site remain the same? Should it be updated?
8- Who will be performing updates/maintenance? Will a new CMS (Content Management System) be necessary? Will the client need the site to be ecommerce?
9- What specific challenges and constraints will this project have? What can you do to overcome these obstacles?
Of course I could go on and on, but this list is really just to give you a general idea, and to get the planning stage of the design moving.
Now that you have a wealth of knowledge about the company you are redesigning for, you are ready to start mockups, right? Wrong! Haven’t you been paying attention? I know you are excited, but we are just not there yet. The next stage is planning. This stage will consist of defining the creative brief, site design goals, developing and defining a concept, detailing any technical needs, and creating an execution schedule for the client. Carefully examine your research and decide how long each part of the site design will take you, and plan accordingly.
During this stage you will also choose whether or not the client will need a CMS for their new site. WordPress is an ever-popular, easy to use solution with dozens of resources to help bolster your SEO. In addition, WordPress allows clients to easily update their site with a constant flow of content. Keep in mind, the easier it is for your client, the better. For more information about popular CMSs see Joomla or WordPress; Which CMS is Right for SEO. When planning the new site, be sure to take the current URL structure of the site into account. For example, if you change the structure of your site from http://www.mysite.com/products to http://www.mysite.com/our-products the original links will not work, and they will lose any link juice from past SEO efforts if not redirected properly.
Be sure not to neglect setting aside time specifically for usability testing. “But Bridget, my site will be user-friendly, I’m a professional!” Of course you are, but in this specific case, your research has handicapped you. All that time you spent in phase one of the design process has enabled you to bob and weave around the site like a dodge ball player, but what about someone who has never heard of your client before? Or a user who is used to the old site design? Trust me on this one. Usability testing is an absolute necessity; make time for it.
Preparation for SEO
In addition to all of the questions that come with a redesign, there are certain precautions that come with the SEO setup. Firstly, be sure that you have a Google Analytics account set up from the get-go. All Google Analytics tracking codes should be on the necessary pages. Working on an ecommerce site? Make sure that the conversion codes, goals, and success/thank you pages are set up properly. In addition, don’t forget to add the following meta tag in the head of your success pages, so search engines won’t index the content of the page or scan it for links to follow:
Now is the phase we have been so excited about – execution. In this phase you will create mockup(s) for the client and go through the review process until you have a final, perfected site. Unfortunately, this stage is rarely as simple as that. But don’t get discouraged, we’ll get through this together. One of the most common issues in this stage involves the client and designer not seeing eye-to-eye. However, you have the upper hand in this case because of all of your research in phase one.
Most likely, your client will ask you to change things from the first design, its inevitable. But this is where your expertise comes in handy. When your client asks you to make a change, explain why you did the things you did. During every step of the design process, you should be asking yourself one question: “why?”
• Why did I pick those colors?
• Why is the logo that size?
• Why is the navigation on top as opposed to on the left or right?
Be your harshest critic, and justify every choice you make with statistics and research. Don’t change something unless you are improving it. It is your responsibility as a designer to inform the client, and keep them from making mistakes. They may want to use Comic Sans as an
, but well- you know better. Explain this to them. Be sure to also emphasize the importance of a clean, functional design. If the site is difficult to use, or doesn’t seem to fit what the user is looking for, they will ultimately abandon the page and your client will lose that lead.
Once your redesign is approved, it is time to launch. In order to do this properly, and avoid ruining your SEO, there are a few things to keep in mind. Firstly, export the sitemap from your client’s current website. Analyze the sitemap, and use 301 redirects properly. A 301 redirect is a way to tell a search engine that a page is gone, and to reroute a user to a new page. In the example below we want to redirect http://www.mysite.com/websitefolder1/oldpagename.html to http://www.mysite.com/websitefolder2/newpagename.html so we would enter the code as follows in the .htaccess file.
redirect 301 /websitefolder1/oldpagename.html http://www.mysite.com/websitefolder2/newpagename.html
An extra tip here- use comments with the name of the person doing the editing, as well as the date to keep the .htaccess file as navigable as possible.
Although you may be using 301 redirects, be sure that you only have one site (the new one) so web crawlers do not continue to view your old site. Make a backup for safe-keeping, and delete the old site.
Redesigning a site is a challenging task. To make the process go as smoothly as possible, focus on creating and executing a plan of action and paying attention to all the details.
Optimum7 designers are focused on research, strategy, creativity and execution. Contact us today for real results!