Category: Technical Blog

This article is for Web designers who want to switch a website that was built using dot html pages to WordPress. It is a relative snap to transfer any website, large or small, to WordPress.
The benefits of using WordPress instead of static pages are numerous. Concerns over losing ranking and generating 404’s are reasonable ones but they are concerns I am going to address in the following steps.

First Step:Get the latest version of WordPress &Install WordPress into it’s own directory.
Installing WordPress in it’s own directory allows you to work on the new design behind the scenes.If you don’t want to do that you can of course work on your own server and then upload the theme to your client’s WP installation. I like to work within the client environment so I can get to know any problems or quirks on the server before going live. Not all servers are created equal. Go to Settings>> Privacy and block search engines so that the work in progress does not get indexed if working on the client server. Or create a robots.txt file if one doesn’t already exist and type in
Disallow
/wordpress
Remember to remove this directive when going live.

Next Step:Making New Pages Out Of Old Pages.
An easy but time consuming step is copying and pasting the old html page content into the new WordPress pages and re instituting page order using the Page Order option
in the WordPress Page Editor. Number the old html pages and assign page order accordingly. If you have only 5 old pages to be carried over, you’ll be done very quickly. Designers handling the redesign of a much larger site with Parent and Child pages will have extra steps-especially if they need to build a drop down menu out of pages with child pages.Never fear:there are plugins that create dropdown menus for you. The one from We Eat Bricks looks the most promising

What the Blank is index.php?p=4? About-Us.htm looked so much better!
Using the permalink structure /%category%/% postname%
http://www.website.com/about-us.htm becomes http://www.website.com/about-us.
You choose this option in Settings>>Permalinks and find the Custom option. Paste what is in bold type into the field named Custom.

I heard recently that the fuss over pretty permalinks might have gotten a little overheated and that engines can and do index these kind of urls. But you will no doubt agree www.website.com/about-us looks a lot nicer than www.website.com/?p=4.

SEO Stuff
In my experience of redesigning websites, most had no SEO when I got my hands on them anyway but why continue on a bad path? As a web designer you might feel you should not have to worry about aspects that seem to fall more into the Marketing arena, right? Maybe. But many times the reason a client wants a redesign in the first place has nothing to do with how the site looks and more to do with such performance issues as: they aren’t getting as much traffic as they want or making many sales or landing as high in the SERPS as they would like. Fair or unfair they will probably blame you if their site doesn’t get climb higher in the SERPS after you deliver the new site. You should tell them that the more unique their content/product/service the more results they will see and that it will take time to see these results,too.Please do not make any unrealistic guarantees and make sure they are aware that the more often they update their sites the more they will be crawled.

There is one page that should not be carried over into the new design:the Splash or Intro Page.The Internet should be for offering information but because Splash Pages have very little information to offer, search engines tend to see this one page as the whole site and go away without indexing any links or real information about the website. I could go one step further and blame low performance on the Splash Page alone.The index page needs to be clean and uncluttered,true but don’t repeat the mistake of choosing style over substance.If you take a look at successful websites you will see that most put a lot of information on the index page.

All in One SEO
because WordPress doesn’t supply an option to create meta descriptions install the All in One SEO plugin.After you’ve activated this plugin each page will have a new All In One Seo option when you edit them.

Writing Meta Descriptions
If you are lucky the previous designer took care to create good meta descriptions for each page they made and then you can just paste this into the All In One SEO description field box.But if not you’re going to have to read the page content and pluck out of it a 160 character long description. 160 characters is believed to be the length after which search engines stop reading.

Using Keywords
It is argued over and over that Search Engines ignore keywords. If writing a Post instead of a Page you can use Tags and the All In One SEO plugin will use those tags as keywords.You shouldn’t worry overly about meta keywords.

Unique Page Titles
Page Titles need to be unique whether an it’s for an archive or a category or a Page page.
For Pages the title issue is taken care of when you publish the new page.Out of the box, most WordPress theme’s way of handling the title section needs a bit of help. So you should also install this code in the header.php file of the theme you are using:
[php]<title><?php

// Page or Single Post
if ( is_page() or is_single() ) {
the_title();

// Category Archive
} elseif ( is_category() ) {
printf( __(‘Archive for &lsquo;%s&rsquo;’), single_cat_title(”, false) );

// Tag Archive
} elseif ( function_exists(‘is_tag’) and function_exists(‘single_tag_title’) and is_tag() ) {
printf( __(‘Tag Archive for &lsquo;%s&rsquo;’), single_tag_title(”, false) );

// General Archive
} elseif ( is_archive() ) {
printf( __(‘%s Archive’), wp_title(”, false) );

// Search Results
} elseif ( is_search() ) {
printf( __(‘Search Results for &lsquo;%s&rsquo;’), get_query_var(‘s’) );
}

// Insert separator for the titles above
if ( !is_home() and !is_404() ) {
_e(‘ at ‘);
}

// Finally the blog name
bloginfo(‘name’);

?></title>[/php]

That will sort out Archives,Tags,Categories titles which you can also tell the engines not to index in Settings>> All In One SEO. Download the plain text file here:seotitles
I edited the file recently because of some confusion of mine over some very similar html characters:
‘ ’
« »
[html]&lsquo; &rsquo;[/html]
[html]&laquo; &raquo;[/html]
The file is using lsquo and rsquo….

Going Live
You have all your pages set up and the design is finished and you are ready to go live, what next?
Read this article on installing WordPress in it’s own directory.If you’ve followed all the steps your new WordPress site should appear when you go to http://www.website.com/. If your old index.html page still pops up then you have a little more work to do. Paste this into main .htaccess:
DirectoryIndex index.php index.html
Placing index.php first takes care of that little problem.

Redirecting Traffic 301
Gather a list of all the old site’s links.
http://www.website.com/about-us.htm
http://www.website.com/contact.htm
http://www.website.com/projects.htm

Find the top level .htaccess in your website root and open it up for editing with a plain text editor like NotePad or Textwrangler.If you use a Mac you will have to rename the file to htaccess.txt so that you can save it to reupload it. Macs hide . files.

Redirect 301 /about-us.htm http://www.website.com/about-us
Redirect 301 /contact.htm http://www.website.com/contact
Redirect 301 /projects.htm http://www.website.com/projects
Repeat this until you have covered every last page from the old website’s linkage structure.
Save the file and upload it back to the top level directory.

Last is to turn off blocking search engines in Settings>>Privacy.

Important Last Steps You’ll Be Glad You Took:
Add www.website.com to Google and Create and Submit a Sitemap in Google Webmaster Tools. You’ll also want to make good use of Google Analytics.