CSS Frameworks – The pros and cons

[sBowers]

This may be opening pandoras box. Regardless I thought I would inquire with the community.

The question:
What is currently the best implementation of a CSS framework for a large multifaceted business?

Some perspective:
I work in the healthcare industry for a major provider. I have been tasked with the development and implementation of a mobile web strategy for public facing websites. We are also going through a homepage redesign so this gives me the opportunity to take a more holistic approach. Currently we have a mix of UI implementations using custom built css styles and dated framework implementations that cover a variety of consumer channels. The goal is to unify the approach to css implementation as much as possible.

The hurdles:
My employer is typical of most large business. We use multiple teams with multiple development pathways for a multitude of end consumers. We have web development teams using Java based web services, Sharpoint teams for public and internal audiences etc. All of these projects which have separate and distinct requirements, look and feel and implementation methods. Currently there a multitude of overbuilt, overlapping styles resulting in lots of extra http requests. We also still support ie6 due to internal applications built to that browser (don’t get me started).

The requirements:
1) Easily maintainable.
2) Reactive, with multiple screen resolution adjustments for Desktop, Tablet, Touch Phones (some of our sites use CSS only approaches to mobile but most have separate sites)
3) Progressive, with support back to the devil (ie6) and forward using HTML5.
4) Solid, flexible styles with minimal selectors.
5) The use of the HTML5 Boilerplate is very likely (yeah for me!).

Many if not all of the frameworks I have investigated cover the majority of these items. But with anything the devil is in the details. I am curious to hear the use cases that make certain frameworks a pain.

The players:
1) Open Source Frameworks such as Less or Inuit or any number of others.
2) Homegrown Framework.
3) A mix of the two.
4) Eff it, Just add to the style pile.

There are advantages and disadvantages to any strategy. I have made some conclusions of my own but in the interest of not tainting the discussion I will hold them back.

So, given the complexity of the situation presented and taking into account the existing quagmire of styles… What approach would you take? And why?

And for a follow up question we will be discussing how to achieve world peace. ;)

[TheLeggett]

The biggest problem I’ve faced when working on projects where our team uses a framework, is that the focus can sometimes shift to the framework instead of the goals we’re trying to accomplish by using the framework. It’s great if you can use a tool like a framework to facilitate processes, but important that your team draws some lines ensuring enough flexibility to get the job done.

I’d doubt there is one right answer.

On most of the projects I work on, we use a set of patterns and structures that help us stay consistent, but make very little use of any frameworks. We’ve tried deploying several in-house css/html frameworks with mediocre success, but ultimately we’ve found that we work better when starting almost entirely from scratch. At the same time, we follow some basic guiding principles that help us write legible code that is easy to revisit and modify if changes need to be made. We organize our documents so we can quickly find code that is related to one page, or sets of pages. We have a few basic patterns for what different types of pages should look like semantically.

It might be a bit more on the heavy side in the end, but we value our flexibility. Framework-less works for us, but might not be the best option for all teams.

[sBowers]

Thanks @TheLeggett. That is very similar to the approach we are taking right now. The part we are missing is a defined Pattern Library of Interactions. That is another project I am working on. It might be that establishing those items may solve several of the issues we were looking to a framework to help with.

[Author]

Posts