Designing responsive web sites and user interfaces, which adjust their layouts and sizes depending on the device on which the website is being used, is all the rage now.
Twitter bootstrap is the most popular framework for designing responsive websites. Bootstrap primarily uses CSS3, javascript, jquery and most importantly media queries to make a website responsive.
But having to add all the botostrap css classes by-hand is quite painful and makes developers who are not designers cringe. Just when HTML/CSS builder tools were becoming easy to use, comes this little twist of using bootstrap responsive css classes all over html markup.
Well, just found this little website, http://www.layoutit.com, which allows developers to quickly build basic skeletons of bootstrap 3 based components, using drag and drop, instead of hand coding.
I use it to quickly build a basic responsive page markup, then paste it in my IDE and fine-tune it from there on.
This has definitely taken the pain out of remembering and putting in bootstrap class names by hand.
Do check it out.
This is a good convenience till more sophisticated and free tools for building responsive UIs come up in the market.
Thursday, January 16, 2014
Modern Web UI - Options
Deciding on a modern Web UI framework can be a daunting task, with hype, buzzwords like responsive design, single page apps, full stack frameworks and the like. It helps to get a birds eye view of the various options at our disposal and then seeing which one is most appropriate for the requirements at hand.
Following tries to structure the options, in a hierarchical tree. The idea is to use it as a decision tree and navigate down the tree, keeping your project requirements in mind.
Following tries to structure the options, in a hierarchical tree. The idea is to use it as a decision tree and navigate down the tree, keeping your project requirements in mind.
Subscribe to:
Posts (Atom)