Showing posts with label SEO. Show all posts
Showing posts with label SEO. Show all posts

16 December 2016

The SEO Problem with site redesigns

It is very common for sites to experience SEO problems after being redesigned. Specifically, loss of traffic and search engine results page (SERP) demotion for terms.

Why this happens

404

Modern search engines determine whether or not to show a link to a page on your site based on hundreds of factors.

When you move content from one URL to another, after the search engine bot/spider discovers the new content, it will begin indexing that content (a good thing), but unless you properly tell it that the old content has moved to the new location, it will continue to attempt to crawl and index the old URL, and, until the new content is well established, it may show the old (now broken) URL in the SERP.

Showing the broken link to users is problematic because in addition to the crawl, search engines "learn" whether or not a given page on your site is "good" based on how users act after clicking on the link. If the user quickly returns to the search engine, the machine learning algorithms will begin lowering the value of that URL.

EVENTUALLY, the search engines will catch up (assuming that your new content is on par with your old content).

Until they do, however, you will take a traffic and conversion rate hit.

How to Mitigate the Impact of URL moves

First, monitor your crawl errors in the webmaster tools provided by the major search engines. When you see new "Not Found" errors, fix them ASAP.

Second, monitor and log traffic to your website's error pages. When you see errors, fix them ASAP.

Naïve approach

If you only had one page that returned a 404 (Not Found) error, the fix would be as simple as building a controller that returned a 301 (Permanent Redirect) with the new URL. This is user-friendly: if a user visits the old URL, (s)he is immediately redirected to the new page. It is also search-engine-friendly: the spider/bot for the search engine understands the meaning of the HTTP status code 301 and will begin updating its index to use the new URL in lieu of the old URL.

Unfortunately, building a new controller every time a new error hits the logs is time-consuming and a waste of developer resources.

A better way

Rule-based 404 handling

A better way to handle the problem is to build a generic mechanism that handles three cases as follows:

  • old URL → new URL with a 301 status
  • old URL with no planned/intended replacement → a friendly error page that returns a 410 (Gone) status code (not a 404, which is temporary)
  • old URL of which you are unaware → a friendly error page that returns a 404 status code (this is "almost" the default in ASP.NET MVC with Custom Errors enabled – the framework actually returns a 302 and then a 404).

Our design goals are:

  • To not need to write code for newly-discovered broken links,
  • To maintain rules in a simple text file,
  • To have rule-order precedence, and
  • To have the server update the rules in use when the text file is saved

Replace the default error handling mechanism

Disable CustomErrors

In the web.config file in the root of your site, disable custom errors: <customErrors mode="Off" />

Wire up a replacement error page

In the code file for the application, Global.asax.cs, insert code similar to the following:

Since we're completely replacing the custom error handling in ASP.NET, all unhandled non-HttpException errors are converted to HTTP Status Code 500 errors.

The code for our HandleHttpException method is shown below. It clears the error on the server, asks IIS (which is the web server that hosts most ASP.NET websites) to skip any custom error handling it has in place, and finally, executes a custom error page controller.

Since we're working in the HttpApplication directly, we have to build the RouteData ourselves and then execute the controller to get back into the MVC framework.

Since in some cases our controller will return an error page, the code that follows will use a model with three public properties: ErrorMessage, StatusCode, and Url. These represent the HTTP error message, status code, and the page URL that generated the error.

HttpErrorModel class diagram

The code below is very simple. If the HTTP status code is 404 (Not Found), then look in the OldUrl property in each of our rules to see if we have one that has a pattern that matches the URL. If a matching rule is found, if there is a non-empty NewUrl, then return a permanent RedirectResult to the new URL. If there is an empty NewUrl, then we return a 410 (i.e. we have created a rule for content that will not be replaced). If we don't have a matching rule, then a 404 is returned.

To make this into a flexible system, we're going to store our rules in a text file as JSON and use Regular Expression patterns.

Below is an example of some sample rules.

Our controller class will store its rules in the default MemoryCache. This collection of rules will have a cache policy that causes a refresh when the JSON text file is changed. The initial caching of the rules will come from reading a JSON file and decoding it into a POCO.

Below is the CacheMappings code. The code to read the text from file and to convert the JSON to a POCO object is omitted for brevity.

If you implement a 404-handling pattern similar to the one shown in this article in your site redesign, then when "Not Found" errors are logged by either the search engines or your internal logging, the fix is as simple as adding a rule to the JSON file.

08 December 2016


Forcing an ASP.NET MVC site to only serve HTTPS


Why force HTTPS?

Hyper Text Transfer Protocol Secure (HTTPS) is the secure version of HTTP, the protocol over which data is sent between your browser and the website that you are connected to. The 'S' at the end of HTTPS stands for 'Secure'. It means all communications between your browser and the website are encrypted.



How to force HTTPS


ASP.NET Action Filters

ASP.NET MVC allows you to apply a [RequireHttps] attribute on individual page controllers. It also allows the attribute to be applied globally by adding code to Application_Start in the Global.asax.


The problem with the built-in RequireHttpsAttribute

In a nutshell, the problem is that it returns 302, a temporary redirection HTTP Status Code (see List of HTTP Status Codes [Wikipedia]). This is an SEO problem. A return value of 301 means "Moved Permanently" and is a hint to the search engines to update their indexes.

If the built-in attribute is used, a result similar to the one below is obtained when the page is retrieved:


curl http://www.localexample.com:4433/ -iILk
HTTP/1.0 302 Found

The desired result is:


curl http://www.localexample.com:4433/ -iILk
HTTP/1.0 301 Moved Permanently



Writing your own version of the RequireHttpsAttribute

Writing your own attribute is fairly straight-forward.

  1. Create a class that inherits from the RequireHttpsAttribute class
  2. Override the HandleNotHttpsRequest method.
  3. Add some code to handle running in your local development environment. (NB you will need to create a self-signed certificate for a dummy domain (we use www.localexample.com), install it on your machine and update your hosts file).
  4. Build the HTTPS address
  5. End the method by setting the Result property of the filterContext to a new RedirectResult that uses the HTTPS address and sets the permanent parameter to true.

Although you can apply this attribute to your controller methods individually, applying it globally minimizes the effort and ensures that nothing is missed.


Wiring up your filter configuration

You will need to create/update the FilterConfig class.

The code shown below illustrates the necessary change, which is simply the addition of your custom attribute to the global filter collection.


Code is then added to the App_Start method in the Global class to run RegisterGlobalFilters.

The code below illustrates how to do this.






11 April 2016

prospect-flow.png
The most important employee in your organization is….

Your Website is your most important employee


It is available 24/7 and (hopefully) takes only a few seconds to find and is easy to navigate.   It tells your clients where you are, when you are open, how to contact you, what you do, etc.  Without it, you have less business.

Doubling Leads Every Year during the Great Recession

During the recession, I became responsible for the website and digital strategy of a company that sold expensive, low-demand products that often required (hard-to-obtain) financing to purchase (custom homes -- what sane person wanted to build a new home during the worst housing market in history?).

The company enjoyed record lead counts during my digital stewardship -- nearly doubling leads year over year.

Don’t Make Me Think

A number of things contributed to this success, but chief amongst them was the advice found in Steve Krug’s book, Don’t Make Me Think: A Common Sense Approach to Web Usability (a new edition has been published since my initial work: Krug, Steve. Don't Make Me Think: A Common Sense Approach to Web Usability. 2013. Print.).

In the second edition (2006) [which is what was available to me at the time], in Chapter 2, “How we really use the web”, Mr. Krug presented three “Facts of Life”, to wit:
  1. We don’t read pages. We scan them.
  2. We don’t make optimal choices. We satisfice.
    1. “Satisfice” is explained as a cross between “satisfying” and “sufficing”
    2. We choose the first reasonable option.
  3. We don’t figure out how things work. We muddle through.   
He ends the chapter with the following:
If your audience is going to act like you’re designing billboards, then design great billboards.

The home page of your website is a billboard.  

The application of this with respect to evaluating designs is to load a page, take off your glasses, walk to the opposite side of the office and see if you instinctively know the answer to the question: “What do I do next?”

Early this morning, I hit the website home page of five (5) custom home builders (three that I knew from my previous life and two that won organic search -- ironically the search winners were not the ones that were economically most successful/dominant a year ago).  I turned on the “NoCoffee” Chrome extension, used it to blur the pages and scaled to a laptop-width screen.

Here are the results:

Custom Homes.png

The red ovals represent things that look like they may be clickable and answer the question: “What do I do next?”

Guests come to a website with an objective.  The home page is normally the starting point. On a scan level, a user must be able to quickly find the desired information. Otherwise, the user will abandon the site, return to the search engine and visit the competition. An SEO fact that seems to escape most marketers and website designers is that Google measures the rate at which users return to search after visiting a site -- if users quickly return to Google and then go visit another link, your search ranking will be lowered for that query!  A slow and/or difficult-to-use site will steadily lose search rank. Your business will suffer as a result.

Of the sites in the image above,
  1. Site #1 - I have no clue what behavior the designer wants from the user.  Is the goal to force menu usage or scrolling? Both are bad UX strategies. See "The Fold Manifesto: Why the Page Fold Still Matters." The Fold Manifesto: Why the Page Fold Still Matters. Web. 11 Apr. 2016. and Wroblewski, Luke. "Obvious Always Wins." LukeW Ideation Design. Web. 11 Apr. 2016.  The site needs clear CTAs above the “fold”.
  2. Site #2 - Obvious call to action (CTA) dead center. It looks like it might require some typing and could benefit from more visual contrast/pop. Nonetheless, it is obvious what the designer thinks the user wants to do next.
  3. Site #3 - Three (3) CTAs.  This may or may not be better. Two of the buttons may be “below the fold” for many users. Buttons are less frictional, but now the user needs to read each one to figure out which one of the buttons is appropriate.
  4. Site #4 - The CTAs match the site theme and blend in.  It took slight thought to find them -- the colors should be adjusted.
  5. Site #5 - No clear CTA. The menu is red! Why? I guess they want me to think… ...or go to a competitor’s site.

In 2006, mobile web usage wasn’t really a concern.  The web was awful on phone-sized screens.

The world has changed a lot since then.

150 times per day with an average duration of 1 minute and 10 seconds


Adams et al. argue that to succeed in a mobile world, sites need to
  1. Be there
  2. Be useful
  3. Be quick

Intent Rich

Mobile usage is “intent-rich” (see "How Micro-Moments Are Changing the Rules." Think with Google. Web. 11 Apr. 2016.). To win on the small screen, your site needs to more than have an obvious CTA. It needs to have obvious quick paths to information.

4 New Moments

There are four new moments every marketer should know (see "4 New Moments Every Marketer Should Know." Think with Google. Web. 11 Apr. 2016.):
  • “I want to know” moments
  • “I want to go” moments
  • “I want to do” moments
  • “I want to buy” moments

Consider the following blurry home page:

clear what next - intent and business goals.png

It appears that there are blue buttons with graphical images for location, hours button, ??? & pictures and a red button (probably an RFI CTA).  This website home page feels frictionless and easy to use.  At a glance, “know” and “go” seem satisfied. “Do” and “buy” may or may not but it looks there is, at least, a path in this direction.

Conclusion

Your website lets you down. It could do a much better at encouraging prospects to begin the journey down your sales funnel.

Home pages that require thought introduce friction, impede usage and frustrate users. If your competition does a better job on its homepage, odds are good that it will rank better in search, that it will gain more customer eyeballs and that you will lose business to them.

Fix your home page. Sell more.

Copyright © 2016 Stand Sure. All rights reserved.

15 January 2016








Google's Accelerated Mobile Pages Project (AMP)

For many, reading on the mobile web is a slow, clunky and frustrating experience - but it doesn’t have to be that way. The Accelerated Mobile Pages (AMP) Project is an open source initiative that embodies the vision that publishers can create mobile optimized content once and have it load instantly everywhere.

Why You Should Care

Google Is Behind It

Here's the announcement on the Official Google Blog.

Doing what Google recommends always helps your website with respect to users.

It also often helps you rank higher in the search results.

The Pages Are Blazing Fast

If you compare the network load times of a page that loads 70 images, you'll see something startling. The AMP page only loads what is necessary for what is on screen; therefore, it's load time is a mere 2.55s. The "traditional" page loads everything; therefore, it doesn't fire a load event until 14.91s – a terrible user experience.

The two images below show the network response times of each approach – the red "Load:" at the bottom of each image indicates how long it took each page to fire a "load" event in the browser.

As you are probably aware, all other things being equal, the search engines rank faster pages higher in the search engine results page (SERP).
AMP network performance
Traditional network performance

Responsive Web Design (RWD)

AMP pages automatically adapt to different screen sizes – no more terrible phone experiences!


With traditional pages, a developer either spends hours figuring out how to make the page responsive or spends days writing a new version of the page for a mobile-only site – this is a terrible waste of resources and if the links between the desktop and mobile pages to instruct the search engines which is which are not set up 100% correctly, you can have an SEO and SERP nightmare.

In the two images below, you will see the Google PageSpeed Insights test results for both pages. The AMP version scores an 86 on speed and a 100 on user experience; whereas, the traditional page scores a 58 on speed and a 70 on user experience (the page is also not mobile friendly and is less likely to show up in phone searches).
AMP pagespeed performance
Traditional pagespeed performance

Caching

Google has announced that it will cache the pages on its servers – which will make delivery to your users even faster!