User interface design guidelines
23/01/09 21:04 Filed in: Traffic
Writer guidelines say: Did you know that 79% of web users scan the page instead of reading word-for-word? That people read from computer screens 25% slower than from paper? Or that web content should have 50% of the word count of its paper equivalent?
Blogging isn't just about writing for the benefit of skim readers, you have to consider the Google robots too.
Bloggers have designed many different interfaces to cope with skimmers and readers of all persuasions. Here is a range of user interface designs, not based on guidelines, but on what felt right for the target audience.
The generic blogger.
Back to basics first. 99% of the many quintillion million blogs on-line interface with the reader via text, an image or two and even a video clip for fun. The Pisstakers are guilty as charged.
Imagery in blogs
It gets more interesting, however, when you present a blog reader with images-only. How many people have you heard say, "I couldn't finish looking at that photo, it was too hard to get to the bottom!" Exactly!
A picture communicates 1000 words and does it very quickly and powerfully. As long as you aren't presenting blurry upside down holiday snaps, the interface between reader and image is very effective.
Photo blog
Before it was abandoned to money-grabbing link maniacs, Innings site was 98% photographic image and about 2% text, by my unscientific calculations. Norman Roberts' website was one of the most powerful collections of emotions on the internet, IMHO. Happiness, sadness, disgust, anger... name your vice and you'd find an example or 20 at the end of your nose at Innings, with no need to scan a single word, most of the time. Need I say more?
Cartoon / comic blog
On a pixel per reader reaction count, cartoons are even more effective at engaging a "reader" than photos. At MyExtra Life which is only 1% text , Scott Johnson depicts humorous expressions and feelings with a swish of his digital pen. A quick scribble of wording to add to the picture, and he draws even the most ADD of readers to the punch line of his comic strip.
Then there is the quick sketch approach to catch the readers' attention. Zackie does a scintillating job with the swish of an ink pen and a scanner, en français. You feel, quoi?
Time line blog

The Venn diagram blog
And finally, the humble venn diagram has been taken to a new level of communication by several brilliant minds. Here, a brain box explains the difference between the UK and Britain using a venn diagram! found at The Alex Barnett Blog.
Super intelligent venn diagramists can even venn away before writing the required thousands of words explaining the stupidity of politics and religion.

Pisstakers on communication
Personally, I have to stick with words to communicate. At least with the internet, I can link to, and show off the different interfaces I couldn't possibly dream up or create myself.
If you see any other novel blogging styles, let Ed know so he can write something about them.
Javascript report
09/01/09 10:23 Filed in: Javascript
Sometimes I try to be helpful to other bloggers! This is one such occasion. Gather round for this brief javascript report.
Back in October 2007, before we were popular, we incorporated a rotating banner in a box in the left sidebar of our website. It displayed the logos of 9 sponsors/fanboi sites which appeared randomly with each page refresh. That ad box has gone, but we still use the code to power the Web Search and Visitor Tip boxes in the left sidebar.
If you like the idea of a box full of rotating logos or banners, rather than use a javascript code analyzer to find out how we do it, here is the code to create the template. Slip it into any html page.
Each banner appears at random, no delays.
You can add banners ad infinitem, in theory there is no limit.
Bottom line, I highly recommend it for sidebar images, adverts, photos...
Here are the sites we featured in the javascript rotating banner. Give 'em a click and see. You might discover something kewl!
More Pisstakers gems about javascript - a ratings script, and stupid javascript scripts.
.....
Are you itching to give your readers a good deal in these hard times? Try Chitika it is doing me proud.
This page is a springboard to hundreds of posts around the site. Just follow your noses to funny news, celebrity gossip, funny quotes and humorous tech. And if you like what you read, don't forget to subscribe (top right sidebar).
Cheers, Ed
Rotating banner javascript code
Back in October 2007, before we were popular, we incorporated a rotating banner in a box in the left sidebar of our website. It displayed the logos of 9 sponsors/fanboi sites which appeared randomly with each page refresh. That ad box has gone, but we still use the code to power the Web Search and Visitor Tip boxes in the left sidebar.
If you like the idea of a box full of rotating logos or banners, rather than use a javascript code analyzer to find out how we do it, here is the code to create the template. Slip it into any html page.
Each banner appears at random, no delays.
You can add banners ad infinitem, in theory there is no limit.
Bottom line, I highly recommend it for sidebar images, adverts, photos...
Here are the sites we featured in the javascript rotating banner. Give 'em a click and see. You might discover something kewl!
More Pisstakers gems about javascript - a ratings script, and stupid javascript scripts.
BTW if you are reading this in a Feed Reader, it is not necessarily the latest posting, so check out The Pisstakers.
Are you itching to give your readers a good deal in these hard times? Try Chitika it is doing me proud.
This page is a springboard to hundreds of posts around the site. Just follow your noses to funny news, celebrity gossip, funny quotes and humorous tech. And if you like what you read, don't forget to subscribe (top right sidebar).
Cheers, Ed





Are you itching to give your readers a good deal in these hard times? Try Chitika it is doing me proud.
This page is a springboard to hundreds of posts around the site. Just follow your noses to funny news, celebrity gossip, funny quotes and humorous tech. And if you like what you read, don't forget to subscribe (top right sidebar).
Cheers, Ed