10 Important Points to Consider when Redesigning your Website

Every so often, your website should undergo a face lift. It’s important to consider a site redesign every couple of years or so to maintain a fresh appearance for your company.

If you just put a site online and don’t touch its design for many years, it will appear that your company is behind the times. Since online marketing channels and SEO is constantly evolving, you have to stay current or risk losing your position to a competitor who’s on top of their game and has an updated site.

Other reasons like migrating to a new content management system or rebranding your company can also serve as motivation for re-designing your website.

When planning and implementing your redesign though, there are several things you need to consider. Continue reading for 10 important items you should be thinking about when doing this all-important task. These tips came to us by way of a recent white paper from our friends at Hubspot. For more detailed information into the following 10 points, download the white paper today.

10 Important Points to Consider when Redesigning your Website

1.    Analyze your existing site’s metrics

Before you even begin, evaluate your current site’s performance to see where you stand. Metrics to consider include – number of visitors, click-thru-rate, bounce rate, time on site, current SEO rankings and more.

2.    Develop goals for your new site

Have a concrete reason for re-designing your site beyond “it’s been awhile.”  Redesigning your site should be more about how your site works rather than how it looks. Tie your reasoning into metrics mentioned in #1 and be sure you clearly communicate this to your in-house team or agency.

3.     Account for your current site’s assets

Many designers fail to consider how a re-design can hurt more than it helps. For example, you may have a page on your existing site that does very well and has lots of inbound links. Losing this page could do great damage to your position in the search engines. Important assets you need to be sure you preserve may include – most shared/viewed content, most visited pages, best performing keywords and number of inbound links to individual pages.

4.    Look at the competition

While it isn’t wise to obsess about what your competitors are doing, it can be very helpful to understand where they may be outfoxing you. Run you and your competitor’s site through a tool like Marketing Grader so you can learn the strengths and weaknesses of each. Don’t copy your competition but instead use it as an opportunity to learn where you can improve your site.

5.     Develop your Unique Value Proposition (UVP)

Before you begin developing content for your new site, be sure you identify what makes you unique for your competitors and be sure that messaging is consistent across your entire website. It’s important you immediately answer why someone should contact you or otherwise stay on your site rather than flee to your competitors.

6.     Design your site around personas

Don’t make your site about you – make it about your customers. Use language they can understand and relate to. Segment your personas by demographics and identify their needs. Use this as a basis for developing your site’s messaging.

For example, let’s say you’re a hotel marketing manager trying to bring in new customers. In this case, you can target five buyer personas – an independent business traveler, a corporate travel manager, an event planner, a vacationing family, and a couple planning their wedding reception.

7.     Optimize your new site for search

Hopefully you’ve got all the bones there for building search engine rankings but it’s amazing the sites we run into who don’t. Anyway, be sure you inventory your existing site pages to find the ones with the most link juice and search engine value. Be sure you develop a comprehensive 301 re-direct strategy to ensure you don’t lose any of that traffic or value.

8.     Identify Calls-to-action

These are the elements in your site’s content and design that motivate a visitor to take action – be it to click ‘buy’ or simply provide their email address or download a whitepaper. Your website shouldn’t be static but rather should motivate someone to take action. Examples of good opportunities for conversions include: free whitepaper, contests/promotions, product purchases, free trial, etc.

9.     Have an ongoing content development strategy

As you know from reading our blog, we place high value on a consistent stream of valuable, informative content. Develop a strategy for building this content. Start a blog, develop press releases on important company news and think about landing pages you can develop that target important keyword phrases.

10.     Include extras

Any website built today should include basic elements like a homepage, product page(s), about us/FAQ and a contact us page. But go beyond this to really make your site shine. A blog for example is a great way to provide important information on an ongoing basis. You can also include landing pages for lead generation, add RSS capability and include social sharing buttons on all your pages.

This list of 10 things to consider when redesigning your website isn’t meant to be exhaustive. Each business and industry is unique. Much of what determines the success of a redesign occurs before you actually do the work. Many website owners get caught up in how the site looks rather than how it works.

Following these 10 recommendations though will ensure you’re well prepared to successfully re-design your website.

Many customers have come to us wondering why their site isn’t performing that well and we usually find something mentioned above that they’re lacking. Most of all, many businesses view their website as a singular resource when in fact it should “…integrate with other functions like social media, e-mail marketing and lead generation.”

Have you re-designed your website recently?

How did it work out? Are you satisfied with how your new site is performing?

Is there something mentioned here that you missed?

Remember, you can always go back and make changes – that’s the beauty of online marketing. You can always go back and make tweaks to boost your site’s performance.

Other Posts You May Be Interested In

Answer These 23 Questions to Understand What Google Looks For

3 Types of ‘Breadcrumbs’ – And Why You Should Include Them on your Site

10 Most Common Web Design Mistakes

34 Things You Must Do When Redesigning your Website

“Don’t Make Me Think” – A Common Sense Approach to Web Usability (Part I, Part II, Part III)

3 Types of ‘Breadcrumbs’ – And Why You Should Include Them on Your Site

Breadcrumbs – and no I don’t mean the ones you use when frying something – is a term I recently became re-acquainted with. While not an absolute critical part of your site’s navigation, breadcrumbs can provide an alternative way for visitors to see where they are on your site.

The term comes from the popular fairytale Hansel & Gretel and refers to the breadcrumbs the two laid out to help them find their way back (…this metaphor though shouldn’t be taken too far as you’ll see later on).

Breadcrumb navigation, while more of a secondary component, generally appears horizontally across the top of a webpage below the main navigation, title bars and headers.

This component of your site’s navigation allows users to easily see where they are in your site’s hierarchy – since most search results refer visitors to pages within your site, breadcrumbs help visitors see where they are and make it easier for them to navigate to higher-level pages.

Breadcrumbs increase site usability, functionality, shows the hierarchy of all your site’s pages and eliminates the need to make additional clicks to reach other pages.

Besides the usefulness to your users, the benefits to your site and business are equally significant – research and comparisons have shown that including breadcrumbs result in longer site visits, lower bounce rates and increased interest.

Breadcrumbs also yield valuable search engine benefits by providing another opportunity to highlight important keywords – either through the breadcrumbs themselves or the specific anchor-text links pointing to internal pages.

Breadcrumbs also adds content relevancy to all of your pages since they’re all keyword intensive. As you know, relevancy is an important ranking component Google uses for links and so forth.

Now that we know what they are and how they can benefit your site, what are the different types of ‘breadcrumbs’ I can include on my site? Continue reading for a brief description of the three types, or formats of breadcrumbs available.

1. Location-based breadcrumbs

Perhaps the most common, this type of breadcrumb navigation indicates where the current page is in the site’s hierarchy. In the horizontal bar, users are given links to pages or categories that are a ‘level up’ from the page they’re looking at. These ‘level-up’ pages are commonly referred to as the ‘parent’ category.

Courtesy of HongKiat

2. Attribute-based breadcrumbs

Common on e-commerce sites, these breadcrumbs indicate attributes or categories ascribed to the current page with a site. Products not only will fall in a certain category but will have certain attributes as well. The best example of this is a site listing cars for sale – an SUV will fall into that category but will also include attributes like color and year model.

Courtesy of HongKiat

3. Path-based breadcrumbs

Really the least common, this type of breadcrumb navigation most closely resembles the Hansel & Gretel fairytale. They indicate steps a visitor has taken to arrive at the page they’re currently on. The breadcrumb will include links to pages they’ve previously visited. It’s the least popular since this type of navigation essentially replicates the forward and back buttons.

(It can also get quite complex considering how many sites contain literally thousands of pages. That’s why we say it’s problematic to take the ‘breadcrumb’ metaphor from Hansel & Gretel too seriously.)

While breadcrumbs are not the most critical component of your site, they can provide many valuable benefits. They’re not meant to answer your visitor’s questions or make sense of confusing information architecture.

However, they do add make it easier for users to move around your site and lead to many tangible benefits for both you and your site’s visitors.

5 Ways to Really Speed-Up Your Page Load Times

It’s been known for quite a while now that one of the factors Google uses to rank websites is page load time. Faster loading pages will generally rank higher than pages that load slowly, provided other factors like content and a crawlable site are the same.

Fast loading pages aren’t important for just web rankings – if a page is loading slowly or times out, how many will hang around to wait for the page to load?

Whatever the reason for a slow loading page – antiquated server, extra coding, improperly formatted images – having one (…or several) will certainly cause you to lose visitors and more importantly, customers. To see how important this is to the average web user, check out this page load graphic courtesy of Blue Compass Interactive and our friends at Planet Ocean.


So how can I speed up my page’s load time? And what’s the recommended page load time for both search engines and web users?

For the best results, it’s recommended all pages on your website load within three seconds.

If your pages are taking longer to load, the following 5 tips will help optimize page load time and ensure your rankings (…and customers) will not slip by the way side due to slow loading pages.

1. Use an image editing program that provides a “Save for Web” setting

Images are by their very nature pretty big. If your webpage is loading images as-is it can dramatically lower your page load time. A “Save for Web” setting will export your image in a compressed file size. Also, don’t forget to specify the original file size in your HTML code (i.e. 500 pixels x 300 pixels). Not specifying these dimensions means your web browser will have to work harder to display the image, thus increasing page load time dramatically.

2. Keep HTML coding to a minimum

Many webmasters, perhaps you, use WYSIWYG (…what you see is what you get) type HTML editors. These programs though add a lot of unnecessary code to your page and thus, slow page load time down tremendously. Examples of unnecessary coding include “comment” lines and “date stamps” to name a few. One program you can use to compress your coding is the GZip HTML Compression tool.

3. Consolidate Cascading Stylesheets (CSS) and JavaScript

These days, every page has at least one cascading stylesheet (CSS), third-party application or JavaScript file to load before the page will function properly. This can slow even the smallest of web pages. Therefore, it’s best to force the browser to fetch as little external information as possible. Consolidate your CSS sheets down to one if possible and embed them at the HEAD of the individual page.

4. Control how your site content is ‘cached’

Demarking and controlling how your site’s content is cached by the search engines will dramatically speed up your page load time. How you do this depends on the type of server you’re hosting your site on.

For an Apache server, you can physically adjust the “Expires” or “Cache control” header attributes. The process for a Windows server is similar and involves manipulation of the HTTP ‘client cache’ element. And if your site is hosted through WordPress, download and install the WP Super Cache plug-in which serves up static HTML pages to the majority of your audience and dramatically boosts page load time.

5. Reduce the amount of cookies

Consider downloading and installing a free ad-on like View Cookies for Mozilla Firefox to monitor the amount of cookies being exchanged between you and your site’s visitors. Review these cookies and see which ones you can reduce in size or eliminate altogether. If you can’t recognize the cookie, then you probably don’t need it. The fewer cookies your page has, the faster it will load.

As we always say, one ranking factor alone won’t determine the success or failure of your site in the search engines. With that said, on-site technical improvements are a sound way to securing long-term rankings. Therefore, if you find your site’s load time is a bit lagging, make sure you pay close attention to the above metrics.

10 Most Common Web Design Mistakes

From a usability perspective, the design of your site’s web pages has to be easy for users to follow. One common rule we follow is the ‘7-second rule,’ meaning your visitor has to be able to figure out what you’re about and what you offer in 7 seconds or less.

But once you’ve grabbed their attention, you’ve got to keep them there.

Bad site design from a usability perspective will certainly kill your site’s good will. How many websites didn’t have easy to follow navigation or otherwise made it difficult to find what you needed?

Sadly, this is more common than anyone wants to admit.

Below is a list of the 10 most common web design mistakes compiled by usability expert Jakob Nielsen. Of course, there are other design issues from an SEO perspective you need to consider. But these following 10 mistakes will kill the experience for your visitors, which will depress the number of visits and conversions you ultimately receive.

#1 Most Common Web Design Mistake – Bad Search

When site visitors can’t find what they’re looking for through the site’s navigation, they turn to search. Some just jump right to the search bar and type in their query. However, many online users don’t have a keen sense of grammar and spelling. If your site’s search functions are overly literal, this could hurt you.

Be sure your search functions are able to handle typos, plurals, hyphens and other variations of important terms on your site’s materials.

#2 Most Common Web Design Mistake – Over-use of PDF Files

Adobe PDF files are generally reserved for extensive e-books and other information that’s better off being printed. If a user encounters a PDF while browsing, it breaks their flow and leads to a bit of frustration. Also, layouts for these documents aren’t meant for the web and usually display in very small fonts that are difficult for users to handle on-screen.

Therefore, only use PDF for manuals, e-books and other large chunks of content that need to be printed. Convert any information that should be browsed or read on-screen into a real webpage.

#3 Most Common Web Design Mistake – Not Changing the Color of Visited Links

Understanding where you’ve been helps you better understand where you’re going, both in life and on websites. For the web, links are the key component in this navigation process. Knowing which links you’ve already visited keeps you from unintentionally revisiting the same page again. Testing has shown if sites do not change the color of a link once it’s been clicked, much disorientation and frustration among users will result.

Therefore, be sure you setup your links to change color once the visitor has clicked on it. This will help your visitors avoid visiting the same page twice, or three times.

#4 Most Common Web Design Mistake – Non-Scannable Text

A big mistake among web copywriters and designers – not having copy that’s scannable makes it look intimidating to readers. Boring and painful are other metaphors that can describe one’s feeling when they run into non-scannable text.

Use bullet points, sub-headings, bold-print, short paragraphs and a simple writing style to make your copy more inviting. Remember, most users scan, they don’t actually read everything word for word.

#5 Most Common Web Design Mistake – Fixed Font Size

Web design platforms like CSS (Cascading-Style Sheets) provide an option to allow you to disable a web browser’s change font function(s). The default most of the time, 95% of the time in fact, sets the font-size kind of small, reducing readability. This can be especially frustrating for users over 40 or with poor eye sight.

Respect users’ choice and allow them to easily resize the font to a level needed for them…to make it easier, express font-size in relative terms rather than pixel size.

#6 Most Common Web Design Mistake – Page Titles with Low Search Engine Visibility

Your site’s <title> tag is a very important element of your website. It’s what search engines will display in your site’s listing, which is what users first see about your business and will click on if they’re searching on Google or Bing. It’s also the default setting if users bookmark your site. Many sites though say ‘Welcome to’ or begin their <title> tag with ‘the.’ Also, many sites don’t have different <title> tags for each page.

For your homepage, begin your <title> tag with your company’s name followed by a brief, keyword-rich description of what you do. Search engines though only display the first 66 characters but you can have a few more if you need them. For other pages’<title> tag, include important details of the page’s content using keywords you’re targeting.

#7 Most Common Web Design Mistake – Advertisements (…or things that appear as one)

As the web has developed, users have become quite keen on avoiding anything that looks like an advertisement – or anything that interrupts their ‘goal-driven navigation’ as stated by Nielsen. Text-ads in search results are an exception to this rule of course. Unfortunately, many good design elements have similarities to ads and get ignored as well.

It’s therefore best to avoid any design elements that look like advertisements. Banners, pop-ups and overly aggressive animations can all potentially pose frustrations for users. If you have them, it’s more likely they’ll be ignored. Pop-ups in particular may in fact draw scorn from users.

#8 Most Common Web Design Mistake – Violating Design Conventions

One of Jakob Nielsen’s laws of usability – “users spend most of their time on other sites”

Meaning, users have certain expectations already set before they reach your site, which are formed by their experiences on other sites. Consistency is therefore an important principle – when users know what to expect, they feel in control. When expectations are broken, many will feel insecure and leave your site.

Stick with common design conventions in order to maintain consistency with what’s commonly done on most other sites. You can of course, and should, make yours unique from your competitors. But with certain navigation and design elements, you want to maintain some form of consistency.

#9 Most Common Web Design Mistake – Opening New Browser Windows

If you’re like me, having a new window or ‘pop-up’ just come up on the screen can be frustrating as all get out. Considering systems can freeze up, loading a user’s machine with more ‘junk’ can in fact lead to a lot bad feelings. Besides adding pressure on their systems, new browser windows disable the ‘back’ button, which is what a vast majority of users use to navigate away from a page.

Links should therefore only replace the current page with new content. If a user wants to open the page in a new window, they can easily do so by right-clicking on their mouse.

#10 Most Common Web Design Mistake – Not Answering Questions

Since web users are inherently ‘goal-driven,’ not answering important questions about your products or services is a big failing of many websites. Not providing any specifics or burying them deep beneath a bunch marketing jargon will make users think what you offer can’t help them. One of the best examples of this is price – how much does it cost?

Ecommerce sites generally don’t make this mistake but a lot of B2B sites do unfortunately. But many B2C ecommerce sites too may leave the price out of lists like category pages or search results, which can lead to user frustration and reduced conversions.

One principle we always like to remember and urge you to think about – “people buy things from people, not websites.” Therefore, their experience must be enjoyable and not rife with uncertainty and errors. It should move along flawlessly – each flaw reduces good will and ultimately conversions.

 

34 Things You Must Do When Redesigning your Website

Every so often, it’s a good idea to give your organization’s website a fresh new design. Doing so makes your company look active and dedicated to giving your customers the most advanced products and services.

But considering the fact many websites contain hundreds, maybe even thousands of pages, it can be a daunting task regardless of how careful you are. Proper planning helps ensure it all goes smoothly…no or very little planning can turn it all into a big nightmare.

Pages can get mixed up, deleted or otherwise not be available on the new site, which can end up costing your company thousands of dollars.

To avoid this calamity, you need to consider the following factors before, during and after. Continue reading to learn about all of these considerations you need to keep in mind when redesigning your website.

Before doing anything though, you need to get some baseline information and backup your old site just in case something goes awry. Load time, conversion rates, search rankings, bounce rates for your top landing pages and a list of important inbound links is information you need to have in-hand before you even get started.

Once you have all of this, it’s time to start your site re-design. Taking the following 34 steps during this process will ensure it all goes smoothly and you begin reaping the benefit of a new website as quickly as possible.

Prior to New Site Launch

1.       Have the old site available to put back online immediately if something goes wrong.

2.       Retain your existing URL structure if possible so you can minimize impact on search rankings.

3.       Address methods to eliminate duplicate content to prevent it from occurring in the first place.

4.       If you’re unable to keep existing URL structures, have a plan on how you will handle switching to the new file structure, including 301 re-directs, updating links, marketing materials and PPC ads.

5.       Keep a copy of the old site on-hand just in case.

6.       Use a link checker utility like Xenu to scan your new site and find any broken links.

7.       Take a moment to review titles and meta descriptions on your new site.

8.       Before launching, check your new site manually using multiple web browsers (Internet Explorer, Firefox, Safari and Chrome). Many differences exist between these browsers.

9.       Update XML and HTML sitemaps so search engines can easily crawl your new site.

10.   Verify all web forms and other interactive features are working properly.

11.   Protect your site from competitors and search engines during development. The best way to accomplish this is to develop the site locally and internally to your firm.

12.   Review existing RSS feeds

13.   Verify your new site will work properly with traffic tracking codes like Google AdWords and Google Analytics.

14.   Develop a plan to add current analytics tracking to your new site before launch.

During new site launch

15.   Did you back up your old site? If not, now is your last chance.

16.   Update your .htaccess and robots.txt files so any 301 redirects will work properly.

17.   Be sure AdWords and PPC campaign pages are updated and working properly.

18.   Update payment gateways or other important sites if your server’s IP address changes.

19.   Test all email address and make sure they’re working properly.

20.   Remove any temporary no-index tags, robots.txt and be sure any other robot control tags are updated in case you had something blocked off during the development process.

After new site launch – catching any mistakes

21.   Run your spider/link finder once again to catch any broken links you may have missed.

22.   Test your new site’s load time. Google has claimed load time is now a big ranking factor.

23.   Make double-sure you put tracking codes/scripts on your new pages

24.   Check server logs for any 404 or other server errors.

25.   Look at your Google Webmaster Tools and Bing Webmaster accounts to see if the search bots are spotting any errors.

26.   Update any broken inbound links at the source of the link or through a 301 re-direct.

27.   Verify PPC ads are still correct.

28.   Make sure your XML sitemap is up-to-date.

29.   Compare bounce rates for the new site vs. the old one.

30.   Monitor how newly indexed (…or re-indexed) pages are ranking.

31.   Now that your site is live online, test it once again with all web browsers and even a mobile smartphone if you’re able to.

32.   Manually test all web forms and other interactive scripts.

33.   Check where your site is in the search results after the search engines have indexed it once again.

34.   Go to Google and Bing and type “site:yourdomain.com” in the search bar to see if the number of pages indexed has improved over your previous numbers.

Taking these all important steps helps ensure your site transition goes as smoothly as possible. Also, they help you spot any errors and allow you to make those corrections before any negative consequences arise.

Double, perhaps even triple check your site to make sure everything is working properly. If not, you’re certain to suffer devastating setbacks in the search engines as well as eroding good will of your site visitors.

Remember what Thomas Edison once said – “Good fortune is what happens when opportunity meets with planning.”