Saturday, March 27, 2010

Considerations with a site re-design

I just completed a site redesign for the Alberta Roofing Contractors Association. They wanted to refresh the pages a bit, simplify the navigation and add Google Custom Search. Here's some things I learned...

We switched from static html pages to php pages that used simple includes for the header, footer, and navigation. We also reorganized the folder structure a bit to clean things up. Consequently all the pages/pdf's that were previously indexed on search engines 'disappeared'. I wasn't sure what to do about this at first, but then I found an .htaccess file in the root of the ftp directory on the server and I made 301 redirects for all the old html pages and pdf files. This worked great. Lesson Learned: a simple site redesign on an established site isn't as simple as it would seem on first glance.

I found re-indexing Google custom search to be a pain. I had to add the site into Google's webmaster tools (both and, set the old pages up to be removed from the cache, create a sitemap.xml file and upload it, create a robots.txt file and upload it, and add all the new url's for pages and pdf's in the 'explicit' indexer. It was rather cumbersome, but I got it to work in the end.

There were a number of issues with compatibility related to the search engine form and the flash on the home page that we had to work around using CSS hacks for IE ( *+html ).

Using a wrapper in CSS is a big help in some cases to make background images display properly in all situations. Something similar to this:
#wrapper {
margin: 0px;
padding: 0px;
width: 100%;
background-image: url(../images/bg.jpg);
background-repeat: no-repeat;
background-position: center top;
margin-left: auto;
margin-right: auto;

No comments: