Contact

Principles of SEO Web Design: Continuity

cloverleaf-aboveWe just completed our first redesign project. So far, we’ve been extraordinarily fortunate to have great customers, and Rick Wells of Vero Group (a local vendor of top shelf auto auction software) is one of the best. Rick understood the importance of search engine optimization (SEO) from the moment we walked into his office, and he chose our favorite design from among the comps we presented. Because he was preparing for a trade show coming up in October, he wanted to go ahead and get some basic on-site SEO in place before we began the redesign process. We did a pretty standard treatment and offered assurances that our initial work would be integrated into the new design.

Here’s the old:

vero-old

And here’s the new:

vero-new

We’ll do a more thorough case study of the design process soon, but for the purposes of this post, I want to focus on SEO web design. Our design process ensures that SEO is taken into account throughout the design and relaunch process. SEO web design is an approach that delivers sites that look good, are built to be able to perform well in search engines, and include measurement capabilities for analytics. Here are some highlights about the importance for SEO of continuity in a redesign project.

The Setup: Flat Files to Managed Content

So the site we came to was just flat HTML files on a server, edited directly through FTP with a text editor. One nice thing about dealing with managed content is that it can be driven by templates, dramatically reducing design integration overhead without sacrificing much, if anything, in the way of control. Modern versions of WordPress and Drupal have particularly flexible and powerful theming. We selected WordPress for this project because the interface for managing content is, in our opinion, the most graceful and user-friendly among the popular content management software currently available.

We were able to develop in place without disturbing the current site by giving WordPress its own directory. When we finished our design and content migration, all we had to do was follow the steps of a well-defined process. This involved little more than moving the old index page out of the way and replacing it with the WordPress index. Otherwise, we had to ensure that the .htaccess directive used by WordPress for configuring its permalinks reflected the live directory structure of the new site.

Snippets

This is relatively easy, but I would imagine it’s easy to overlook if you’re not doing SEO web design. We had already ensured that the old site had good snippets. For the new site, we just ported them easily by using Michael Torbert‘s All in One SEO Pack, which allows per-page/post control over titles and descriptions (and keywords, if you’re into that kinda thing). When we improved snippets as part of on-site SEO in the flat-file site, we followed best practices for title tags, and the All in One SEO Pack does the same by default, so preserving good titles was easy.

Lesson: If we hadn’t intentionally preserved snippets, the search experience could’ve transformed for the worse with what showed up in the descriptive text in search engine results pages (SERPs). Also, if we weren’t moving to managed content or a system that employed good title tag functionality, we could’ve damaged SEO by not paying close attention to what was in the title on each page.

Sitemaps

Sitemaps go hand-in-hand with robots.txt in terms of ensuring that what you want to get crawled gets crawled, and they can help provide priority cues in the event that copywriting or design might not suggest appropriate priority. We typically use them as an easy-to-implement standard part of ensuring the integrity of the crawling process. In this case, we went from a hand-rolled Sitemap to one built using the Google XML Sitemaps plug-in for WordPress. It autodetects an existing Sitemap if it’s in a standard location.

Lesson: Any change of platform without regard for an existing Sitemap would leave an out-of-date Sitemap, which could result in crawl errors by search engine robots.

Redirects for Moved URLs

Generally, we were keeping the same pages, although we were moving from flat files to managed content. As we did so, we were making small improvements to the information architecture: consistent capitalization, separation of words with dashes, removal of file extensions (which can also be a security feature).

We used the Apache Redirect directive in .htaccess to indicate that these URLs have permanently moved by providing a status of 301. Google provides additional information about 301 redirects in their Wembasters/Site owners Help.

Basically, all we need to do is include an entry like so for each URL that changed:

Redirect 301 /old.html /new-hotness/

Now, if someone were to visit http://www.vero-group.com/old.html, they’d automatically be redirected to http://www.vero-group.com/new-hotness/.

Lesson: If we had made these improvements without regard for the old URLs, we would totally have abandoned users who had any of the old URLs linked or bookmarked, and search engine indexes would probably have been out of date for at least several days, likely resulting in HTTP 404 / not found errors for people visiting either from search or referring sites. This is bad for search experience and the broader user experience.

Analytics

What good would any of this be if we lost our ability to measure it? Fortunately, Yoast‘s Google Analytics for WordPress plugin allows for seamless measurement. All we needed to do was install the Analytics Account ID, and we ensured that there was no gap in analytics data.

Lesson: I’ve personally seen unfortunate data loss when existing measurement tools fail to migrate appropriately with platform or infrastructure changes. This is typically indicative of two problems: 1) Insufficient attention to detail on the part of the provider, and 2) Insufficient attention to analytics on the part of the site owner. It’s a critical mistake not to ensure that if Google Analytics (or any other analytics platform) tracking code were installed originally it needs to be installed in the new setup. Similarly, if this were not discovered for weeks or months, it might indicate that the data being supplied were not being valued highly enough by the site owner. Bottom line: you don’t want to miss a beat with your analytics.

Quality Control for Web Projects

The main point of this post is highlighting the importance of inventorying what is important for both the search experience and the user experience. This is why I refer to our web design process as SEO web design. Unfortunately, having enough knowledge and experience to create this inventory is difficult for people–both owners and design firms–with little experience with significant web projects, especially when they involve content migration or wholesale changes of platforms or infrastructure. And I know of no good way at the moment for someone selecting a web services provider to ensure that their designer/developer has sense enough to care about the right things.

For me, this comes back to the fundamental question of why you have a website in the first place. If it’s for generating leads and, ultimately, conversions, both the search experience and the user experience through search matter. I hope that by elaborating on some of the things we consider when undertaking a comprehensive redesign project, we can give website owners a few tools for assessing their web vendors through basic survey. E.g., “Tell me what will happen to my old URLs and show me an example of the new behavior.”

If you’re not sure that your recent redesign project kept the search experience optimized, please contact us.