We love Pixies!

On an obscure night in 2008 whilst creating a design using pixel buttons (which also go by the names of pixel badges, and antipixel, etc)  I thought “Wouldn’t it be a great idea if no pixels were used? Instead the button (or badge) is composed entirely by Cascading Style Sheet (CSS) code!”

Yeah, fantastic! My web fortune is upon me and I can retire in the lap of luxury!

In the sober light of day however, I find the idea is sooo fantastic it had been thought of  years ago (going back as far as 2002 I discovered). So I kept the day job.

Even so,  I’ve not yet come across CSS badges (pixeless buttons) that mimic the style of their pixel counterparts. This may be because no one has tried it, or more likely because my browser doesn’t  get about much. So I set about constructing a demo of a CSS badge (pixeless pixel button) that would look like a pixel button.

The CSS has ‘scope for refinement’ – which is a kinder way of saying it was a quick kludge.

/*CSS code */
table.badge {
border-style:solid;
border-width: 1px;
border-color: #666;
font-size: 8px;
font-family: sans-serif;
color: #fff;
line-height: 6px;
background-color: #fff;
}
table.badge tr {
background-color: #888;
text-align: center;
text-transform:uppercase;
margin: 0px;
padding: 0px;
}
table.badge td.main {
background-color:#f60;
}

<!– html code –>
<table cellspacing=1 cellpadding=0 class=”badge” width=”88px” height=”15px”">
<tr><td class=”main”>px</td><td>free</td></tr>
</table>

Some examples I made earlier can be found here.

I refer to these pixeless pixel buttons as “Pixies” because it sounds cute, and is less likely to leave your tongue in a knot when saying it.

Other related sites:

www.pixelbutton.com – the pixel button website where you can create pixel graphics.

ZwahlenDesign, “Web Badges / Buttons” – the site containing CSS web buttons

http://www.antipixel.com/blog/archives/2002/10/22/steal_these_buttons.html – the original antipixel blog post

Web 3.0 arrives in 2009

I believe there is a new trend developing in web design in early 2009. Having had this feeling for many months I’m now seeing evidence to support it.

Having been on the web before the days of inline jpeg images, Internet Explorer, and Yahoo, I’ve seen many trends and development and I can see another transformation taking place once more.

Web ’1.0′ was about accessible content. “Content is King” is the mantra that still rings true in web design today.

(Ever heard of a site called Google? This is why – Google’s goal was to be the Internet content King .

Web 2.0 was all about social interaction. Given that you already have some content how do you enrich it? By leveraging the link power of the web and allowing many users to interact with that data, even modifying or adding to it.

(Have you ever heard of a website called Facebook? It is popular because it allows people to interact with data from their network of friends)

I believe Web 3.0 has arrived and it will revolve around user interface design. The way that we access the web will change, browsers will evolve. For example, your clothing could be a ‘browser’, or your hands may be the ‘mouse device’. Why?

O.K. Here’s why…

In building a house the initial priority is not where to put the T.V. in the living room. It may be about the depth of the foundations or some such.
Similarly the web started with access then content – accessible content, out of which the World Wide Web Consortium (W3C) (dealing with web standards) was seen to grow. Then later, true to it’s name “the web” was about creating a web of  links to data in the form of social networking.

So, now that the data exists (Web 1.0) and there are meaningful links between the data items (Web 2.0)  the next ‘fashion’ I believe is in the way that data is accessed – Web 3.0. Augmented reality systems and intuitive navigation is what lies on the road ahead. Then after, perhaps, the much disscussed semantic web will arrive in Web 4.0

Some early examples of what I believe to be Web 3.0 are as follows:

Google maps on a mobile device

General Electric augmented reality website http://ge.ecomagination.com/smartgrid/?c_id=Matter#/augmented_reality

BMW mini augmented reality advert  http://technabob.com/blog/2008/12/17/mini-augmented-reality-ads-hit-newstands/ (English article about the German BMW mini website)

No, that’s not a euphemism for swearing. You did read it correctly.

“Swoopo” is the cross between an auction site & gambling site. An odd idea, intelligently humourous, and well executed.

The idea is that bids only increase by a nominal amount (e.g. 10pence) for each bid made. When a bid is made it increases the auction’s countdown clock by a few seconds (e.g. 20secs). If the clock reaches zero with your username on the bid you get the goods going for a song. Music to the ears of most people during a recession, no?

It offers paticipants the potential for massive savings up to 100% off, I kid you not.

Such savings can be offered as each bid made has been prior purchased, and 50p of which goes towards meeting the company’s needs. So if we do the maths… an auction item reaching £100.00 would have involved 1000 bids, each earning the company 50p. For those of you reaching for a calculator – that’s £500 for the company. (Well I did say their idea was “intelligent” didn’t I?)

Now that’s what I call e-Commerce with an Eeeeeee!

I’m sure they will be in the news in the not too distant future…

Some bagged bargains on completed auctions