So, we all want our sites to be engaging and search-engine friendly, right? Well, maybe not all of us but I bet we can agree those things are all good in the minds of clients. One of the surefire ways of making stuff look cooler on the web is to make it move. People seem to like moving stuff, and typically we give it to them through the use of Flash.
But there’s an alternative to Flash… through the use of some Javascript & CSS trickery, you can give your site some cool interactivity, motion and fun.
Some things to note:
- It’s a super-tall one-page site, and when you click the navigation, you fly up and down the page to the appropriate section
- It uses Javascript to show and hide different content pieces… this means that ALL the content they have is contained within one HTML file, which does two things: makes the page more friendly for search engines, and if you’re looking at it on a mobile/text browser, you can get at all the content without having to click around and wait
- You can click on almost all the little goodies on the page and they’ll move (try the dog and the octopi, and even the sheep on the home area)
- There’s only one Flash bit on the page, the “Very New” burst
So… you may not dig on the the way the site looks, but it shows the cool stuff you can do without the use of Flash.
Just a quick note on my second point above, in case you read that and thought, “Wha?”
Go to the top of the page, and look at the “For the ladies out there”. Then click on the Prev/Next links and observe the coolness. Again, this is not Flash. It’s Javascript.

Click to enlarge the next photo and you’ll see what I’m talking about.
See how all the information for each one of the staff members is right there in the code? That means that a search engine can get at all that code on one page. And again, if you viewed it on a phone, it would show up as text and still be “valuable” to a visitor. Basically, when you click, the Javascript tells the browser which of those little code snippets to display. It’s a nice way of displaying lots of different information without having to refresh the page.
Hope that made sense. Either way, it’s cool.


Comments
Though it’ll likely never gain the widespread “appeal” of corporate sponsored things like Flash and Microsoft Silverlight/Mono Moonlight, there is a cross browser (AFAIK), NO PLUGIN NEEDED graphics library that will let you do some amazing things that rely on JavaScript and the CANVAS element.
http://ejohn.org/blog/processingjs/
Take a look at these demos, and keep in mind that this is all being done natively, by the browser/JS engine…
http://ejohn.org/apps/processing.js/examples/custom/molten.html
http://ejohn.org/apps/processing.js/examples/custom/snake.html
http://ejohn.org/apps/processing.js/examples/topics/scrollbar.html
There are a ton of other demos on that site, and other examples around the ‘net if you google “processing.js”
Did you catch this one? Google is now indexing flash…
http://googleblog.blogspot.com/2008/06/google-learns-to-crawl-flash.html
Trackbacks
One Trackback