If you have time to step away from the iPhone, have a little giggle as “Verity Snob” has a piece on How to be an instant Web me-2.0 developer that includes the documented Web version numbers:
Web 1.0: Programming model equivalent to that of a slightly up-market 3270 terminal. Forms are filled in with the sequence: tab tab tab tab tab tab bonk.
Web 1.00001: The beginning of the rich web experience: the first ever, primitive Javascript code fragment is written. It generates an unwanted popup, and snaffles your credit card details.
Web 1.1: No visible difference from Web 1.0, apart from IE showing the text ‘Javascript error’ in its status bar.
Web 1.2: Standard buttons are upgraded with smart 3D-looking GIFs. These react to mouseover events by bobbing up and down politely over their drop shadows. Remember when we were excited by this sort of scriptery? (None of your CSS cleverness then.) It seems so quaint now. It makes me want to cry, thinking about the good old days of ugly web pages loading slowly.
Web 1.3: When you get to the home page of a V1.2 site with FireFox, it displays badly. When you go to a V1.3 website such as www.fdms.com with FireFox, it tells you to eff off and get IE. (These traditionalists in fact would seem to prefer it if you used IE4.) The age of ‘you aren’t good enough for our website’ has begun, reaching full fruition at Web 1.5, see below.
Web 1.4: Basic client-side validation added. Forms are filled in with the sequence: tab tab tab tab tab What do you mean ‘invalid post code’ you bloody thing? The dread phrase ‘next generation of 3d smileys’ is encountered for the very first time.
Web 1.5: Home page preceded by Flash animation designed by the man who thought (wrongly) he should have been asked to do the title sequence for the next Bond movie. In practice, this means the user stares at an animated ‘Please wait’ sign for half a minute, then goes somewhere else.
Web 1.6: Date fields come with a little popup calendar to help you enter a valid date. Because of the differences in the box model as implemented by IE4, the Ok button is position beyond the edge of calendar’s window, and it is impossible to use it to enter a date.
Web 1.7: The presence of extra code interferes with the standard function of browser controls. Clicking the back button, instead of taking you back to the previous phase on the corporate workflow site so that you could point out the bug to your team leader, abruptly dumps you on the money-shot page of the gentleman’s entertainment website that Porno Pete from accounts was showing you earlier on. You say.
Web 1.8: Web pages at this level cannot be made to run on Windows Server 2003, no matter how many ‘trusted zones’ you add them to, nor how much you attempt to override Internet Explorer’s Enhanced Security Configuration.
Web 1.9: You stumble upon Desktop Tower Defense one lunchtime, and are surprised when you look up from the screen with tired, gummy eyes to notice that it has suddenly become tomorrow. But at least you have got your world ranking up to 912,417.
Web 2.0: At last! You can get a fully fledged mail client in your browser. Now, wherever you are in the world, whatever time of day, without the need for your own PC, you are no more than a few minutes away from a screen that reads “Oops, something has gone wrong; we’re sorry, try again in a few minutes”.
Verity then goes on to discuss the Evolution of the programming model, What does the P in LAMP stand for?, We should pause to consider Ruby on Rails, and finally AJAX for a cleaner kitchen.
This is a genuine street sign from Nelson, New Zealand. But perhaps its telling us that Ajax really is a dead end and we need something better?! Or that now we’ve started using Ajax there’s no escape?!!
Andrew Wooldridge created CanvasQuest with the idea of creating a simple roguelike game. It has some interesting features like map loading, and uses graphics to render the text via sprites.
Matthew Buchanan had a little fun and created a Timelapse CSS example that lets you walk through the process of how a browser would put together a page if it was a human artist:
When building website templates, I’m constantly switching between a view of my CSS code and a view of the page I’m working on in a browser. At my most fevered I’m switching from one to the other after every couple of amendments, to ensure my additional rules are having the intended effect. Over time, were I to record this incremental buildup, it would paint a reasonably good picture of my approach to converting a design comp to a CSS layout.
With this in mind, I thought it might be useful to try to capture the process automatically and then play it back. I’ve seen this done using a collection of manual screen captures, but that didn’t seem a particularly elegant or easily reproducible solution.
As a proof of concept I cobbled together a (stylistically unsound) function to traverse the stylesheets of the current page (in reverse order) and remove a property from each rule every tenth of a second.
XSketch is "a multiplayer word sketch game. It is programmed in Adobe Flash, Java, Ajax, and GWT. Gameplay is similar to Pictionary where you sketch a picture with the goal of having other players guess your word and vice versa."
Ryan Dewsbury creator this game, which he adds to his collection of GPokr and KDice.
Oh man, even for a Friday this is pretty low... but what the hell, this is the Internet damn it!
It starts with:
The site design is the first thing that people see
It should be reflective of you in the industry
Easy to look at with a nice navigation
When they can't find what they want it causes frustration
A clear call to action to improve the temptation
Use appealing graphics that create motivation
If you have animation please use in moderation
Cause search engines can't index the information
and then my favourite part:
Do your layout with divs, make sure that they are aligned
Please don't use tables even though they work fine
when it comes to indexing it gives search a hard time
If you look at the source you will see that the magic is in a flip table that does the unicode thing.
I love the rationalization:
There is a huge need for upside down text on the web. With everyone "going mobile," developers cannot simply rely on users having their screens oriented the same way all the time.
Jacob Seidelin is doing great work, and for something fun, he build a piece of Super Mario in just 14KB of JavaScript:
Here's an experiment in keepings things small and confined to one Javascript file. There are no external image files or anything, everything is rendered with Javascript using either canvas elements or old fashioned div-making tactics (for IE). The sprites are stored in custom encoded strings in a format that only allows 4 colors for each sprite but in turn only takes up around 40-60 bytes per sprite.
We also have MIDI music embedded as base64-encoded data: URI's. No music for IE, though, and it seems all the other browsers each have different, minor problems with it, but it sort of works.
We love to showcase good uses of Ajax, but sometimes you have to show the anti-patterns too. Hema is a dutch company that recently tried to revamp their online site, but went a little too far.
Asciify is a new library that draws ASCII art for you, so it had "Friday" written all over it:
There are trends on the web (as in real world) that last days or weeks and there are things that became a classic form of expression of the geek culture and are still interesting to explore after 20+ years.
Ascii Art is one of these things. If you don’t know what ascii art is you’re probably reading the wrong blog, however for the one or two that doesn’t know about it, here you can learn more about it: Ascii art on wikipedia.
I always had in mind the idea to create an actionscript class to render ascii art from pictures and now with as3 this is going to be possible at decent speed.
My class is called Asciify and it can actually “ascii-fy†every DisplayObject instance on the display list.
var asciifyInstance:Asciify=new Asciify(picture, textFormat, 16);
addChild(asciifyInstance);
Takes me back to my insanely cheesy .sig files from many years ago:
\\|//
(o o)
+----oOOo-(_)-oOOo--------------------------------------------------+
| dionXalmaer.com | FREE TIBET * |
| www.almaer.com/dion | * with any tibet of equal or greater value |
+-------------------------------------------------------------------+
