Beanstalk on Google+ Beanstalk on Facebook Beanstalk on Twitter Beanstalk on LinkedIn Beanstalk on Pinterest
Translate:
Published On:
SEO articles and blog published on ...
Hear Us On:
Webmaster Radio
Blog Partner Of:
WebProNews Blog Partner
Helping Out:
Carbon balanced.
Archives
RSS

XMLRSS

Is your business wearable aware?

Has your SEO been mentioning Mobile/Tablet apps and designs a lot?

SEO Concerns for Mobile Websites – August 16th, 2013

Google Q3, Mobile Ads & Hummingbird – October 21, 2013

I For One, Welcome Our Google-Android Overlords! – May 3, 2011

Who needs a mobile website? – June 23, 2009

It seems like YEARS of nagging, so why haven’t you made the moves? Are you waiting for the mobile fad to die?

In 2012 Google dropped the bomb that Android installations had hit the 400 million mark with a pretty snazzy video:
[iframe width="549" height="309" src="http://www.youtube.com/embed/1UhGM2us8eA?rel=0" frameborder="0" allowfullscreen][/iframe]

Then in 2013 Google did another high-def video announcing they more than doubled the install base in just one year to 900 million installs:
[iframe width="549" height="309" src="http://www.youtube.com/embed/1CVbQttKUIk?rel=0" frameborder="0" allowfullscreen][/iframe]

While I haven’t seen a video for 2014 yet, I can only imagine that we are in the billions of installs now and here I am still trying to get business owners to see that even if this was a fad, it’s worth being part of, in a big way.

Need more ammo to dig into the mobile ‘fad’? How about Google going public with the Wear SDK for Android?

On Tuesday, March 18, 2014, the Offical Google Blog published:

Today we’re announcing Android Wear, a project that extends Android to wearables. And we’re starting with the most familiar wearable—watches.

Google is not only ‘gearing up’ with the recently acquired Motorola Mobility division, but it’s also working with hardware partners like Samsung, LG, HTC, Asus, and major brands in the chipset manufacturing/fashion industry to make sure that top tier products will soon be available from multiple brands, with high tech and high fashion rolled into a desirable wearable.

The ‘Information that moves with you’ video, aimed at consumers, is a bit ‘goofy’ and the shrug at the end sums up how I feel about these demonstrations of fledgeling hardware innovations.

However the developer preview video is where I would like business owners to focus their attention:
[iframe width="549" height="309" src="http://www.youtube.com/embed/0xQ3y902DEQ?rel=0" frameborder="0" allowfullscreen][/iframe]

This video is FAR more interesting in that what we want to do is get behind this tech before our competition, supporting not just early adopters, but also getting the recognition that comes from being first to market with a solution.

As an SEO, Beanstalk has to constantly monitor and appraise site health and rankings for a number of our client websites. Right now we’re just testing our automation and only publish monthly reports focused on key areas of interest, but that’s going to change as we push our abilities.

Worried about negative SEO tactics? Very soon we should be able to offer a unique level of protection for our clients with respect to instant alerts for a spike/drop in backlinks/no-follow flags on backlinks. If you suddenly lost 100s of backlinks overnight and there was a spike of backlinks becoming no-follow, wouldn’t you want that info immediately?

Want to watch for syndication of an article or keyphrase with some special criteria? We would be able to get that outreach info to you instantly on the Wearable SDK thanks to the scripts and tools we’ve purchased and developed for maintaining our client’s web rankings.

Obviously our client’s core SEO needs always come first and we’re in the midst of a server hardware rollout so I can’t say “check back next week” but I can say to expect more from us soon!

SEO news blog post by @ 2:08 pm on March 19, 2014


 

Google Chrome can point out ‘Noisy’ tabs..

Have you ever had a bunch of tabs open, decided to turn on your speakers/put on your headphones, only to find out that there’s something unexpected making sounds but you don’t know what?

[iframe width="550" height="413" src="http://www.youtube.com/embed/IWCvwwD6cto?rel=0" frameborder="0" allowfullscreen][/iframe]
Most annoying demonstration possible..

 
Viola! When you play HTML5 audio in a tab the browser animates the favicon to indicate this. (No, this doesn’t mean Chrome supports animated favicons yet, that’s still not working.)

Now I cheated and used a ‘canary build’ of Chrome to accomplish this, but really, other than working on cleaner animations/UI, this is a ‘must have’ option for all browsers!

I also took the time to show that it’s not ‘visualizing’ the audio in the tab (that would suck up too much CPU resources) but merely drawing on the favicon to indicate that the tab was recently attempting to play audio.

The new build of Chrome apparently also has an icon to indicate when a tab is recording, but I didn’t have any easy examples for demonstrating that option.

One of the things I stumbled on in the process of making this post was too note-worthy to not include in this post.

The ‘canary build’ of Chrome doesn’t use your default Chrome profile, and it can run side-by-side with your currently installed ‘stable’ version of Chrome with no cross-talk.

This meant that I was plopped into the YouTube TV/Movies when I went looking for a video to play, and I stumbled on this bargain:

Red Dawn in 480p for $20 CDN

Clearly YouTube needs to work out some pricing errors because I could get a blu-ray of Red Dawn for $20 brand new, and they go for $8 used online. Seeing that the HD version is $5 more really leaves me wondering how the error was made..

Patrick Swayze

Is it possible there’s a Patrick Swayze fan on the YouTube Movies team?

“Nobody put’s Red Dawn in the discount corner!”

UPDATE: Apparently someone DOES read this, and apparently I am not keeping up on movie releases. This is the 2012 ‘Red Dawn’, a REMAKE of the 1984 original, where the reds are North Koreans, and the plot involves an EMP attack that makes a ground invasion a ‘teeny tiny’ bit more plausible.

SEO news blog post by @ 12:27 pm on February 26, 2013


 

That escalated quickly: Google Glass prices, dates, and a spec leak?

I’ve talked about Google Glass already, Finnish them! (Google Glasses and WiFi Liabillity), Google Chronos?, Google develops ARGs for Pirates, many times..

In those articles we were mostly looking at patents and prototypes.

Now we have WIRED.COM and arstechnica.com both spewing out specs based on more patents and some developer info…

A bone conduction listening device.
Hello? Can you ear me?
  • 802.11 b/g 2.4 GHz WLAN
  • Bluetooth ver 4.0 low-energy radio
  • “Bone Conduction” audio playback
  • a $1,500 (£962) price tag
  • developer shipments in early 2013
  • a projected 2014 launch date

Breaking this down, we learn a fair bit from each fact we can establish.

802.11 b/g support means that N mode WiFi won’t likely be supported, and the best guess would be the it’s getting dropped due to power consumption. Additionally, there’s a rumor that the primary data connection for the Google Glass will be a tethered cell phone acting as a ‘modem’ of sorts to expand the Google Glass’s communications range without bulking it up.

The 4.0 version of the Bluetooth radio stack is an exceptionally good match for a device running off of batteries, that sits on your head. This version of the Bluetooth stack supports BLE – Bluetooth Low Energy mode operations that allow a device like Google glass to sip on power and still remain connected to other devices.

If Google Glass had an option to support class 1 (100mW transmissions) networks it would supply you with a range of up to 328′ or 100 meters. If you were a household cleaner you could leave your phone in a central location, put on your Google glasses, and record your cleaning efforts directly to your phone or relay it to a remote server. By doing this you could safe guard yourself against damage claims and other issues presented by the homeowners.

In fact you could also be listening to some music, without blocking your ability to hear other sounds, like a knock at the door, or someone coming home. This is because the Google glass does not block incoming sounds/cover your ears.

The ‘bone conduction‘ audio drivers on the Google Glass send audio vibrations via your skull bones to your inner ear which then ‘hears’ the vibrations as sound.

This means that if you are driving, biking, walking, etc., you can expect the Google Glass audio feedback to be less of an obstruction/safety risk than typical in-ear or over-ear style systems.

Picture wearing these as a lawyer, and someone is attempting to hold you to words you’ve never even said. You could jump to the date/time the original discussion occurred and play it back verbatim, clearing up any mistakes/poor recollection that might otherwise cause endless headaches.

The trick in this case, since a lawyer/doctor, couldn’t ethically record video to an insecure/public location like a ‘Google Hangout’, would be for Google to either offer some sort of private video storage/search/retrieval service (I hear they have some experience with video?), that has the sufficient security clearances to avoid any concerns about storage.

The $1,500.00 price tag is for the Developer’s build of the device, currently being called the ‘Explorer Edition’, that will be shipping this year. In fact Google has said “early this year” as the date, so “sooner than later” is a fine guesstimate.

The signup for the Explorer Edition was actually quite the event, while the attendees were sitting in the conference center Google dropped some ‘Glass’ equipped sky-divers onto the site from an overhead balloon. The video from their Glass units was then streamed inside the event for a bit of a surreal effect.

At the end of the conference the developers willing to pay the $1,500.00 price tag were given a specially etched slate of glass with the serial # of the unit they will be shipping to you later.

A glass brick with a serial number etched into it.
Ooooh my precious.. So shiny..

SEO news blog post by @ 10:44 am on February 7, 2013


 

Are you Modern? Take the test!

modern.IE Logo

Two pro-Microsoft posts in one week? I know, Right?!

Clearly we are not masters of fate or IT news, so today’s headline is covering the new modern:IE Test Site setup to assist web developers with creating IE compatible site content.

Wasn’t it like, two days ago that I just pointed out that the big flaw with IE is that the old versions create a web design nightmare? *tap tap* .. Apparently this thing is turned on?

What does it test?

Actually the tool is a suite of tests with some specific test cases for IE browser specific issues.

Here’s a list of categories it will test and report on without setting up a ‘Site Owner’ account:

  • Fix common problems from supporting old versions of IE:
  • Known compatibility issues
  • Compatibility Mode
  • Frameworks & libraries
  • Web standards docmode
  • Help this webpage work well across browsers, across devices:
  • CSS prefixes
  • Browser plug-ins
  • Responsive web design
  • Browser detection
  • Consider building with some new features in Windows 8:
  • Touch browsing default
  • Start screen site tile

If you plug your URL in the page will test all these areas and report back to you where improvements could be made.

Additionally there is a direct link to the ‘Pinned Site Tile’ testing/design tool.

This tool lets you select an image (144×144 pixel PNG) and text for your website when a Windows 8 user wants to ‘Pin’ the site to their start menu.

My experience with the tool wasn’t great, likely due to some caching, but if you test your code against sites that do work properly you can still sort out the needed meta tags quickly enough.

Other Goodies?

Included in the suite is a link to the Internet Explorer Test Drive site to compare HTML5 features and performance with other browsers..

 
Technically, I ended up short on time to cover more, so if you dive in and start to wonder why we didn’t point out something new/interesting, feel free to let us know, we’re always open to feedback. :)

SEO news blog post by @ 12:20 pm on January 31, 2013


 

Free Ranking Reports on Google!

I keep seeing people ask for their rank, asking what the best free ranking tools are, etc., like it’s so darn hard to ask Google where your website is in terms of it’s keywords.

First of all, Google Analytics has an ‘Average Position’ column for popular search queries that tells you a lot of great info about your site’s keywords.

Google WMT Search Queries chart
This is an example of Search Queries sorted by Average Position

 
The link to this area is:
https://www.google.com/webmasters/tools/top-search-queries?hl=en&siteUrl=
+ your URL.

Our website link would look like this:
…earch-queries?hl=en&siteUrl=http://www.beanstalk-inc.com/

You can also click at the top of the position column to sort it, or tack this onto the end of the URL:
&grid.sortBy=8&grid.currentOrder=2d

If you aren’t getting enough data from this, first try out the download options, and load them up in a spreadsheet so you can sort/filter the data.

Most folks are surprised what a little bit of filtering and grouping can accomplish to provide you with a fresh perspective on data.

Still not enough? Well there’s a zillion free tools that will gladly trade your URL and keyword targets for a limited ranking report.

This is valuable data, so why not trade something free for it? Google does!

Indeed there’s enough free tools, that I won’t even bother mentioning one. Why don’t we just make one?

It’s not ‘hard’ to get your rank really, lets break it down:

  • Make a list of phrases you are trying to rank for
  • Do a Google search for your first phrase
  • Keep searching until you find your site
  • Take note of the position
  • Repeat

So how does the average person do this? It’s gets pretty technical, but all the resources are out there, and free!

To break that down in simple terms:

  • Setup a server or install XAMPP
  • Setup a database/table to store your rankings by date
  • Make a page that CURLs for your keywords
  • Setup a schedule to execute the php page regularly

Bingo, you now have your own ranking reports tool, and nobody is the wiser, besides Google, and they are usually too busy to care that you’re extra curious about your rankings.

Nerd reading a book

Don’t get me wrong, there’s a lot of fine details to explain and not everyone is comfortable installing programs like this or scripting, but I am going to look at getting permission to make this a step-by-step how-to guide with full downloads so even novices can give this a try.

A final point to make is that excessive/automated queries on Google is a breach of their TOS, and could result in annoying blocks/complaints from Google if you were to attempt to use this method for a large set of keyword phrases, or wanted the reports updated constantly.

If you are a ‘power user’ who needs a lot of data, you’ll end up paying someone, and either you pay to use someone’s API key at a premium, or you get your own API key from Google and only pay for what you use.

Seems like an easy decision to me!

SEO news blog post by @ 1:03 pm on January 24, 2013


 

Missing Authorship Photos?

If you’ve become accustomed to seeing your charming mug in the SERPs when you are Google’ing your keywords, it might be rather unsettling to see those images suddenly disappear.

Rich Snippet SERP example

Fear not! This isn’t something you have done, or not done, this is actually kicking up a bit of fuss on the SEO forums/discussion areas today and clearly looks to be an issue on Google’s end.

In fact if you were in need of reassurance, all you have to do is hop into your Webmaster Tools account, and visit the ‘Rich Snippets Tool‘ to get a preview of what your SERPs would normally look like.

If you are sure that you’re not part of the current issue, or you’re just curious what we’re talking about, the Troubleshooting Rich Snippets page is a great resource to tackle possible problems.

Google invests another $200,000,000.00 in renewable energy..

I could have written .2 billion, or 200 million, or even 200 thousand thousands, but why play with such a large sum of money?

Google certainly isn’t playing around; With this latest investment Google’s grand total in renewable/clean energy is over $1 billion US and growing.

This isn’t just charity either, some of these investments are just smart business because the returns are very fixed and low risk.

Illustration of power saved by using GMail vs. Postal Mail

Being honest about pollution is brave, and bragging about your low footprint is begging for trouble, but Google marches on stating:

“100 searches on Google has about the same footprint as drying your hands with a standard electric dryer, ironing a shirt, or producing 1.5 tablespoons of orange juice.”

You can read more about Google’s efforts to reduce, eliminate, and assist others with power consumption/carbon footprints, over on the Google Green Pages.

SEO news blog post by @ 11:57 am on January 10, 2013


 

Windows 8 / IE10 and Flash Certification

Windows 8 is a tablet OS, and like any modern OS focused on tablets/touch/mobility options, there’s compatibility concerns with content not specifically written for a tablet/mobile device.

Apple’s famous for their certification process and using it for more than just the sake of ‘quality’ or ‘compatibility’ controls.

Indeed Microsoft has had certification for drivers, and applications in Windows for some time, but never to the point where something cannot be used without their certification.

If you wanted to install something that isn’t certified you’ll get a spooky warning, but I’ve never seen something completely fail to work due to a bad/missing certification on Windows.

Enter Windows 8 and IE10, a whole new ballgame, with two browser modes, one for normal use and a ‘desktop’ integration mode which has to play nice with the new Windows UI.

If you wish to publish web content that leverages the new ‘desktop mode’ you’ll want to visit Microsoft’s ‘developer guidance’ page for information on new meta tags and HTTP header codes that help flag such content.

In a nutshell they explain that either the header:

X-UA-Compatible: requiresActiveX=true

OR the meta tag:

<meta http-equiv="X-UA-Compatible" content="requiresActiveX=true" />

… work to create a handy little prompt explaining that the content on the page requires the page to be viewed in ‘desktop’ mode, and even gives a single-click shortcut to switch over:

IE10 desktop warning

The same page also deals with ‘Compatibility Verification’ and the steps to test/certify that your flash content is compatible with the extra features of a tablet OS.

Of particular interest is the option of a single registry entry that allows testing of your site for ‘debugging’ to see just how broken your flash content is.

The key is located here:
HKEY_LOCAL_MACHINE\Software\Microsoft\Internet Explorer\Flash\DebugDomain
.. and if you wanted to make a .reg file for easy access the contents would be:
REGEDIT4
**Blank Line/Carriage Return**
[HKEY_LOCAL_MACHINE\Software\Microsoft\Internet Explorer\Flash\DebugDomain] @="www.mywebsite.com"
**Blank Line/Carriage Return**

At that point you could right-click the .reg file you made and click on ‘install’ from within the pop-up menu.

Passing this .reg file to your developers would be fine, but since only one site can be specified, this is NOT a solution for your end users.

Obviously the best advice we can give, as SEOs, is to ditch your Flash content completely.

HTML5 with all it’s perks can replace almost anything you’ve done in Flash and Google’s even willing to help you make the switch by offering the Swiffy Flash -> HTML5 Conversion Tool.

If you feel your content is too sophisticated for Swiffy, or you haven’t tried the tool recently, you should!

Here’s an example of how well the tool works on a flash game with keyboard and mouse controls:

[iframe src="https://swiffypreviews.googleusercontent.com/view/gallery/example3_swiffy_v4.9.html"][/iframe]

SEO news blog post by @ 12:07 pm on October 11, 2012


 

Particle Physics and Search Engines

If you’ve been hiding under a rock then you may not have heard the news of the ‘God Particle’ discovery.

As someone who is fairly scientific, I look at this as more of a proof of concept than a discovery, and ‘God’ really needs to give Peter Higgs some credit for his theories.

 
I won’t dwell on the news surrounding the Higgs boson particle confirmation, but there are parallels between objects colliding and revealing previously unseen matters.

When Search Engines Collide

It’s been some time since Bing and Yahoo merged, so the data sets should be the same right?

No. That would really be a wasted opportunity, and Microsoft is clearly smarter than that.





 
By not merging the search data or algorithms of Bing and Yahoo, Microsoft can now experiment with different updates and ranking philosophies without putting all it’s eggs in one basket.

An active/healthy SEO will be watching the updates to search algorithms from as many perspectives as possible which means a variety of sites on a variety of topics tracked on a variety of search engines.

Say a site gets a ton of extra 301 links from partner sites, and this improves traffic and rankings on Bing, causes a stability of movement on Yahoo, and a drop in traffic on Google?

It’s possible to say that the drop on Google was related to a ton of different factors, untrusted links, link spam, dilution of keyword relevance, keyword anchor text spamming, you name it. This is because Google is always updating and always keeping us on our toes.

Bring on the data..

Lets now take the data from Bing and Yahoo into consideration and look at what we know of recent algo changes on those search engines. This ‘collision’ of data still leaves us with unseen factors but gives us more to go on.

Since Bing has followed Google on some of the recent updates, the upswing on Bing for position of keywords would hint that it’s neither a dilution of relevance or spamming on the keywords/anchor text.

Stability on Yahoo is largely unremarkable if you check the crawl info and cache dates. It’s likely just late to the game and you can’t bet the farm on this info.

What about the other engines? Without paying a penny for the data we can fetch Blekko and DDG(DuckDuckGo) ranking history to see what changes have occurred to rankings on these engines.

Since Blekko is currently well known to be on the warpath for duplicate content, and they are starving for fresh crawl data, a rankings drop on that service can be very informative especially if the data from the other search engines helps to eliminate key ranking factors.

In the case of our current example I’d narrow down the list of ranking factors that changed on the last ‘Penguin’ update and contrast those with the data from the other engines and probably suspect (in this example) that Google is seeing duplicity from the 301s, something Bing wouldn’t yet exhibit, but Blekko would immediately punish as badly or worse than Google.

The next step would be to check for issues of authority for the page content. Is there authorship mark-up and a reciprocal setup on the author’s end that helps establish the trust of the main site content? Does the site have the proper verified entries in Google WMT to pass authority? Barring WMT flags, what about a dynamic canonical tag in the header, even as a test if it’s not already setup?

Start making small changes, watch the results, and be patient. If you’re not gaming Google and you’ve done something accidental to cause a drop in rankings, you need to think your way through the repairs step by step.

It’s not easy to evaluate but the more data you can mash-up, and the better you understand that data, the closer/quicker you can troubleshoot ranking issues and ensure that your efforts are going to be gains.

SEO news blog post by @ 12:12 pm on July 5, 2012


 

Chromecraft? Build With Chrome!

I’ve always said that Minecraft is like digital LEGO® that you can save and share with friends. Sure Minecraft is increasingly fun to play and actually ‘collect’ the bricks, but at it’s core it’s a lot like LEGO®.

The problem with Minecraft is that we don’t all share the same map. Some servers try to accommodate everyone, but I don’t think there’s any way that a single map could support everyone playing on it. This means that you could build something incredible, like Castle Black from Game of Thrones, that nobody ever comes across. Bummer.

Enter the new Build With Chrome website from Google and LEGO®! That’s right! My favourite browser mixed with my favourite game!

Right now the ‘world map’ is limited to Australia and New Zealand, but each tile of the map becomes ‘owned’ by the first person to build on it, so they will have to make the map bigger soon!

I gave it a go and started to get used to the controls pretty quick, but really found some polish lacking, at least on my work PC which isn’t rigged up for 3D graphics.
Build with Lego

What’s this got to do with SEO opportunities? Well web presence is all about putting your company on-line, and when the whole world map is available to build on, you can guess what’s going to be built on our square? :)

Already this morning there’s a land rush and the tiles are all getting claimed. So if you wanted to plant your flag in Australia, you better hurry up before all the shrimp are gone from the BBQ.

Heck you can just sit back and watch as people’s published ‘builds’ are approved and start popping up on the map. Really neat work from Google!

As the name suggests, it’s a lot of HTML5 web content that’s been designed to work well with Chrome. So far I’ve tried it on Opera and Firefox with errors both times, leaving me to suggest that ‘buildwithchrome.com’ is a ‘chrome only’ site for now. :)

Other news..

Yep it’s been a bit slow on our blog lately, but there’s lots of buzz from Google IO, and the latest services like Google Now that we’ll be talking about very soon!

I’ve also been working behind the scenes on the programming posts so if you enjoyed our last one there’s more to come and they all touch on SEO implementation so there will be something for everyone.

SEO news blog post by @ 10:26 am on July 3, 2012


 

TECHNOlogy: What is AJAX? Baby Don’t Hurt Me!

Wikipedia defines AJAX (Asynchronous JavaScript And XML) as:

A group of interrelated web development techniques used on the client-side to create asynchronous web applications.

What a mind-numbing description! What you need to know is that AJAX is the combination of a several technologies to make better web pages.

If you have no interest in making websites but you like techno music, or you’re curious why I picked that title, this is for you:

This is a good soundtrack for this post. You should hit play and keep reading.

After a bit of time with HTML/CSS I started to build a growing list of issues that I couldn’t solve without some scripting.

I learned some PHP, which wasn’t tricky because it uses very common concepts. Here’s the traditional ‘hello world’ example in PHP:

<?PHP echo ‘Hello World’; ?> = Hello World

.. and if I wanted to be a bit more dynamic:

<?PHP echo ‘Hello World it is ‘.date(‘Y’); ?> = Hello World it is 2012

Because PHP is only run when the page is requested, and only runs on the server side, it’s only the server that loads/understands PHP; The browser does nothing with PHP.

With PHP code only seen by the server, it’s a very safe way to make your pages more intelligent without giving Google or other search engines a reason to be suspicious of your site.

In fact one of the most common applications of PHP for an SEO is something as simple as keeping your Copyright date current:

<?PHP echo ‘Copyright© 2004-’.date(‘Y’); ?> = Copyright© 2004-2012

Plus when I need to store some information, or fetch that information, PHP isn’t that easy, so I added MySQL to the mix and suddenly my data nightmares are all data dreams and fairy tales (well almost). I won’t dive into MySQL on top of everything here, but lets just say that when you have a ton of data, you want easy access to it, and most ‘flat’ formats are far from the ease of MySQL.

But I still had a long list of things I couldn’t do that I knew I should be able to do.

The biggest problem I had was that all my pages had to ‘post’ something, figure out what I’d posted, and then re-load the page with updated information based on what was posted.

Picture playing a game of chess where you are drawing the board with pen and paper. Each move would be a fresh sheet of paper with the moved piece drawn over a different square.

PHP can get the job done, but it’s not a very smart way to proceed when you want to make an update to the current page vs. re-drawing the whole page.

So I learned some JavaScript, starting with the basic ‘hello world’ example:
<span onClick=”alert(‘Hello World’);”>Click</span>

hello world javascript alert box

 
If I wanted to see the date I’d have to add some more JavaScript:
<script language=”javascript”>
function helloworld()
{
var d = new Date();
alert(‘Hello World it is ‘ + d.getFullYear());
}
</script>

<span onClick=”helloworld();”>Click

Hello World it's 2012 alert box example

 
JavaScript is ONLY run on the browser, the server has no bearing on JavaScript, so the example above won’t always work as expected because it’s telling you the date on your computer, not on the server. How would we see the date of the server?

This is where AJAX comes into play. If we can tell the browser to invisibly fetch a page from a server and process the information that comes back, then we can combine the abilities of JavaScript, PHP, and MySQL.

Lets do the ‘hello world’ example with AJAX using the examples above.

First you would create the PHP file that does the server work as something witty like ‘ajax-helloworld.php’:
<?php echo ‘Hello World it is ‘.date(‘Y’); ?>

..next you’d create an AJAX function inside the web page you are working on:
<script language=”javascript”>
function helloworld()
{
var ajaxData; // Initialize the ‘ajaxData’ variable then try to set it to hold the request (on error, assume IE)
try{
// Opera 8.0+, Firefox, Safari
ajaxData = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxData = new ActiveXObject(“Msxml2.XMLHTTP”);
} catch (e) {
try{
ajaxData = new ActiveXObject(“Microsoft.XMLHTTP”);
} catch (e){
// Something went wrong
alert(“Your browser broke!”);
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxData.onreadystatechange = function(){
if(ajaxData.readyState == 4){
alert(ajaxData.responseText);
}
}
ajaxData.open(“GET”, “ajax-helloworld.php”, true);
ajaxData.send();
}
</script>

Only the purple text is customized, the rest of the function is a well established method of running an AJAX request that you should not need to edit.

So we have a function that loads the ‘ajax-helloworld.php’ page we made and then does an alert with the output of the page, all we have to do is put something on the page to call the function like that span example with the onClick=’helloworld();’ property.

Well that’s all neat but what about the ‘X’ in AJAX?

XML is a great thing because it’s a language that helps us with extensible mark-up of our data.

In other words XML is like a segregated serving dish for pickled food that keeps the olives from mixing with the beets.

Going back to our ‘hello world’ example we could look at the ‘date data’ and the ‘message data’ as objects:
<XML>
<message>Hello World it is</message>
<date>2012</date>
</XML>

Now, when the AJAX loads our ‘ajax-helloworld.php’ and gets an XML response we can tell what part of the response is the date, and which part is the message. If we made a new page that just needs to display the server’s date, we could re-use our example and only look at the ‘date’ object.

For some odd reason, most coders like JSON a lot, and this makes it really common to see AJAX using JSON vs. XML to package a data response. Here’s our XML example as a JSON string:
{“message”:”Hello World it is”,”date”:”2012″}

Not only is it really easy to read JSON, because JavaScript and PHP both understand JSON encoding it’s really easy to upgrade our ‘hello world’ XML example over to JSON format.

Here’s the new PHP command file ‘ajax-helloworld.php’:
<?php
$response = array(“message” => “Hello World it is”, “date” => date(‘Y’));
echo json_encode($response);
?>

The output of our AJAX PHP file will now be the same as the JSON example string. All we have to do is tell JavaScript to decode the response.

If you look back at this line from the AJAX JavaScript function example above:

if(ajaxData.readyState == 4){
alert(ajaxData.responseText);
}

This is where we’re handling the response from the AJAX request. So this is where we want to decode the response:

if(ajaxData.readyState == 4){
var reply = JSON.parse(ajaxRequestAT.responseText);
alert(‘The message is : ‘ + reply.message + ‘ and the date is : ‘ + reply.date);
}

Now we are asking for data, getting it back as objects, and updating the page with the response data objects.

If this example opened some doors for your website needs you really should continue to learn more. While the web is full of examples like this, from my personal experience I can honestly tell you that you’ll find yourself always trying to bridge knowledge gaps without a solid lesson plan.

Educational sites like LearnQuest, have excellent tutorials and lessons on AJAX and JavaScript including advanced topics like external AJAX with sites like Google and Yahoo. Plus LearnQuest also has jQuery tutorials that will help you tap into advanced JavaScript functionality without getting your hands dirty.

*Savvy readers will note that I gave PHP my blessings for SEO uses but said nothing of JavaScript’s impact on crawlers/search engines.

Kyle recently posted an article on GoogleBot’s handling of AJAX/JavaScript which digs into that topic a bit more.

With any luck I’ll get some time soon to share a gem of JavaScripting that allows you to completely sculpt your page-rank and trust flow in completely non-organic way. The concept would please search engines, but at the same time cannot be viewed as ‘white hat’ no matter how well it works.

SEO news blog post by @ 11:19 am on June 14, 2012


 

Older Posts »
Level Triple-A conformance icon, W3C-WAI Web Content Accessibility Guidelines 1.0 Valid XHTML 1.0! Valid CSS!
Copyright© 2004-2014
Beanstalk Search Engine Optimization, Inc.
All rights reserved.