Monthly Archives: August 2011

Improve the Feng Shui of CSS Files

Procssor

http://procssor.com/

Clean code is happy code.  There is something serene about opening up a file to edit and having everything laid out nicely with consistant spacing, bracketing, grouping styles and comments. Today I happened across a nice little generator that cleans up your css files for you.  Procssor will take CSS input and apply specified options in generating a visually appealing, consistent block of CSS output.

Processor boasts multiple methods of CSS input including: Direct Input, URL and File upload.

The options panel provides image tool tips of CSS code on hover giving the end user a little visual hint at how the CSS will be handled.   There are a couple of really good options available for formatting including alphabetizing your properties and columnizing your code.

The result is a consistent and nicely styled CSS file available to copy and paste or download as a file.

Turn Tabular Data into Tubular Data with jQuery

Flexigrid

http://flexigrid.info/

The table tag in HTML has a bit of a sordid past.  Once tasked with laying out websites the table tag has been dragged through an identity crisis.  As the sun set on web 1.0 – the over reaction was to remove all instances of tables.  But I would argue that tables have their place.  The fact of the matter is that tables are good for displaying tabular data – that was their intended purpose.

Flexigrid is making it even easier to feel comfortable with the table tag again.   Flixigrid is a jQuery plugin that, in its most basic example, converts an HTML table into an interactive spreadsheet in the browser with expandable columns, alternating row treatments and a resizable frame.   It takes the table tag with all of the trs and tds therein and converts them into divs – so if you are still on the fence about using tables, you can feel good about the fact that this plugin only uses it only to read the data and removes it from the DOM.

Flexigrid AdvancedWhat I like about Flixigrid is the breadth of usage.  As mentioned above Flixigrid in its simplest form is easy to implement.  However the very same plugin can blow the lid off the tabular data with  by offering the ability to display paginated rows with a pagination toolbar pulling from an XML feed via JSON.

If tabular data is on the menu in the feast of HTML you are serving up than there is no doubt that Flixigrid is sure to enhance your user’s experience.