Responsive Design, The Easy Way.

Choose Bootstrap, Foundation, Skeleton or another grid system?

Responsive Frameworks Make Frontend Development Easier

There is some debate on why a frontend designer would use a responsive framework instead of just using custom CSS. As you may know, the term "Responsive web design", was originally defined by Ethan Marcotte on A List Apart. A responsive layout adapts and changes based on the size and capabilities of the device (desktop, tablet, smartphone, etc...) that a Website is being viewed on. Having a responsive Website is now an essential as it directly impacts search engine placement (SEO), and the majority of Websites are now being viewed on mobile devices. Having a responsive Website also makes sense because it eliminates the need for a separate mobile Website.

There are many things that need to be considered when creating a responsive Website. Responsive design is not just about page structure and fluid grids. Elements like images and text must also be made flexible to adapt as needed to "fit" the screen the site is being viewed on. Responsive frameworks such as Bootstrap, Foundation and Skeleton can be specifically used to implement responsive "mobile-first" design.

There are many advantages to utilizing a responsive framework, and investing time in a homegrown grid solution doesn't really make sense. There is little sense in reinventing the wheel without a compelling reason to do so. Frameworks provide a repeatable base from which you can build Websites faster.

Codeply makes it easy to compare, explore and prototype using any of these responsive frameworks. It's currently integrated with Bootstrap, Zurb Foundation, Yahoo's PureCSS, Skeleton, Materialize, Semantic UI and UIkit. The editor interface contains all of the framework CSS classes, and code snippets which can simply be selected and dropped in as markup. This means you'll spend less time trawling through the docs to determine the appropriate markup to use. There are also hundreds of reusable code examples that you can search and fork.

In conclusion, Front end frameworks are created to make life easy. There's no harm in using them if you understand the core concept of a CSS / JS framework. Codeply is a tool you can use to leverage these frameworks. We're also compiling a list of responsive snippets which might be helpful for your projects.