Jingho Projects - Small business project management

is online now!

Please check my latest opensource project management tool on:

http://www.jingho-projects.com

have fun

Making nice webpages with AJAX always has one very big disadvandage… you click the backbutton once and swooptywoop your gone and the webpage too. Therefor its very important while making webapplikations to overthink this issue from the start of your project.

There are a few known History Frameworks:
http://code.google.com/p/reallysimplehistory/

http://www.contentwithstyle.co.uk/content/fixing-the-back-button-and-enabling-bookmarking-for-ajax-apps

http://codinginparadise.org/weblog/2005/09/ajax-history-libraries.html

http://erik.eae.net/

They are probably all very good but not very easy to understand in a few seconds… therefor I used the smallest of them all the Hash Listener library from Erik Arvidsson.

But I couldn’t find any usefull examples on the internet, there for I made a small version of this Homepage with all you need to be able to use the back button properly and even react on bookmarks.

Check the demo
Download the full example

You can use the code how ever you want to, just dont forget to link back to this article or to my hompage.

Download Haslistner.js

As I search the internet for this question I didnt really find an answer. Some say google does read the urls within javascript (though the experimental example was a javascript tag within a <a href> tag.
Others say that sometimes google does even catch DOM contents but treats it negatively.

For my experiment I hope google doesn’t read javascript.

What did I do?
The Homepage I made here contains normal <a href Links with out any Javascript within the hrefs. At the end of the page I load a Javascript file which reads my links and replaces the href tags with javascript tag like this:

for (var i = 0; i<5; i++)
{
aLink[i] = document.getElementById(’link’ + (i+1));
}

function ChangeLinks()
{
var allLinks = aLink.length;
for (var i = 0; i<allLinks; i++)
{
aLink[i].href=”javascript:LoadPage(” + i + “);”;
}
}
ChangeLinks();

If you check the resource code of the page you will find ordenary html Tags, but if you mouseover the menu you will see that they are not, they changed into little Dom readers.
There for I hope google doesnt read javascript, I would be very astonished if a roboter could can first read an html href tag, then gets the javascript file and understands the link with the javascript href change and the tag before. Get it?
But how knows its an experiment and I dont know the outcome yet.

Though how can this work? For google will read the href which is an url and the content being pulled in with ajax, do we need 2 paralell websites? One with the dom content and one with the plain html files? No we don’t have to. And thats good because the side effect is your DOM content can also be shown with normal urls.

just look at the site structure of one page:

website structure example

Each page has a header and a footer and together with the content it forms the unique page. Then within this page the  plain content (which is also the content read by ajax script) gets also included within one page. Like:

index.php:
<?include(”layout/header.php”);?>

<div id=”index”>
<?include(”contents/index_content.php”);?>
</div>
<?include(”layout/footer.php”);?>

Opening the “contents/index_content.php” URL  from  your ajax script will put the content within your page and opening the index.php file will give you the normal html site.

In this page I left out the javascript conversion in the menu for the blog has a total different construction as my homepage does. But if you click on the menu links on the top you will see the effect of the javascript links on the first page.

This site is not ready yet but I already put it online to check wether google really can read real javascript or not…

02.02.2008

it seams google reads the a href Links just the way I expected!
The site got spidered just the way I wanted.
Google read the normal a href’s and didn’t find any binding within the javascript tags. Thats good for ajaxing.
you can check the indexed site:

http://www.google.de/search?q=site%3Awww.jingho.de&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:de:official&client=firefox-a

Though I made a huge Error in not defining each title Tag… I changed that but the google spider came before me… well its good that its only my homepage… wont happen again