RSS

Monthly Archives: June 2009

More CSS with Less

>The people at Sitepoint send me a ‘Tech Times’ newsletter every now and then. I tend to ignore newsletters from most other companies, but this one is different, it is surprisingly interesting, most of the times.

Today’s Tech Times (issue 246) informed me about Less, an improvement over regular CSS that adds variables, mixins, operations and nested rules to regular CSS. It’s backwards compatible and compiles to regular CSS before you serve it to your favorite user agent. Wow.

This is definitely something I intend to integrate into the work flow for the PensioenPage technology, right before optimizing the (normal) CSS using the YUI Compressor.

Advertisements
 
Leave a comment

Posted by on 30 June 2009 in css, less, lesscss, sitepoint, yui

 

Firefox 3.5 Released

>If you didn’t know already, Firefox 3.5 was released today (June 30, 2009).

Of course, the PensioenPage technology is ready for it, even detecting the version properly, check out the source code:

www.pensioenpage.com/?_indent=true

Note that the _indent=true enables indentation in the source code.

 
Leave a comment

Posted by on 30 June 2009 in firefox, firefox3, firefox3.5

 

Combining CSS and User Agent Sniffing

>Avoid sniffing if you can
User agent sniffing is bad and that’s known. So avoid it if you can.

However, in some cases a browser is just acting weird and you cannot ignore that, it needs some specific CSS instructions. Internet Explorer 6 and 7 are prime examples here.

The old days: CSS hacks
In the past, this was resolved with odd CSS filters (better known as hacks), constructs that were known to work in some browsers and be ignored in some other browsers. To do this well, you need to know about the quirks of all browsers. This is not scalable, with new browsers coming out all the time.

Alternative: Sniffing and CSS classes
Here’s an alternative: Use server-side agent sniffing and put the results in a class attribute in the HTML. This allows you to write CSS rules like:

.Browser-Opera ul.ModList li {display:block}

or even:

.BrowserOS-MacOS-10.Browser-Firefox-3-5 li.FooBar {margin-left:2px}

To see this in action, have a look at the source code of the PensioenPage site:

www.pensioenpage.com

or, with indentation enabled in the source code:

www.pensioenpage.com/?_indent=true

Note that the user agent sniffing we implemented has more than 160 unit tests, detecting (Mobile) Internet Explorer, Opera Desktop/Mobile/Mini, Firefox, the old Netscape browsers, Chrome, Safari, Maxthon, etc.

Operating systems detected include Mac OS X, various Windows versions, BSD variants, Solaris, Linux, the iPhone OS, etc.

Finally, the browser engine is also detected, allowing rules like this one:

.BrowserEngine-Trident div.Tip {padding:0}
 

The New OS Challenge: Data Integration and Synchronization

>Today’s OS challenge
In the past, operating systems had a limited function, synchronizing access to internal and external hardware, file systems, memory, processes, etc.

Nowadays, user’s demands far exceed these ‘simple’ requirements, expecting data integration and synchronization. People use different (portable) machines, applications and different (online) storage realms, and these all need to integrate in a customer-focused manner.

Examples: image manipulation, bookmarks, data exchange
For example, on Mac OS X images can be manipulated with all sorts of relatively cheap programs these days (e.g. Skitch, LittleSnapper, Acorn, Pixelmator, Picturesque, etc.) All these programs have a different focus and provide different functions, with some overlap. However, when you try combining the functions of these programs, you are facing a real challenge. What format do you use for data exchange? PNG is a good choice for one-way image manipulation, but then don’t try changing something in the middle of your process.

This challenge becomes even larger when you try exchanging vector images between multiple applications, like Keynote, Pages, NeoOffice, Novamind, Microsoft Office, etc. Both SVG and OpenDocument are formally standards, but they are currently far from practical for inter-application data exchange. On the Mac platform, EPS and PDF are typically the best bets. An established practical standard is lacking.

Another example is your bookmarks. How do you synchronize your bookmarks between Firefox, Safari, Opera and Internet Explorer? Each vendor starts to deploy his own web-based synchronization service (MobileMe, Opera Link, etc.) and there are some that go a bit further already (XMarks, Delicious) but we need one solution for all browsers that integrates with different operating systems.

Finally, notice how online data exchange services have started to emerge. For example Quicksnapper, Skitch.com, MobileMe, Flickr, YouTube, etc. These services make it easy to share data over the internet, but they are typically focused on one type of data (images or video, for example) and fail to integrate with different sorts of applications. Their focus is typically limited.

Dropbox is a positive exception here, providing a generic data exchange experience that is seamless across Mac OS X and Windows platforms, transparently working with all sorts of applications and providing limited history/backup/versioning support. However, optimally, applications should be adjusted so they recognize and support this platform.

And what if you want to view and edit your files on the fly from your mobile device, like an iPhone?

Network computer?
In the past, companies like Sun MicroSystems attempted to resolve these issues with a largely closed environment: the network computer, sporting a central server for sharing all applications and data. Although there are still (business) environments where this is an excellent solution, the majority of the customers requires more choice and an open system.

Operating system support
This is where an operating system like Mac OS X can make a big difference. OS X is already much appreciated for the system-wide services it provides, like spell checking, hyphenation, speech, etc. But these don’t go far enough.

For application interoperability, Apple should extend their vision, provide a platform and produce some guidelines. These should enable application developers to write interoperable programs that support tomorrow’s applications, collaboration and synchronization tools and data exchange methods, including versioning support.

This may require a strategic shift, as Apple is currently trying to make money off MobileMe, which is a closed and proprietary platform that has limited features and is based on an expensive yearly subscription model. Such a model is hardly suitable for large groups of customers that will look elsewhere for their data exchange requirements.