Archive for the ‘CSS’ Category

Getting closer with the Buttonise concept.

Again, the concept is not quite production-ready, but the OS mantra is Release early. Release often (and a week between updates is often for me ).

The key improvement of this release is that it will run well in common browsers (tested in Firefox 2, Opera 9, Safari 3).

There are still some styling issues to work through and a couple of functionality issues with IE6.

Here’s a sneak preview of something I’ve been thinking about and working on for a while: Buttonise.

Its already been through quite a few variations and reviews, but its not quite production-ready yet (and it only works in Firefox ATM), but it is getting closer.

What is buttonise?

Buttonise is a way to style buttons consistently between browser makes and versions, what’s more, it allows you to style links as buttons, for those situations when you would like to use a link in amongst buttons without confusing the end user.

It is entirely unobtrusive, maintains the accessibility of the page it is incorporated into and conforms to the principle of progressive enhancement.

Let me know whay you think.

In the spirit of realignment I present tinymac 2.1! (edited 14/12/2006: irama 2.1 now )

This new design celebrates one year of tinymac.com and subtly reflects other personal developments.

The realignment boasts refined graphic elements, a better utilisation of space (at the expense of copious amounts of whitespace ) and better support for printing and handheld browsers.

The other noteworthy attribute of this layout is that it plays well with IE (6 and 7). The old layout broke in IE 6 and I told myself I wouldn’t stoop so low as to fix it… What can I say? I caved. I was re-coding it anyway, and it didn’t seem like that much extra effort to get it to work in IE 6 also

I have just finished my article on the transformer layout.

I came up with the idea for this very flexible layout while redesigning the netpotential website

This layout supports low screen resolutions and handheld devices but also transforms to utilise more horizontal space when it is available on higher resolution displays.

The layout is based on standards compliant XHTML and CSS and will display correctly in modern browsers.

Sensationalist headlines aside, I have adapted the good old “Zebra Tables” and put them on steroids.

Features:

• Unobtrusive DHTML
• Classes applied to <tr>s so CSS can be used
• Optional support for column highlighting
• Compensates for rowspans and colspans

For more information and downloads see: Checkerboard Tables.