Joomla!: Thoughts about Bootstrap
- Details
- Category: Blog
The use of frameworks can be a huge benefit for developing web applications in many cases. We have not to reinvent the wheel and can draw on a wide range of proven functionalities, this significantly reduces the development time within a project.
In general, frameworks try to work as widely as possible to cover a wide range of use cases. But they are not able to offer solutions for every possible problem.
The increased complexity of CSS and HTML makes it PHP developers not easy to control the whole thing perfectly because that is a job in itself.
For this reason, it was obvious to give Joomla extension developers a toolkit to control the appearance of their components in the backend and the frontend. Without any CSS knowledge.
Joomla has opted here for bootstrap. A various preset of CSS classes are controlling the presentation. The last few years came along with a huge modernization of HTML and CSS. It was a rapid development and I believe that this will continue in the future.
This fact and the nature of HTML and CSS itself makes the usage of CSS-Frameworks inside von CMSystems problematic.
The basic idea of using HTML and CSS is to separate the presentation / design and content of each other. The great advantage of CSS is that the whole styling can be changed by using the same markup. This means with a visual relaunch we don't have to touch the HTML code just the CSS. This is only possible on the basis of a really well thought markup.
However, the approach of bootstrap or the other CSS frameworks runs contrary to this idea. Not the CSS will be changed. The markup has to follow a predefined structure and has to use predefined classes to control the design. Bootstrap offers many interesting JS functionalities with nice effects. These are controlled either through classes or data attributes.
Really cool. But a CMS offers a variety of views, in the backend in the frontend as well. HTML code has to be adjusted when updating the CSS framework is neccessary. If you can weigh the HTML and CSS files, the scale would significantly deflect towards HTML. This means, there is much more HTML than CSS code. It's definitely easier to change the CSS code instead the HTML-Code.
The current used bootstrap version is now outdated and no longer meets the latest standards. (rapid development). The markup behind it is suboptimal and could be significantly optimized especially with regard to standard compliance, semantics and accessibility.
The bootstrap guys have responded to the criticism in many cases and made some improvements in their new version (3). These changes are so significant that we have to change our markup a lot. On the other hand these changes leads to the result that components using the older version will not work anymore.
So we really are in a trap. If we now cut off old ties and update to bootstrap 3, we will encounter due to the rapid development of HTML and CSS in one year on the same problem.
What is to be done. I think it makes the most sense to develop our very own markup (+ own class name), and forking bootstrap, pick up the good ideas and approaches and optimize the whole thing towards accessibility. (Strictly speaking, we have already forked bootstrap - RTL CSS extensions for presentation in the backend) Only in this way we are able to respond quickly and effectively to new standards and to implement it into our system.
The problem of backward compatibility could be solved by offering two sets of output including the old and new markup for a while. Maybe the forced usage of Jlayouts can be a possibilty to reach this goal. I talked to PHPRoberto about that issue and he told me that this can be an option. The selection of the used output can be controlled by a plugin.
This idea is connected with a lots of work and can only work on a well sophisticated concept, but in the future it will save us a lot of unnecessary work.
Let us discuss that in the Joomla! JUX -Forum as well