CSS Frameworks: Foundation vs Twitter Bootstrap

Ik gebruik ze graag en ik gebruik ze veel. CSS frameworks.

Al jaar en dag zijn er verschillende op de markt, de een al beter dan de andere .

Zelf probeer ik graag ook de nieuwe frameworks uit en zo zijn Blueprint, 960 grid system, golden grid system én Foundation, ieder op zijn tijd, al de revue gepasseerd.

Een CSS framework zorgt er voor dat je jouw website kan indelen in kolommen, enkel door het toewijzen van bepaalde classes aan je ‘divs’. Dat maakt dat je al je content allemaal mooi naast elkaar kan zetten op een door je framework vooraf bepaalde afstand. ‘Floating’ is nooit mijn favoriete CSS-style geweest en ik ben dan ook meer dan tevreden dat ik het grove werk kan overlaten aan een framework.

Zoals hierboven al aangehaald, heb ik één van mijn laatste websites gebouwd met ondersteuning van Foundation. Een clean, solide framework dat ook nog eens responsive is. Verder is er al een beperkte, maar stijlvolle look toegekend aan de typografie, buttons en forms om je toch al op weg te zetten. Bij je gratis download zitten meteen ook enkele handige Javascript tools (jQuery based) die je voor 80% van je projecten altijd zal gebruiken. Tabs, een slider en een modal dialog of pop-window, het zit er allemaal in. Uit deze ervaring kan ik ook wel meteen meegeven dat de Orbit image slider zeker niet de beste slider is die je ooit gebruikt hebt. Bij het laden van de pagina heeft de slider net iets te veel tijd nodig om te laden. Een Nivo-slider of bx-slider zijn in mijn ogen betere alternatieven.

Ook voor mijn allerlaatste project ging ik op zoek naar een geschikt framework. Omdat de features van het Twitter Bootstrap framework (ja, de naam is eindelijk gevallen) mijn vingers al een tijdje doen jeuken, heb ik dan ook niet getwijfeld. Bootstrap was net naar buiten gekomen met versie 2 en het feit dat het framework vanaf nu ook responsiveness in de armen heeft gesloten, heeft mij helemaal over de streep getrokken. Bootstrap ademt professionalisme uit en je voelt dat er aan elk detail aandacht is besteed. Dat is uiteraard ook het geval voor Foundation, maar je voelt wel degelijk een verschil. Laat daar nu toevallig de ervaring van de Twitter-developers voor iets tussen zitten.

Bootstrap heeft alles wat Foundation ook in zijn package steekt, maar gaat toch nog een stapje verder. Zo zitten er in Bootstrap ook voorgebouwde tabellen, zijn er classes voorzien om je afbeeldingen te voorzien van afgeronde hoeken, een cirkelvorm of een polaroid-rand. Ook op gebied van Javascript plugins moet Foundation zijn meerdere bekennen. Tooltips, popovers, fixed menus zijn maar enkele van de extra’s die je bij je download krijgt.

Een nadeel aan bootstrap is dat de stijl die toegekend is aan knoppen en formulieren, ondertussen zo bekend is dat je deze moet gaan overschrijven als je niet wil dat jouw website al te hard op een standaard Bootstrap installatie lijkt. Om daarin feilloos te slagen moet je toch al over een gevorderde CSS-kennis beschikken.

Het mag duidelijk zijn dat ik vol lof ben over Bootstrap en dat ik nu waarschijnlijk ook een framework gevonden heb waar ik een tijdje mee zal verder gaan. Het feit dat Twitter non-stop aan updates blijft werken, helpt daar zeker bij.

Het nadeel aan Foundation en meteen ook de reden waarom ik er nu vanaf stap, is dat ze bij de launch van versie 3 de support voor IE7 volledig laten vallen. Voor mij klinkt dat als muziek in de oren, mijn klanten vinden dat nog iets te snel…

Genoten van die artikel? Deel het met jouw netwerk!