In de computerwetenschap bestaat de term 'Fault-tolerant system' (ook wel 'Graceful degradation' genoemd).

 Dit betekent dat het systeem kijkt naar de technieken die beschikbaar zijn voor de gebruiker en gaat uit van de nieuwste/beste mogelijkheden. Zijn die niet beschikbaar dan wordt een fallback optie (verouderde technieken) gebruikt. Dit is ook toepasbaar op webdesign. In dit artikel leg ik uit hoe en waarom.

Het Fault-tolerant system toegepast op webdesign

In de webdesign wereld zijn steeds nieuwe ontwikkelingen op het gebied van CSS en hoe deze het uiterlijk van een website bepalen. Zo is het nu bijvoorbeeld mogelijk om afbeeldingen te roteren, in te laten zoomen of te verschuiven. Deze nieuwe functies worden langzaam doorgevoerd in de nieuwste versies van browser zoals Chrome, Firefox en Internet Explorer 9. Dit is geweldig omdat het webdesigners veel meer flexibiliteit geeft bij het ontwerpen en bouwen van websites.

Er is echter een probleem. Deze nieuwe technieken zijn niet backwards-compatible, oftewel gebruikers met een verouderde browser zien al deze nieuwe snufjes niet. De vraag is of dit erg is. Wat mij betreft is het geen probleem zolang de content beschikbaar is ongeacht welke browser er gebruikt wordt.

In dit artikel op A List Apart maken ze een treffende vergelijking met een website en een M&M. De pinda is de content en de chocola eromheen is het uiterlijk van de website. Als iemand een oudere browser heeft die nog geen gebruik maakt van de nieuwste CSS technieken krijgt hij of zijn gewoon de pinda. Heb je echter netjes een upgrade gedaan van de browser dan mag je genieten van de chocola eromheen.

Waarom?

De mogelijkheden van nieuwe CSS technieken zijn nu al beschikbaar in alle browsers door gebruik te maken van Javascript. Waarom zou je dat dan niet gebruiken in plaats van CSS die niet door oude browsers ondersteund wordt? Hier zijn drie belangrijke redenen voor:

• Het is goedkoper. Een webdesigner is minder tijd kwijt aan het bouwen en testen van websites. Hij of zij hoeft zich alleen maar zorgen te maken over HTML en CSS en hoeft niet aan de slag met (soms ingewikkelde) Javascripts. Daarnaast wordt het testen in verschillende browsers beperkt omdat de website er niet in alle browsers pixel-perfect uit hoeft te zien.
• Het laden van een Javascript gaat ten kostte van de performance van je website. De website wordt trager naarmate er meer beweegt op je website en dus meer Javascripts nodig hebt. Door CSS te gebruiken profiteer je van de meegeleverde technieken van een browser en hoeft er dus niks extra geladen te worden.
• Waarom zou je je in allemaal bochten wringen om een website te maken voor browsers die al meer dan tien jaar oud zijn? Door steeds gebruik te maken van de nieuwste technieken zorg je ervoor dat je website klaar is voor de toekomst en niet telkens achter de feiten aanloopt.

Voorbeelden

Hieronder zie je een voorbeeld van het verschil tussen een verouderde browser (Internet Explorer 7) en een moderne browser (Chrome). Zoals je kan zien is het niet storend voor de gebruikers van Internet Explorer 7 (rechts) en krijgen de gebruikers van Chrome (links) gewoon net een beetje extra.

Het verschil zit hem in de afgeronde hoeken, gebruik van niet web-safe fonts, gradient als achtergrondkleur en schaduw effecten bij zowel de tekst als het blok eromheen.

Hopelijk heb ik je er van overtuigd dat het belangrijk is om de nieuwe CSS technieken te gebruiken en dat het NIET belangrijk is dat elke website er hetzelfde uitziet in elke browser. Mocht je nog vragen of opmerkingen hebben dan hoor ik dat graag in het commentaar!