CSS Frameworks

I guess this really continues on from my previous blog article about Grid-based layouts. A number of CSS frameworks have emerged over the last few months making it somewhat easier for front-end developers deliver consistent interfaces across web browsers.

A personal favourite of mine is to use the YUI Reset CSS along with the 960 Grid System I mentioned in the earlier post. This ensures that all elements; type, layout, input etc. are stripped back to their basics across all browsers through which you build on to. It means that any browser-specific padding applied to elements such as input buttons are removed and by declaring your own settings you know that you are getting a true value across web browsers.

There is one problem with using CSS frameworks however; they can add a lot of ‘code bloat’ to your website or web application which can increase the amount of time taken for it to load. Although internet connections are getting faster and web browsers are also getting quicker at rendering code, when you want to browse over a XHTML-compatible mobile device it can be painfully slow as I have recently found. Even browsing over Wi-fi.

This problem is not just restricted to CSS frameworks though, it applies to JavaScript frameworks in exactly the same way. You may not need or require all the features and functionality brought in with a framework, but it still needs to be downloaded, increasing the loading time.