avoid these search engine optimization pitfalls

there are a lot of sites out there providing information on how to improve your site's visibility to the search engines. but it is just as important to know what NOT to do, as making a single mistake can relegate your site to the bottom of the search engine pit - and we all know how deep that pit is!

so here are a few things to avoid when designing/developing a site:

1. cloaking is presenting one set of content to a user, but different content to a search engine. ^[1][2] BMW did this on their german site and got nailed by google, losing an untold amount of page views while its page, rank was set to zero. ouch.

2. do not join link schemes, commonly referred to as link farms.^[1][2][6] external links play a major role in how a site is ranked^[2], but do not give into the temptation to join link farms, whose only reason for existence is to influence search rankings.^[3] being a member of a link farm can be grounds for expulsion from search engine rankings!^[4]

3. do not try to stuff extra keywords or links on the page by hiding them.^[1][2][6] the techniques used to hide text vary: matching text color with background color, sizing the font to zero, placing the text behind images, or hiding the text via css; but the results are the same - search engines will deem your site untrustworthy!^[5]

4. do no overuse keywords. keywords have a positive impact on your search ranking, but overusing them can turn this positive into a negative.^[2][7] keyword stuffing can occur in the meta tags, title tag, url and even in the page text as was found by Matt Cutts, who found 50k worth of terms, including "plasma tv advanced chart" on a page hawking eternal youth rings ^[7] So use keywords - but use them judiciously!

there is one common thread that runs through these techniques; they are all born out of a desire to game the search engine rankings. if you are concentrating on providing valid, relevant information to your audience, then none of these issues will be a problem for you.

if you are interested in reading further, a good place to start is google's own Webmaster guidelines as well as yahoo!'s Search Content Quality Guidelines.

thanks for reading.


^[1]Webmaster Guidelines, © 2009 Google, last updated: august 19, 2009
^[2]Search Engine Ranking Factors, seomoz.org, viewed on november 3, 2009
^[3]Link Schemes, © 2009 Google, last updated: june 10, 2009
^[4]Information on Link Farms, © 2008-2009 Internet Search Engine Monitoring Center, november 3, 2009
^[5]Hidden Text and Links, © 2009 Google, last updated: june 10, 2009
^[6]Yahoo! Search Content Quality Guidelines, © 2009 Yahoo!, last updated: october 27, 2009
^[7]Avoid Keyword Stuffing, © 2009 Matt Cutts: Gadgets, Google, and SEO, blog date: july, 25, 2007

multi-select dropdown boxes

those somewhat difficult to use, not-so-elegant html drop-down boxes. they perform adequately when using it as a single select drop-down box, but there are user issues when trying to select multiple items from a list. the requirement of ctrl or shift clicking, along with trying to scroll the list up and down, can often lead to a frustrating user experience; a mis-click will often require the visitor to start their selection process all over again. on a past project we had a section where we had incorporated several drop-down boxes, of which the user was able to (and very likely to) choose many of the options. the existing solution was kludgy at best.

javascript addresses the user's frustration by allowing the user to click on a selection one at a time, and with each click the chosen item is removed from the list of choices and added to a chosen list, which is easily visible. to remove an item previously chosen, you can simply click on it in the chosen list and it will be pushed back to the list of choices. this allows users to select items one at a time, while not losing any of their previously chosen items. this method also works extremely well when you have multiple drop-down lists; but there are limitations to this approach as well - see below.

see an actual demo in action at ozzis.us

one big problem with this approach is that it does not degrade to a standard select box if javascript is disabled. while this solution was built for a captive audience where we could safely ignore this and other issues, this approach as implemented would not be proper for a majority of sites. however, there are fixes for this, and my favorite would be to write this as a jquery plug-in where the data in the lists are drawn from actual select boxes.

another problem is that there is no way to make selections via keyboard, which is very important for web accessibility problems. this would be a tougher problem to solve using my approach; however, ryan cramer came up with a great solution to the problem, which is using a standard select box that incorporates a chosen list to hold items that have been clicked on by the user.

screenshot taken from ryancramer.com

javascript can be used to circumvent many of the issues associated with standard html form elements, but care must always be to remember the audience for which the site is intended. while good design is of great importance, so is accessibility.

thanks for reading. now go out and play! : )

semantic html: the definition list tags

most web developers understand and use the <ol>/<li> and <ul>/<li> tag pairs when creating lists, however when the list is comprised of a pair of related items (such as a term and a description), there is an alternative tag group: <dl>, <dt> and <dd>. the term is placed within <dt> tags, and the definition is placed within <dd> tags. these are wrapped within <dl> tags.

example code:


<dl>
<dt>Kanji</dt>
<dd>A japanese system of writing ...
<dt>Katakana</dt>
<dd>One of the two systems of syllabic ...
...
</dl>


example output:

Japanese Writing Systems^[1]

Kanji

Based on borrowed or modified Chinese characters.

Katakana

One of the two systems of syllabic writing employed for the representation of Japanese, based on Chinese ideograms. It is used mainly for foreign or foreign-derived words

Hiragana

The cursive and flowing variety of kana used in most modern Japanese texts, especially to represent inflectional endings and particles.

please note that the 'compact' attribute of the <dl> tag is now deprecated

^[1]Collins English Dictionary - Complete and Unabridged 6th Edition 2003. ccc William Collins Sons & Co. Ltd 1979, 1986 ccc HarperCollins Publishers 1991, 1994, 1998, 2000, 2003

lazy days

blogger subdomains

i ran into quite a bit of disinformation concerning how to set up your blogger blog so that it resides at blogspot.com, but is accessed from a subdomain off of your personal domain; in my case, blog.ozzis.us.

first, most of the information supplied by blogger.com is for hosting your blog at the root of your personal domain, but this was not good for me.

it turns out that setting up the above subdomain scenario is a simple, two step process.

1. go to your host provider, in my case godaddy.com, and create four DNS A records:
blog.yourdomain.com 216.239.32.21
blog.yourdomain.com 216.239.34.21
blog.yourdomain.com 216.239.36.21
blog.yourdomain.com 216.239.38.21

2. on blogger.com, go to settings -> publishing and choose to publish on a custom domain. click advanced settings and provide your blog URL, such as blog.yourdomain.com. do NOT check the Redirect ... checkbox.

you can check the status of your DNS setting via an online tool such as kloth.net. after a few hours for the dns servers to update and you should then be able to access your blog via your own personal subdomain!

carolina beach

date diff in php

it is a common task to determine the number of days from one given date to another. and with php there are a number of ways to tackle this. one of the easiest i have found is to use the gregoriantojd() function.

the gregoriantojd() function requires three parameters: month, day, year. it will return you an integer containing the julian day. once you have converted each date, it is then a simple matter of subtracting one from the other.
this will find the number of days until january 1, 2010:

$today = date("Y-m-j");
$days = datediff($today, '2010-01-01');
echo "days until january 1, 2010 is : " . $days;

now call the datediff function which calculates the number of days:

function dateDiff($startDate, $endDate)
{
    $date1=explode('-', $startDate);
    $date2=explode('-', $endDate);
    $startDate=gregoriantojd($date1[1], $date1[2], $date1[0]);
    $endDate=gregoriantojd($date2[1], $date2[2], $date2[0]);
    return $endDate - $startDate;
}