Review: Free mobile-friendly Web design frameworks
Twitter Bootstrap, HTML5 Boilerplate, 52Framework, 320 and Up take sting out of building websites for both large and small screens
Of course, Web design has also become much more complex and painstaking, so Web developers welcome with open arms any feature that saves them time and effort. That explains the proliferation of Web layout and design frameworks, tools that programmers and designers alike can use as starting points for their sites.
[ Also on InfoWorld: Review: WAMP stacks for Web developers | Get the lowdown on all the key HTML5 specs with InfoWorld's megaguide to HTML5 | Keep up with the latest developer news with InfoWorld's Developer World newsletter. ]
Web frameworks don't completely replace the heavy lifting required to make a good site design, but they save a designer the effort of building the hardest and most complicated parts of a site, as well as behaviors that are tiresome to reinvent. These days, that means not only a consistent theme, but also support for advanced HTML5 features or ways to handle both mobile and desktop browser rendering in the same design.
Here's an overview of some of the most useful or familiar Web frameworks, with notes about their licensing, what's included in them, and what projects they may be best suited for. A full rundown of all the frameworks in use or development would be prohibitive; think of these as the highlights, standouts, and major examples of how things are done.
If you're starting from a completely blank slate and you want a canned look and feel that saves you the trouble of having to concoct one yourself, it's hard to go wrong with Twitter's Bootstrap. HTML5 Boilerplate is best if you're constructing something totally anew or you want to pour an existing design into a new framework for easier manipulation. 52framework is most useful for its HTML5-specific extensions, and both 320 and Up and the Less Framework are handy if you're building something with a tight focus on small-screen devices.
A quick note on the scoring below: Features refers to the overall bundle of capabilities supported directly by the framework. Setup reflects how easy and intuitive it was to get the files, unpack the whole thing, and deploy it on a server. Configuration reflects on the ability to make changes, including the use of online tools that let you create a deployment bundle. Finally, Extras refers to anything useful that's not part of the core framework, such as Bootstrap's plug-in architecture, Boilerplate's integrations with frameworks like Rails and Node.js, and 320 and Up's Font Awesome and test scripts.
- The Business Value of Continuous Delivery Download this whitepaper to learn more about the business value of Continuous Delivery and see why it could be a game changer for...
- Ten Factors Shaping the Future of Application Delivery Download this research report conducted by Enterprise Management Associates (EMA) to learn how those that are seeking to accelerate application delivery are leveraging...
- Adobe Creative Cloud FAQ The following are answers to common questions about Adobe® Creative Cloud™ for teams membership, purchasing, security, and storage.
- What's coming to Adobe Creative Cloud Editing and video content creation workflows are about to get easier and more exciting, with major updates coming soon to Creative Cloud, bringing...
- On-demand webinar - 7 Keys to Service Catalog Implementation Success Watch this webinar to learn 7 crucial keys to make your service catalog a success!
- Transform Your IT Service Management Watch this webinar, to learn how EasyVista can increase IT productivity & efficiency and deliver streamlined & integrated IT Service & Asset Mgmt. All App Development White Papers | Webcasts