SEO 101 – 6 Tips for Optimizing Your Web Site’s Search Engine Visibility

seo

SEO, or Search Engine Optimization is a bit of a black art.  One of the reasons for this is that there is not one simple algorithm or set of steps that each and every site owner can implement in order to increase their visibility or pagerank.  In this article, I’ll talk about some of the common sense, simple steps a web publisher can take to increase their visibility on the major search engines.

Tip #1 – Optimize Your Content

Google’s pagerank is based on hundreds of attributes including analysis of your site content.  Let’s start with some of the more obvious content elements:

Meta Tags

Meta tags are tags placed in the HEAD section of your web site’s pages.  Meta tags allow you to provide additional description elements for your site. You absolutely MUST provide the following Meta Tags if you want to increase your site’s visibility.

  • Description – provide a keyword rich description of your web site – obviously mentioning attributes of your product or service.
  • Keywords – A comma separated list of keywords associated with your site.  Use caution – DO NOT repeat keywords many times.  This is a mistake made by many SEO rookies and can lead to a lower pagerank.
  • Title – not technical a meta tag – but just as important, the title tag provides another opportunity to link your site to your primary target market.

Content Titles

Including the title tag in your page’s content is important. However, just as important is the actual content of the title tag. Obviously, ensure that the title is descriptive but also wherever possible make sure that the titles reference a keyword or something related to your primary content goal.

Tip #2 – Use Alt Tags in Your Image Tags

Alt tags are referenced by search engines during indexing.  The relevance of your site to your keywords of choice can be dramatically enhanced by loading your Alt tags up with keyword rich descriptions.

Example:

[source language=”html”]

<img alt=’search engine optimization’ src=/images/seo.png>

[/source]

Tip #3 – Be older

A sad fact is that if you’re domain name has been registered for less than one year, you’re not likely to get premium page ranking. Not to fear, you’ll simply need to leverage the remainder of these tips to increaser your visibility.

Tip #4 – Be faster

Google penalizes slower performing sites and sites with high initial page load times by giving them lower page ranks. To ensure that you’re site is snappy, make sure you’re optimizing your image sizes, combining and minimizing your javascript components and using a content distribution network where possible. CDN’s can be very expensive, but if you’re site has national or global appeal and you want to optimize your visibility, you may want to look into a CDN such as Akamai or Limelight. CDN’s are less important if you’re target market is more on the local scale.

Tip #5 – Increase Your Visibility by Increasing Links to Your Site

Yes, it is true that Google will rank your site higher if more sites link to your site – but even more important thank the number of sites linking to you is the pagerank of those sites that link to you.

Consider this example… You create a new site and then create fifteen other new domains and sites that simply link to your new site. You submit your sites to google and google indexes all of the sites. The value of each of the links to your site from your new link farm is minimal because the age and page rank of all of these sites is near zero.

Now consider another example… You create your new site. Then, you create a blogger.com, ezinearticles, tumblr, posterous, squidoo accounts and publish many articles all with a single link in the signature linking back to your primary site. Google ranks ezinearticles highly because of the diversity and consistency of it’s content. Therefore, you’re going to get higher credit for that single link that you would for all of the links you created in your newly established link farm.

To get started, create a free WordPress account. Be sure to try and get a wordpress blog name that reflects something similar to your primary site – or content. This will provide you with a free, easy to your blog on the WordPress domain – for example: mlynn.wordpress.com. Next, carefully craft an article on your blog that speaks to your primary site’s mission, content or target market. Be sure to include a link back to your primary site.

Start slow and do this with WordPress and possibly one other blog site. Be sure that you’re providing good quality content. Here are some sites to consider:

Tip #6 – Know Thy Enemy

Review your competitor’s sites. Evaluate their SEO success or failure. One tool I use to do this is the Chrome SEO Extension. Review the meta keywords and description tags of your competitors to make sure you’re not missing something. Do this on a regular basis to ensure that you’re keeping your meta tags up to date and in line with your target market.

Bonus Tip – Optimize Your Visibility Through Social Media

The increase in popularity of social media sites like Facebook and Twitter can’t be ignored. You’re not likely to get through a day without someone making reference to something they saw or some content that was linked to from facebook or twitter. Today’s savvy business owner must learn to leverage this powerful medium. However, a word of caution. Bad social media practice or improperly executed use of social media can be very damaging for your business reputation – so wade carefully in this new media stream.

Don’t hammer twitter with repetitive links to your site. This is annoying and people will show their disgust by unfollowing you, or even worse, commenting negatively. Again, start slow. Learning how to use twitter can take time – but will be well worth your effort. Once you sign up – use the “interest browser” to find other tweeters with similar businesses or interests. Watch their posts and where appropriate “retweet” their posts. Over time, others will find you and begin to follow your tweets.

A couple interesting usage tips for twitter: You’ll see a couple symbols in tweets – namely, “@” and “#”. The ampersand indicates a reference to another tweeter. For example, I’m @mlynn on twitter. The hash or pound sign is a reference to a tag or a subject on twitter. These can also be used by sites to determine inclusion of the post on other sites. For example, I’m using Linkedin for my professional profile and contacts. I’ve configured twitter and linked in such that when I include the hash sign “#in”, my tweet will be logged as my linkedin status.

Find Your Domain Name, Whatever It Might Be

Here’s a little ExtJS project I wrote to help you find domain names. The backend is written in PHP and utilizes a MySQL database which contains the contents of the English dictionary. You search for domain names that match a specific string, or use the dictionary to find domain names that start with, end with or contain a specific piece of text.

10 Tips to Help You Become a Better ExtJS, PHP, MySQL Developer

Before I begin, let me first say that I am not an expert ExtJS, PHP or MySQL developer. I have however, learned over the years from some basic design principles and tips gleaned far smarter and more talented developers than myself. I thought I’d create a post in the hope that you may benefit from what I have learned. Some of these tips will be pretty basic for most skilled developers, but it never hurts to review, right?

Audience – Who is This Article For?

This article was intended for the novice to intermediate web developer who specializes in use of the following technologies:

Tip 1 – Stop Using Print Statements to Debug

Developing solutions using the elegant Javascript framework ExtJS can be a mix of pleasure and pain.  While debugging the Javascript components is made easy with the handy Firefox extension FireBug, getting debug information back from the php side of your app can be tricky.  Especially if you’re expecting to maintain JSON communication with your javascript components. There are basically two methods of debugging the php side of your app.  You can either rely on JSON encoded strings sent back to your javascript components, decode them on the other side and display them either in and alert window, or in the console using console.log, or you can use print statements in your php.

The latter approach will commands will likely cause a javascript interpreter error and force you to reload the page to continue testing. I prefer the latter approach because its simpler.  However, instead of simply using the php echo or print commands, I like to create a logging function which uses file_print_contents to populate a debug log. Here’s my function:

With this function, debugging is as easy as calling your logit() function instead of using print. I typically open another window and execute a tail -f debug.log to maintain a constant view of streamed debug data.

Tip 2 – Centralize your Database Updates

Creating a single reusable function to update your database can save your years of debugging.  It also provides a single place where you can add logging features to your updates.  For example, let’s say you want to create an update_log table for the database your updating.  This table will contain a record of every column, row and table that you’ve updated along with the mechanism used to update it and the date/time it was updated.

If you’ve got your mysql_query code scattered about your project, you’re going to need to add this logic all over the place.  If you’ve centralized your updates into a single function, you merely need to add the update_log logic to your update function.

Tip 3 – Borrow Heavily but Don’t Be A Script-Kiddie

We all do it.  Why re-invent the wheel, right?  I’m referring to the common practice of code-theft.  There are copious examples of many of the required components of most application challenges you’ll come up against.  So why not?  Why not, simply grab the code and slap it into your project?

It makes perfect sense – but you need to understand the code you’re lifting if your project is going to be a successful and supportable one.

A good friend of mine introduced me to a term over 12 years go – Script-kiddie.  A Script-Kiddie is a derogatory term used to describe someone that steals scripts or code, uses them but never fully understands how they work or in some cases, what they even do.  The term is typically used in a security context.

Simply put, don’t be one.

Tip 4 – Buy a Book (or two)

There are great books out there to help you with the PHP/MySQL/ExtJS development paradigm.  Here are a few that I own:

  1. Learning Ext JS
  2. Professional JavaScript Frameworks: Prototype,YUI, ExtJS, Dojo and MooTools (Wrox Programmer to Programmer)
  3. Learning PHP, MySQL, and JavaScript: A Step-By-Step Guide to Creating Dynamic Websites (Animal Guide)
  4. PHP and MySQL Web Development (4th Edition)
  5. PHP Phrasebook
  6. JavaScript: The Definitive Guide
  7. MySQL (4th Edition)

And here’s one that’s not fully released – but looks to be pretty awesome:

Tip 5 – Use FireBug

Firebug is a fantastic FireFox browser extension that enables you to inspect HTML and javascript, and even modify style and layout in real-time. I simply can’t imagine developing javascript, HTML or CSS based solutions without it.

Here’s a good screencast which explains the basics of getting, installing and using Firebug.

This assumes you can use the fabulous FireFox browser. In some cases, you can’t. For instance – my employer does not permit use of FireFox. In those cases, you can use IE addons to accomplish a minimal amount of the same capabilities as Firebug. Another option is to leverage the ExtJS Debug Console.

Tip 6 – Modularize Your Javascript

The ExtJS development paradigm is one that lends itself to rapid production. You’re madly cutting/pasting or typing in your component syntax and you’re application begins to take on a beautiful life of its own. It’s very easy to simply keep slapping components into your main javascript file, testing, debugging, and slapping more code on. I’m guilty. My first ExtJS application has over 4300 lines in a single javascript file… ugh… I’m embarrassed. Don’t get me wrong – the app works… it’s just nearly impossible to debug.

One way to implement modular code is to leverage iframes. The managed iframe user extension makes this very easy to do. Saki’s Example Page makes use of this extension beautifully. The code to create the main viewport and the layout panels is in one javascript file, but when you click on a link in the navigation tree, the code for the main or center panel is included in an iframe. This permits you to create one main application.js file and another separate javascript code file for each of the options in your tree.

Tip 7 – Use extjs-debug-all.js and extjs-debug-base.js During Development

To use the ExtJS Framework, you simply include the basic Javascript libraries and CSS stylesheet information in your HTML document. Here’s an example:

Tip 8 – Check for Trailing Comma’s

IE is much more picky about trailing comma’s than Firefox or Safari. Since I develop on a Mac, I’m forever missing trailing comma’s. I have an ancient laptop running Windows XP that I keep around for the sole purpose of testing apps in IE. Because javascript is interpreted, not compiled, you don’t get that piece of mind that comes from passing your work through the compiler before placing it in front of the user.

9 times out of 10 when I have an error in IE, it’s because of a trailing comma. ExtJS uses objects configured using JSON like syntax. Here’s an example:

In this example myExample is an object which is configured with a function. The function in turn is configured with a return object which has parameters foo and boo. The syntax for this example is correct. Consider, on the other hand, this example:

See the difference? That one minor, trailing comma after boo: ‘far’ will cause IE to stop interpretation of the entire javascript.

One way to catch this error is to copy and paste the source code of your javascript into JSLINT.

JSLINT will return the following:

Error:

Problem at line 4 character 19: Extra comma.

boo: ‘far’,

Problem at line 5 character 6: Missing semicolon.

}

Tip 9 – Create an Automated Backup Routine for Nightly Backups

There’s nothing worse than after weeks of steady positive progress, you suddenly find yourself unable to figure out what you’ve done to break things. Having a nightly backup strategy can provide valuable insight into the path you took to get where you are now.

For nearly every large scale project, I create a simple script to backup the code and data and ship it offsite somewhere – typically back home to my home development lab.

If you’re able to create a public/private key pair and configure passwordless login between your development environment and your home machine, you can create a simple script which can be executed automatically via cron to securely copy your development work back down to your home machine.

Here’s a link to creating a secure passwordless login scheme with SSH.

Once you have that in place, here’s a little script that you can customize to create backups for your work.

This will create a fully functional copy of your web development area on your local machine. The last line of that script creates a symbolic link to the ExtJS library directory on your local machine. This assumes that you don’t want to copy down the extjs javascript library distribution every night.

Make sure you modify the following variables to customize the script for use on your local machine.

LOCALDIR – this is the local directory on your home development machine.
REMOTEDIR – this is the root directory of your development work on your client or remote machine.
LOCALEXTDIR – this is the full path to the extjs libraries on your local machine.

Once you’ve got all that setup – add your script to cron to kick it off nightly (or even more frequently.)

Tip 10 – Visit ExtJS.com Often

ExtJS.com is frequently updated with new versions, featured implementations and blog posts designed to simplify use of this great framework.

The site is well organized and has several sections specifically designed to help you getting started using the framework. The Learn section is a great place to start.

Bonus Tip – Use an Alert Service To Notify You of Updates on ExtJS.com

Since timely information is very valuable when you’re working on a project with tight deadlines, you may consider using an alerting service to tell you when new information has been added to the extjs.com site. http://www.changedetect.com is one option that offers a free web site modification alerting service.

Visio Diagram – Highly Available Database

I created this for a project at work… the actual implementation will bare little resemblance to this but I thought I’d share it. I love working with isometric designs in Visio. Although I’m befuddled as to why it’s so difficult to create isometric / slanted text. Those labels you see here were created by adding a textbox, slightly rotating it, then cutting and “paste-special”-ing as an enhanced picture/meta file. Once it’s pasted as a meta file you can stretch and slant the text along the same lines as the rest of the components in the diagram.