I’ve recently been taking a lot of notice of the beauty of partial transparency now available to good browsers primarily the RGBa css unfortunately not supported by the bag of crap Internet Explorer. I ended up having to find a very functional workaround for IE involving an rgba.php script that generates a partial transparent .png file which is then tiled as an old fashioned background.

Firefox, Chrome, safari all beautifully render partial transparency just that sack of shit IE that continues to be the bane of an easy design life.

As I was coming up with the initial layout photoshop mockup for Lara to approve Google released their IMO seriously cool fonts directory. I was keen to use a different font having spent ten years stuck pretty much with Arial, ,Verdana, Times and Georgia.

I have also shifted away from Windows in favour of Ubuntu and so far I have to say, I love it! fast, clean and just better. So aside from the design headaches I was also having to get used to new software primarily Bluefish, Gedit and the Gimp for graphics/photo work. My old FTP client Filezilla was available for Ubuntu so there are some familiar things around. I also extended my desktop with an additional monitor so now have a 24″ and my older 19″ running alongside each other. Productivity is certainly speeded up and dragging a window across from one monitor to the other also looks pretty cool.

So, back to the site design. Lara was very happy with the initial layout and all the over lapping transparencies bring a real depth and 3 dimensional effect. The text blocks etc all go darker when hovered, highlighting the text more clearly too and I have used a lot of jQuery. It’s a bit slower in IE as the rgba.php script has to generate the images and then the css tiles each elements background but as far as I’m concerned IE is for people who aren’t really all that bothered about their internet experience. With Firefox and Chrome easily available there is no real reason to continue to use Microsoft’s awful browser. I just don’t understand why they Microsoft seem to steer clear of supporting great CSS.

Steven Goldstar looked in his book; ‘How to spot aliens from an long way away’ and found some information in it that was meant the old man was and alien. Steven Goldstar stopped his helicopter in mid air and spin it round quick to go back to the old man but the old man was gone when he Steven Goldstar got their.!.

Steven Goldstar said to himself “If that old man is alien then shops are on danger!” so he flied really fast to get to the shops and get their before the alien did. When Steven Goldstar got to the shops there was’not any signs of the alein at all so Steven Goldstar got in the shop and speak to the shopkeeper who was an Franceman and said to him…

“Shopkeeper man! bewear! there is and alien and he his coming to your shop!” and the Franceman did’not understand Steven Goldstar and he said back “what?” (in France language) so Steven Goldstar draw picture of alien and burning shop on cardbored that was on floor and the shopkeeper understands than and closes door fast!

Suddenly the old man was at the door but on the outside of it but he did not see it was an door cos oit was all glass and he banged into the door with his face and screamed “YOu damn basterz, I kill you aLL soon when I get in shop!” and Steven Goldstar and the shopkeeper got ready for the alien to attack them inside the shop soon!

Steven Goldstar opened his rucksak and took out some guns and bombs and grenads and other wepons to fight aliens with an give some to the shopkeeper who take them from him ready to used!!!

The Alien was really mad now and burst in the shop smashin’g all the glass with his head which was now like an alien and not like an old mans head cos it had change from it camoflage and it came at Steven Goldstar an the shopKeeper with angry look in it eyes an said to them very mad “Now you will all died!!!! Raaaaaar!”

Steven Goldstar fired an gun it was a Glock at the alien and the bullets just bounced off the alien becos the alien has a electrical shiel to protects so bullets was no danger to it!

The shopkeeper also fired his guns at the alein but was too slow doing it and the alien bited of his head and he was died there and then by the alien so Steven Goldstar grabbed up a lazr rifle from his rucksack and shot the alien in the mouth from very close to it an nothing happend again so Steven Goldstar got grenads and put them on floor with pins pulled out and ran away to the back of the shop quickly!

The grenads sploded and the alein was walkin over them when they did and it got hurt badby the spolosion and laid down making sounds like an person who was hurt a lot so Steven Goldstar came back to the front of the shops and see the Alien there and saw it were hurt bad so he got up an gun and shot it 5 times in the hed and it was then still!!!!

Right at that time Steven Goldstar mobile rang and it was the local Police asking Steven Goldstar if he was ok and he said to them “I have been attacked by an alein in the shop and the shopkeeper  is ded too with the alein that i killed but I did not kill the shopkeeper the alien did it.”

the Policeofficers said do you need us to help and Steven Goldstar says back, “no need to help me, I have answered the call of dutey an killed the alien”. The policemans said then “good work Steven Goldstar you did what had to be done when Duty calls!” and Steven Goldstar said back to him “yes, but i will need and ambulance hear to take away the bodies before they smell bad!”

In 5 minutes later and ambulance arrive at the shop at it take away the shop keepr bodies but andother van turned up then for the alein and it take it away to a secret location to be studyied by Science!

Then he was very tired and Steven Goldstar went back home on his helicopter which was not even damaged a bit but he did not have any fud and drink and stuff that he was meant to got so he was in trouble with Sarah Goldstar… again.

One of the first things I found was that the “Send To A Friend” module was wide open to possible attack by automated spammers. I don’t know about you, but I am really tired of annoying captcha images that are getting harder and harder to read and being crap at maths i don’t like having to perform sums before submitting a form.

So, I thought I’d try and implement a thing called a honeytrap or spam trap, whatever it’s called it was something I’d read about.

In a nutshell it is a field in the form that has to be left blank in order for the form to process and send when the user clicks submit. If the field is filled in the form does not send and as spambots, being a bit thick, fill in every field of the form, surely this trap will catch them out.

It required a bit of hacking into the original code and a couple of lines of CSS adding to the theme/yourtemplatename/css/global.css file but all in all it was pretty quick to do.

Here are the 3 files that need to be edited:

(Remember, always create a backup of the original files before editing)

• /themes/yourtemplatename/css/global.css
• /modules/sendtoafriend/sendtoafriend.php
• /modules/sendtoafriend/sendtoafriend.tpl

I use notepad++ for editing files but line numbers may vary if your files have already been edited or are from a different version.

sendtoafriend.tpl is the template file for the front end view of the send to a friend form that is displayed. In your file find this snippet of code:

<p>
<label for="friend-address">{l s='Friend\'s email:' mod='sendtoafriend'}</label>
<input type="text" id="friend-address" name="email" value="{if isset($smarty.post.name)}{$smarty.post.email|escape:'htmlall'|stripslashes}{/if}" />
</p>

<p>
<input type="submit" name="submitAddtoafriend" value="{l s='send' mod='sendtoafriend'}" />
</p>

We’re going to add the new field for the spam trap between the email address field and the submit button (line 5 in the code above) to give us the following.

<p>
<label for="friend-address">{l s='Friend\'s email:' mod='sendtoafriend'}</label>
<input type="text" id="friend-address" name="email" value="{if isset($smarty.post.name)}{$smarty.post.email|escape:'htmlall'|stripslashes}{/if}" />
</p>

<p>SPAM Trap Please leave the following field blank</p>
<input type="text" name="begonespam">

<p>
<input type="submit" name="submitAddtoafriend" value="{l s='send' mod='sendtoafriend'}" />
</p>

This adds the new text input called “begonespam” which is fine but at this stage the field will be visible to users. Although it instructs them to leave the field blank it could be confusing and it looks kind of silly. We can use a bit of css to hide the new field, so it’s still there to catch the spambot but just not visible to the human user.

First, place the new code into a <div>, call it what you like but in this example the <div>is given the id, “begonespam” like so:

<div id="begonespam">
<p>SPAM Trap Please leave the following field blank</p><input type="text" name="begonespam">
</div>

and the following CSS is added to the global.css file

/* spam trap hidden field for sendtoafriend */
div#begonespam {

display: none;

visibility: hidden;

}

So now we have an invisible form field – (Note when you come to test the form you may want to keep the field visible to begin with to test that it works correctly. From your installation, send a product to yourself once with the field left blank and then again with it filled in to see what .)

Before testing it though, we need to edit the final file, sendtoafriend.php the form processor.

Around line 44 in your text editor (note, the numbering here is all to sh** now – if anyone knows of a nice code snippet plugin for WP let me know!) you’ll see this code:

/* Fields verifications */
 if (empty($_POST['email']) OR empty($_POST['name']))
 $error = $this->l('You must fill all fields.');

Between /* Fields verifications */ and if(empty($… add the following code:

if (!empty($_POST['begonespam'])) { return false; }

so we now have something like this:

/* Fields verifications */

 if (!empty($_POST['begonespam'])) { return false; }

 if (empty($_POST['email']) OR empty($_POST['name']))
 $error = $this->l('You must fill all fields.');

As I mentioned above, keep the new form field visible while you test it. You can either comment out the div tags or just leave the css part until you’re sure it works.

You can see, or more to the point not see, the thing in action here: Pretashop – Modified Send To A Friend Module

It’s early days to give any performance indicators but it sure is a lot nicer looking than a big old, illegible captcha image.

In this particular example I was provided the original photoshop layout by my clients graphics designer, a very skilled man indeed (who I am fortunate to continue to work alongside occasionally) but from a 100% print background handling lots of high resolution brochures, posters etc.

The layout was provided as a single layered image which meant I didn’t have the luxury of being able to grab each element as I would have done had the layout been provided as a layered .psd file. I think I also mentioned in my previous post about it also being supplied as a.pdf file :O( but hey back then I didn’t know any better. You never stop learning!

The first thing I did was take a full sized screen shot, cropped the layout out and saved it as a high res .png file. I also re captured the large photo that dominates the homepage content area and saved that as a .jpg for later use.

This gave me something a little like this:

Next I had to decide how to chop it all apart, what could be recreated using styled text and what would have to remain graphical. Unfortunately due to the non web safe font a lot of the original graphics has to remain in use (more on which later but I figured out a nice way to use text styled with CSS to look like the graphics including rollover effects) as opposed to primarily using text which is so much better for search engine optimization.

After a bit of chopping I basically arrived at this breakdown into the main sections:

• A – Header
• B – Top main navigation
• C – Main content area
• D – right column, secondary navigation
• E – Footer

I had to reconstruct some areas eg the header without the main navigation but I eventually ended up with a few individual elements that would then be built back together to display the whole, working site using XHTML, .PHP and CSS.

I had to divide the main navigation section into individual buttons and then create a darker hover state for the rollover effect. The resulting CSS required to convert what was a basic unordered list type of navigation using optimized text into the graphical representation was quite a challenge to say the least.

Each list item required a unique class so that each menu button could be given it’s own graphic hover image. Plus (by using .php) each item could be assigned a ’selected’ class to allow the darker hovered image to remain displayed to indicate the currently viewed page.

What began as a tidy, unordered list quickly became something of a rats nest of code. You can see an idea of the list items below (I’ve removed urls and title etc to clean things up a bit):

<ul>
<li class="home"><a href="#" title="title here" <?php if ($page == ‘index.php’) { ?>class="selected"<?php } ?>><span>text link</span></a></li>

<li class="something"><a href="#" title="title here" <?php if ($page == ‘something.php’) { ?>class="selected"<?php } ?>><span>text link</span></a></li>

<li class="somethingelse"><a href="#" title="title here" <?php if ($page == ‘somethingelse.php’) { ?>class="selected"<?php } ?>><span>text link</span></a></li>
</ul>

This first list items class is “home” which calls the CSS to display the homepageUP graphic (the span is given a negative margin to move the anchor text 999pixels to the left and out of sight) for the link and swap it for the homepageHOVER graphic when the link is hovered. Once the link is clicked the .php code assigns the class of “selected” and the CSS for “.home.selected” tells the browser to display the hovered image to indicate that menu item as the currently displayed page. I could have used a totally different image for the “selected” state, maybe bright red with flashing dots but time was pressing on and it works fine. Here’s the CSS:

#navTop .home a {
background-image: url(../img/homepageUP.png);
background-repeat: no-repeat;
width: 96px;
height: 34px;
}

#navTop .home a:hover {
background-image: url(../img/homepageHOVER.png);
background-repeat: no-repeat;
width: 96px;
height: 34px;
}

#navTop .home .selected  {
background-image: url(../img/homepageHOVER.png);
background-repeat: no-repeat;
width: 96px;
height: 34px;
}

This was applied to each of the five main navigation elements that were assigned a div id of navTop and saved as an included .php file navTop.php

See a demo and grab the source files: CSS text/image navigation menu using .php to assign selected class.

In my next post in this series I’ll share how I eventually got the navigation in the right column working, it was originally just whole blocks of graphics with a hover action assigned using javascript, urgh. It took me a while but in the end I did it with CSS, got the blue diamond showing and correctly overlapping the main content div.

I have “rescued” several websites for people in the last couple of years. All had fallen foul of a less than savvy/honest web designer… (see: Has a copy of Frontpage 2001, made a site for their uncle and is now a Web Designer.)

When I get a phone call or email about someones website not getting any visitors or them not getting enquiries etc the first thing I ask is;

“Does your site show up in search results?”

To which the answer invariably is,

“Yes! In fact it shows up as number one in Google.”

Impressive, so what’s the problem? If their site is showing up top spot on the worlds number one search engine why aren’t they getting any traffic?..

So my next question is;

“What search terms to you show up top for?”

“Well it’s when we type our website name in… why?”

Deep breath.

Me: “Well the thing is, it’s not very likely that someone who has never heard of you is going to type your domain name into a search engine is it?”

Client: “I suppose not, we do advertise in a magazine so people reading that will see our domain name won’t they? They’ll type it in won’t they?”

Me: “Possibly but most likely they’ll type your url into their browsers address bar and go directly to your site. What is your website about?”

Client: “We have a couple of holiday cottages in Cornwall that we rent out.”

Me: “Ok, so really you want your website to show up in search results if someone types in something like ‘holiday cottages Cornwall‘ or ‘Cornish holiday cottages‘ then.”

Client: “Yes, that would be great, I see what you mean a stranger is more likely to type that in search than our domain name aren’t they?”

Me: “Exactly, by the way what is your domain name?”

Client: “www.freddyandsandras.co.uk”

Me: “… …”

Me: “Well there’s not much we can do about your domain name, it would be better if it contained keywords relevant to your service. Would you consider registering a new domain something like cornwallholidaycottages.com?.. with keywords like that in your domain you’d be off to a much better start.”

Client: “Well we would, I see what you mean about the name but we’re already paying £30 a month for our existing domain name and hosting.”

Me: “Ouch! That’s a little on the high side but we can talk about that later. I’ve just had a quick look at your website and had a look at all the code that is used to make it all work etc and it’s a pretty bleak picture I’m afraid.”

Client: “Oh dear, we thought something must be wrong. What’s the matter with it and what will it cost to fix it?”

Me: “There are a lot of things missing that need to be included in the behind the scenes coding, some photos could be optimized better and your menu navigation needs looking at. Currently it’s just graphic buttons pointing to pages called page1.html and page2.html.

It gets a bit more involved but basically, graphics are invisible to search engines unless they’re given what called an alt tag, a textual description of the image. The alt tag further benefits by using keywords in it. The button on the navigation menu that points to the Rose Cottage page could be given the alt tag “Rose Holiday Cottage, Available For Rent In Cornwall” . then, the actual link to page1.html could be given a title tag again using some keywords to describe the link destination, Rose Cottage.

Text is much better for navigation links all round and page file names would be better called rose-holiday-cottage.html rather than page1.html. If the menu button needs to stay looking like the current graphic it can be made to look like that using a technique called CSS but that’s for another day.

Anyway I’ll put it all together and get in touch with you in the next couple of days with some ideas and suggestions rather than do it now over the phone. I’ll write up everything I can find and email it to you along with a rough idea of how long and what might be involved to fix it. I can also set you up with domain name registration and hosting for a LOT less than £30 a month.”

Client: “Ok, thanks a lot, I don’t think I’m going enjoy reading through it though. Bye for now.”

Me: “Don’t worry, the appraisal will be totally free to you and I’m sure we can come up with a fair way of taking it from there. Bye.”

And that has been kind of the way the chat went each time, a very disappointed person who had paid good money to a … well I won’t say to what. When you hear the figure £1500 mentioned plus £30 a month for hosting and you go to the site and see:

• A bunch of table cells thrown together (default borders always pleasant to see).
• Times New Roman text just resized for headers no H1, H2 etc used,
• No <head> title tag
• No meta description… a what?
• No alt or title tags used.
• Awful file names like page1.html
• Roaming navigation (homepage it’s at the top, page2 at the left, page 3 over at the right and so on) that swaps around the contents or even misses some out on some pages.
• Photos that are over 1MB but just click and dragged to fit the cell or the more advanced ones using width=”300″ to display a 3000 pixel wide image.
• A multitude of dead links, broken image links and having to constantly use the browser back button to navigate back…

Not good, and there are a lot out there – offering special discounts, £500.00 for a website that not worth £5.00

So, if you have a website that you think could do with a bit of a spring clean, drop me an email. I’ll gladly have a look.

<title>www.mywebsite.com</title>

Urghh! How many times have I seen the title tags simply filled in with the website domain name? I suppose it is better than nothing which is also often the case but…

The title is what will show in a search engine result as the large blue link. It is also the text you see in the top left corner of your web browser. If you see Untitled Document there when vieiwing your website it means you haven’t added a title tag – so get one in there, pronto :O)

You don’t have to worry about the words Untitled Document showing up in search results because they won’t… Unless search engines have become very lax these days a site so badly optimized isn’t going to rank very well at all, this is not a good thing.

Your title should include keywords relevant to the pages subject rather than the site name. These will show bold in search results if they’re the keywords the visitor typed in. Let’s say you run a website that advertises rental property in France, it’s called beaupeeps.com and your home page title is:

<title>Beau Peeps</title> or <title>www.beaupeeps.com</title>

Using your business name Beau Peeps as your title tag is pretty meaningless, it doesn’t contain one keyword relevant to the site subject. Someone searching for Beau Peep isn’t likely to be looking for a website about rental property in France, nursery rhymes maybe…

Similarly using  “Homepage” alone in your title is meaningless with regard to your business/website subject so a suggestion would be:

<title>Rental Properties In France</title>

Hey look at that! It actually tells you or more importantly your site visitor and any passing search engine spider what your website is about. See below for a typical Google search result.

Number 1 out of 6,200,000 results for that phrase… That’s what SEO is all about!

There is a limit to the number of characters (around 60) that you can use before the end of the title disappears off the edge of the search results blue link. like so:

This is a very long title tag that will eventually vanish off the edge of th…

Each page of your website should have its own title, try not to duplicate the same title for each page but remember to include keyword/s relevant to that page eg <title>Rental Properties In Brittany, France</title> on a page about property for rent in Brittany etc.

The same rules apply in your use of the meta description tag…

Upon closer inspection the ‘click here’ link within the message looks initially like www.facebook.com but when you look closer it is actually www.facebook.com.hyvsse.be  meaning that the facebook.com part of the URL is just a subdomain folder of hyvsse.be whatever the hell that is… the spammers,scammers phishers domain, certainly not Facebooks.

It’s known as Phishing, if you login via that link you’ll be giving away your login details to the lovely folks, the Phishers who set this up.

Here’s a screenshot piccy – I’ve coloured out my email address.

If you have already received this email or one similar and clicked the link you must login to your Facebook account normally and quickly change your password. Don’t panic but get it changed as soon as you can before the Phishers login and change it leaving you unable to login. Once in your Facebook account they will have access to all your messages, your friends lists etc and can do a lot of crazy things from setting a silly or offensive status for yourself to mass mailing all your friends with nasty stuff, who knows what else, to much more sinister things – some folks have Facebook linked with online payment gateways etc.

One of my passions if you like is to learn more about how to create websites that conform to a few basic rules that are 90% of the time missed out by simple page builder software and online site builders. Following these simple to implement rules usually ensures, among many other things, stuff like:

1) Showing up in search engine results pages (serps) through SEO – (here are some (not all) hot tips some people charge a lot of money to share!) keyworded image alt and link title tags, h1 & h2 tags at least for content titles and sub-titles, a good <head> title tag, text links not graphical buttons for menus/navigation, placing javascript etc in external files, adding an .xml sitemap and lastly keep using the description meta tag… although now deprecated for search engine ranking description meta does tell the search engine what text to display in the snippet shown below the blue link in the results pages. Reciprocal linking with other similar topic related sites/blogs is also vital.

2) Showing a reasonably similar appearance in the major browsers

3) Web safe colours and fonts – people go to a lot of trouble to design their site using a font they downloaded not realising it will just default to a serif or sans-serif regular font on every browser in the world on computers that don’t have that same font installed.

4) Usability for others, you might instinctively know your way around your site but a first time visitor may well be lost if you don’t follow simple rules or expectations like:

4i) Logo top left or top right (usually top-left) should always be a link back to the homepage.

4ii) Navigation menus should always remain in the same place on a page – if it’s in the left column on the homepage, keep it there on all the other pages – and be one click away from the homepage or top level pages. I hate clicking a link, getting to that page then finding all navigation has moved or vanished totally leaving me the back button on my browser as the only means of getting back… I’ll just go to Google and find a site that works, goodbye potential customer, gone for good!

4iii) Search Feature – if it’s a big site help your users find what they want with a built in search feature. Most people on ye goode olde tinterwebs are looking for something (often while at work or in a hurry), if they can’t find it on your site they will quickly go elsewhere so help them find it! Wave goodbye once again…

5) Images & links should always be given alt and title tags respectively not just for SEO but for text only browsers like Lynx and screen reader software too. Links should also be given a “focus” state similar to a hover state that tells you it’s a link (often an underline that vanishes on hover) when you hover your mouse cursor over it, the focus state is for people navigating via a keyboard and not a mouse and highlights the links when the TAB button is pressed.

1) Keywords – The words that best describe your business or service.

Hopefully you have your primary keyword/s in your domain name… No? Well it’s not the end of the world as you could use a keyworded sub-folder for a bit of SEO weight. What do I mean? Ok let’s say you’re Stan Biggleypoop, a fly fishing teacher and you can’t get hold of flyfishingteacher.com as your domain name but you can get biggleypoop.com

It’s pretty useless as a domain name from an SEO point of view for fly fishing but hey it’s your name and it’s a start. Going back to what I said about using a sub-folder, you could put all your fly fishing related pages into a folder called >fly-fishing-teacher so you would have biggleypoop.com/fly-fishing-teacher/

Always remember, search engine spiders are text only, they need to be told in words what the page is about, they won’t look at pretty pictures and cute graphics and try to figure out what the page is about. Make it hard for them and they simply won’t index your page properly, they’ll get bored and go elsewhere.

1b) To further increase keywords use aside from them in your text content is to use both the title and alt tags within your images and links. If there’s a photo of you in all your fly fishing gear standing by the river proudly holding a huge trout make sure you give the image an alt tag that includes the words “fly fishing teacher” so don’t just use something like alt=”trout” use wording like alt=”Fly fishing teacher Stan Biggleypoop holding a record trout”. Go one further and make sure the photo file name contains a keyword or two, don’t just call it image1.jpeg

1c) All links within your pages should contain keywords in the link name, anchor text and use title tags with keywords to describe the page they are linking to, eg the Fly Fishing Equipment link pointing to the equipment page should be constructed something like;

<a href=”fly-fishing-equipment.html” title=”Fly Fishing Equipment”>Fly Fishing Equipment</a>

All three elements of the link, the target page, the title and the anchor text all contain keywords and that has to be better than;

<a href=”page2.html” title=”">page 2</a>

2) Page Title

Sat up there at the top of your page html between the <head> </head> tags lies the humble looking title tag. Bless it, it doesn’t look much and people don’t always use it… that’s when you see the legend Untitled Document at the top left of your browser.

<shout>YOU MUST ALWAYS USE IT!!!!!</shout>

The words in the title tag are the words that show as the big blue link in search engine results, is anyone going to click a search result like this?

Untitled Document <– crap! title
Blah blah blah etc etc etc waffle drone rant. <– description see 3 below
www.biggleypoop.com/page2.html <— also crap!

Don’t worry about nobody clicking your link, it will never show up in search high enough for anyone to find it in the first place…

<title>Fly Fishing Equipment</title> it takes but a second of time.

3) Description Meta Tag

This might be a grey area for some folks who think the age of the meta tag is dead. Meta tags maybe don’t carry the weight they did at one time for getting ranked in search results but I still think the description tag has it’s place. I wrote about elsewhere in my post, Description meta tags… should they be ignored?

I would say continue to use the description meta tag in your website, as before give it some keywords, it is after all the text that appears below the big blue link in the search results… Better that it says what you want it to say than let the search engine grab any old random snippet of text .

SEO checklist end of part 1…

There is more that can be done and I’ll continue to add bits and bobs of info here in time but to re-cap those first few points:

• keywords – domain and/or sub-folders
• keywords – image alt and link title tags (including photo & page file names)
• page title – keywords
• description meta tag – keywords

Look at those and you’ll see the common denominator is keywords, we all know about keywords importance but it’s where they get placed that is just as important. Check those ideas first and you’ll make a significant difference to how your site appears to search engines.

You’ve seen the search results, something like this:

Nice Keyword Title (from the <title> tag)
Here’s the keyword text that is taken from the description keyword rich meta tag with more keyword text here from the description keyword rich meta tag.
http://www.mykeywordwebsite.com

You can see how keywords used in the search are highlighted bold in the search results if they’re there in the site title, description and url. All those extra bold keywords within the result naturally draw a persons eye to it. It might not be the top result on page one of Google but it might stand out more than the top result!

My point is the description meta tag is used by the search engine to display the text below the search result link… This means you can control what the search engine result shows the person searching.

If the description meta tag is left blank or removed totally the search engine spider will just grab some random text snippet from the page and display that. You might be lucky and it’ll grab something useful but it might be some crud from your site footer.

In my opinion the description meta tag should still be used to describe the page and include the keywords you want to show up in search results.