What is a framework?
In computer programming, a software framework is an abstraction in which software, providing generic functionality, can be selectively changed by additional user-written code, thus providing application-specific software. It provides a standard way to build and deploy applications and is a universal, reusable software environment that provides particular functionality as part of a larger software platform to facilitate the development of software applications, products and solutions. (Source : Wikipedia)
A framework is conceived to help programmers in their work. Its design aims to increase the productivity of those who will use it by reducing the costs of building and maintaining the program. There are Js frameworks, such as Vue JS or REACT JS, which are relatively complex code libraries necessary for the creation of a website.
The Bootstrap and Foundation frameworks are HTML, CSS and JavaScript libraries of predefined styles for the usual components of a website: grid, typography, buttons, navigation systems, content presentation systems (accordion, slider, tabs, etc.) and animations. This database allows front-end developers to increase efficiency in the layout of websites with personalised designs.
There are many frameworks available (Semantic UI, Skeleton, KNACSS, BluCSS,...). In this article we will focus on Bootstrap, which is probably the best known HTML, CSS and JavaScript framework, and Foundation that we use at WebstanZ.
Bootstrap
Bootstrap is a framework developed by the team from Twitter. It is open source (under the MIT license).
Pros
- Popular: it has a large community, which leads to a lot of collaborations and/or contributions;
- Great compatibility with most browsers (Chrome, Firefox, Internet Explorer, Safari, Opera...) thanks to Jquery;
- Compatible with IOS and Android;
- Can be used to create applications thanks to SASS variables, plugins and its grid system;
- Possibility to install templates and themes for free.
Cons
- If the design differs even slightly from the Bootstrap elements, the code changes are frequent and time-consuming.
- Requires more development time for sites with a custom design.
Foundation
Foundation is a project developed by ZURB in October 2011. The framework is distributed open source under the MIT license.
Pros
- Lightweight platform. It is a modular framework that allows you to install only the modules you need;
- Developed for mobile first;
- Flexibility of the grid layout;
- Its components are responsive;
- Availability of a library for checking forms;
- Highly developed interactive menu in terms of functionality that can easily be styled using CSS.
Cons
- Not compatible with older versions of Internet Explorer;
- Difficult to get used to as it has more customisation options.
Bootstrap vs. Foundation
At first glance, Bootstrap and Foundation seem similar in many ways. However, their use is quite different:
- Bootstrap is a tool that allows you to focus on developing functionality, without necessarily worrying about the visual style of the interface. Or at least, the customization is more complex. It allows to provide a style, certainly very widespread, but which will be sufficient to obtain a finished product without wasting time on the style.
- Foundation was developed as a prototyping tool. It establishes a baseline to work from, which makes customisation easier and faster.
Why we choose Foundation
At Webstanz, we create websites from scratch. Each interface has its own unique design. As a result, there are few elements that can be retrieved from a predefined theme as one could do with Bootstrap. This is why we have opted for the Foundation theme which is more flexible and easier to use for the custom sites we develop.
