Terugkeer van de laadbalk: zijn CSS3 en HTML5 de nieuwe Flash?
Vandaag gaan we een beetje bespreken hoe en waarom Flash in een negatief daglicht kwam te staan en hoe we kunnen voorkomen dat we dezelfde weg inslaan met de moderne technologieën die het vervangen.
Verken Envato Elements
Waarom we Flash haten
Of je het nu leuk vindt of niet, het web heeft Flash ingeschakeld. De voormalige internetposterjongen is een roodharige stiefkind geworden, die bij veel gebruikers gevoelens van regelrechte haat opwekt. Deze mars werd grotendeels geleid door Steve Jobs en de weigering van Apple om Flash op iOS toe te staan, maar elke dag hebben webgebruikers al lang baat bij de technologie.
Om verschillende redenen was Flash geweldig. Het stelde webontwikkelaars in staat websites naar een niveau van dynamiek te brengen dat voorheen onmogelijk was. In plaats van een land van saaie statische pagina's werd het internet een plek waar echt meeslepende en ronduit futuristische ervaringen mogelijk waren.
Dit alles had echter een prijs. Met de opkomst van Flash werd het web ook een opmerkelijk buggy en trage plek. Flash-websites vereisen natuurlijk de Flash-plug-in en als u niet de nieuwste versie heeft, kunt u deze beter gaan halen of dit ding gaat niet werken.
Toen kwamen de laadbalken. Laadtijden van pagina's op pure Flash-sites nemen exponentieel toe en plotseling worden "Loading: 10% ... Loading: 11% ..." spinners een deel van ons dagelijks leven.
Ten slotte is er het probleem van stabiliteit. Steve Jobs zei dat het meestal de schuld is als Macs crashen. Dit is een beetje overdrijving, maar de kern van de verklaring verwijst naar een of andere waarheid. We hebben allemaal last gehad van Flash-gerelateerde bevriezing en erger. Zo veel zelfs dat veel mensen plug-ins downloaden die alle Flash-activiteiten blokkeren, tenzij deze handmatig worden goedgekeurd.
Hollywood Wijsheid
In de film Jurassic Park merkt chaosspecialist Ian Malcom op bij het vinden van een eiland met levende dinosaurussen: 'Je wetenschappers waren zo bezig met het al dan niet kunnen, ze bleven nadenken of ze dat wel moesten.'
'Je wetenschappers waren zo bezig met het wel of niet kunnen, ze bleven nadenken of ze dat wel moesten doen.' -Ian MalcomDit citaat is zeer geschikt voor de bekendheid van Flash. Ontwikkelaars waren zo enthousiast over wat ze konden doen dat ze vergaten te vragen wat ze moesten doen. Zal Flash de algehele ervaring verbeteren of verslechteren? Wat win ik door Flash te gebruiken en wat moet ik opofferen? Zal de meerderheid van mijn gebruikers tevreden zijn met de beslissingen die ik heb genomen? Hoe groot is het aantal gebruikers dat zal missen en welke opties heb ik voor hen?
Herhalende geschiedenis
Snel vooruitspoelen naar nu. CSS3 en HTML5 zijn gearriveerd om de dag te redden. Flash zit aan de touwen en krijgt elke dag een nieuwe klap, want we zien verbluffende nieuwe voorbeelden van verbazingwekkende sites die alleen zijn gebouwd met CSS, HTML en JavaScript.
HTML en CSS zijn ingebouwd in moderne webbrowsers en vormen de ruggengraat van het wereldwijde web zoals we het nu kennen, dus het is een droom voor een webontwerper om deze technologieën te kunnen gebruiken om dynamische pagina's te bouwen.
Maar naarmate meer en meer ontwikkelaars deze technologieën oppakken en ze tot het uiterste gaan oprekken, begint het Jurassic Park-syndroom het te bepalen. We raken allemaal zo bezig met wat mogelijk is dat het gemakkelijk is om uit het oog te verliezen wat toelaatbaar is.
Steeds meer terwijl ik op internet surf, begin ik tekenen te zien dat een Flash-achtige toekomst nadert. De laadtijden van pagina's nemen toe tot het punt dat "laadberichten" een comeback maken, webpagina's behoorlijk browserafhankelijk worden, lange animaties zorgen ervoor dat de browser vastloopt; klinkt bekend?
Begrijp me niet verkeerd, ik sta als eerste op en zeg dat HTML5 en CSS3 niet alleen de toekomst van het web zijn, maar ook de bron van de beste huidige technologieën. Ik denk echter dat sommige gesprekken over voorzichtigheid gepast zijn als we een Flash-achtig scenario willen vermijden.
Ja, ons nieuwe speelgoed is geweldig, maar laten we even vertragen en onszelf een paar belangrijke vragen stellen vóór de implementatie.
Belangrijke vragen
Het volgende is een ruwe en onvolledige lijst met vragen die u uzelf moet stellen voordat u bepaalde next-gen-technologieën op uw site implementeert.
Is het doel experimenteel / educatief?
Voor degenen onder u die klaar zijn om met een vinger naar mij en mijn wekelijkse aanbod van CSS3-technieken te wijzen, krijg ik een gratis pas (is dat niet handig?). Het is mijn taak om niet alleen de huidige staat van het web te bespreken, maar ook aankomende trends en technologieën. Als gevolg hiervan zouden deze blog en andere absoluut nieuwe technieken moeten verkennen en aanleren wanneer ze zich voordoen.
Als individu heb je ook het volste recht om te experimenteren. Het opzetten van een webspeeltuin of persoonlijke website met experimentele functies kan geen kwaad. Het probleem doet zich voor wanneer u bent ingehuurd om een site te maken in de veronderstelling dat maximale gebruikerscompatibiliteit een primair doel is. De meeste bedrijven zullen niet gek zijn om u in te huren om een site te maken die alleen indrukwekkend is voor andere webontwerpers en enigszins irritant is voor iedereen.
Wat wordt er gewonnen? Wat is er verloren?
Net zoals ik heb aanbevolen bij de implementatie van Flash, moet je bij elke nieuwe of experimentele technologie altijd zorgvuldig je voor- en nadelen afwegen.
Is het voordeel vooral een esthetische boost? Is het een kleine hit waard in bruikbaarheid? Hoe zit het met een grote? Zal deze keuze vanuit het perspectief van de gemiddelde niet-designer-gebruiker bijdragen aan of de ervaring wegnemen?
Stel dat u bijvoorbeeld een fraai geanimeerd vervolgkeuzemenu bouwt met pure CSS3 in plaats van JavaScript, doet u dit omdat het indrukwekkender is of omdat u weet dat u het echt functioneler kunt maken voor meer gebruikers dan wanneer u was gegaan de JS-route?
Het komt allemaal terug op het dilemma van Ian Malcom. Als blijkt dat je een heleboel moderne webtovenarij op een site kunt uitvoeren, vraag jezelf dan altijd af of dat zou moeten .
Soms helpt de vooruitgang je om je site te stroomlijnen en nog bruikbaarder te maken, soms zul je merken dat je opgeblazen code en een langzame pagina hebt terwijl je zwaait met je voortgangsbanner. Wees gewoon eerlijk tegen jezelf en beslis waar je de grens wilt trekken.
Zullen gebruikers het missen?
Stel dat u een aantal Webkit Keyframe-animaties (een van mijn favoriete CSS3-goodies) op een clientsite wilt implementeren, bekijkt u eerst uw analyse om te zien hoeveel niet-Webkit-gebruikers u weglaat?
Browsercompatibiliteit was een groot probleem vóór HTML5 en CSS3 en is nu alleen maar erger. Dezelfde logica die we altijd hebben gebruikt, is echter nog steeds van toepassing. Zorg ervoor dat u ontwerpt met elke belangrijke browser in gedachten. Wat mij betreft, zou je je niet slecht moeten voelen over het implementeren van browserspecifieke trucs en effecten, zorg er gewoon voor dat andere gebruikers nog steeds een solide ervaring hebben.
We hebben het natuurlijk over progressieve verbetering. Begin met een basislijn van functionaliteit en esthetiek die in alle grote browsers werken, en voeg vervolgens speciale extra's toe voor die vooruitstrevende individuen die een echt moderne browser gebruiken.
Gevolgtrekking
Samenvattend: ik ben helemaal weg van HTML5 en CSS3. Ik besteed veel tijd aan experimenteren en het verleggen van de grenzen van wat ik eerder dacht dat mogelijk was. Als ik echter aan echte projecten werk, ben ik altijd voorzichtig om overboord te gaan en een site te maken die er niet alleen uitziet alsof deze met Flash is gebouwd, maar ook zo werkt!
Laat hieronder een reactie achter en laat ons weten hoe u het gebruik van nieuwe technologieën op klantensites aanpakt. Omarmt u HTML5 en CSS3 volledig of spreekt u ze selectief aan waar echte verbeteringen kunnen worden aangebracht?