Share
Dit jaar was het een briljant jaar in webdesign. Meer dan enig ander jaar zijn misschien enorme stappen gezet in de richting van het volwassen worden van het veld. Laten we eens kijken naar wat we kunnen verwachten voor de toekomst van webdesign als een industrie.
Iedereen die al langer dan een paar jaar webdesign doet, heeft ongetwijfeld te maken met het probleem van de kloof tussen design en front-end ontwikkeling. Ontwerpers leven in tools vergelijkbaar met Photoshop of Sketch en ontwikkelaars leven in hun teksteditors.
In deze gemeenschappelijke workflow zijn vele pogingen gedaan om tot een oplossing te komen, waaronder zaken als SiteGrinder, Dreamweaver en meer recent Adobe Muse. Al deze oplossingen komen met hun problemen en zijn nog niet op grote schaal aangenomen. Voor het grootste deel hebben front-end ontwikkelaars hun oude manier van werken gevolgd, of ontwerpers gaan meer de browser in om te werken, waardoor de kloof wordt verkleind. Er zijn echter tools aan het ontstaan om deze kloof nog verder te dichten. Met gereedschappen als Macaw op het punt om te worden vrijgegeven, wordt het pad naar een einde van de moeizame kloof tussen ontwerp en front-end ontwikkeling verkort.
Deze tools zullen enorm profiteren van het feit dat webontwerptrends platte kleuren hebben aangenomen met zeer weinig textuur en voorspelbaar herhaalde elementen. Deze elementen zijn veel minder complex dan de erg image-afhankelijke ui-elementen van enkele jaren geleden, dus het is een goede fase om tools te introduceren om automatisch te genereren goed georganiseerd, semantisch code.
U zult geen goede "WYSIWYG" -achtige JavaScript-implementatie zien voor alles dat verder gaat dan de standaard configureerbare widgets. De belangrijkste reden hiervoor is dat HTML en CSS beide zijn verklarend talen, terwijl JavaScript een programmeertaal is. Het "canvas" voor JavaScript is inherent de teksteditor. Het canvas voor HTML is inherent het document.
Aangezien browsers de nieuwste standaarden aannemen, worden telefoons sneller, worden schermen onvoorspelbaar en ontwerpen blijven afvlakken. We zien een aanzienlijke vermindering van het aantal grafische afbeeldingen dat op een bepaalde site wordt gebruikt. Complexe gebruikersinterface-elementen zullen steeds meer op CSS vertrouwen en voor dingen die niet volledig met CSS kunnen worden bereikt, wordt SVG overgenomen. De primaire uitzondering is fotografie. Grote foto's zullen nog meer ontwerpruimte claimen, aangezien ontwerpers meer vertrouwen op inhoudgerichte, transparante beelden om ervaring en vertelling te definiëren.
Met prachtige voorbeelden die overal opduiken, treft SVG het beste. We kunnen verwachten dat we meer toegankelijke hulpmiddelen voor het maken van eenvoudige infovis zien zonder al te veel gedoe (denk ChartJS), maar ook meer educatieve tools die het potentieel en de kracht van SVG blootleggen aan mensen die geen stimulans hebben gehad om SVG eerder te onderzoeken.
Hoewel de flexbox-specificatie nog steeds in een niet-gestandaardiseerd niemandsland zit, is er relatief goede ondersteuning tussen browsers. Er is nog geen sprake geweest van een brede adoptie van flexbox (om onbekende redenen), maar we zijn van mening dat er dit jaar een duw zal zijn richting adoptie.
We zijn enthousiast genoeg over flexbox hier bij Tuts + dat we binnenkort een gids zullen plaatsen met uitleg over hoe je lay-outs snel met flexbox kunt maken, dus pas op voor dat!
U zult nog geen volledige adoptie van een oplossing voor een retina-afbeelding zien. Hoewel Webkit srcset heeft geïmplementeerd, lossen ontwikkelaars dit probleem al op een iets minder efficiënte of robuuste manier op. Terwijl srcset zal uiteindelijk nodig zijn, want de meeste ontwikkelaars zullen de problemen blijven oplossen door grotere afbeeldingen met lagere kwaliteit te besparen.
Weet je nog toen parallax het volgende hete ding werd? Iedereen begon het te gebruiken op nieuwe en spannende (maar ook versleten en angstaanjagende) manieren om verhalen te vertellen en de gebruikerservaring te verbeteren. Je mag verwachten dat mensen video op grote schaal gaan gebruiken als een ontwerpelement (bijvoorbeeld als achtergrond) in plaats van alleen maar als een "echte" theaterervaring zoals we die met YouTube hebben gezien.
Dit bestaat al heel lang (er waren zelfs incarnaties ingebouwd in Flash), maar is tot voor kort niet populair geworden bij commerciële ondernemingen. Dit zal interessante uitdagingen worden, met name met betrekking tot videogrootte en compressie.
Hoewel animaties zeker geen nieuw ding zijn, stijgen geanimeerde logo's en icoonelementen in populariteit. SVG-animatie kan met CSS worden gedaan, en projecten zoals Iconic, die meer dan 6 keer hun doelwit hebben bereikt op Kickstarter, evenals open source-inspanningen zoals Climacons, tonen de belofte van een nieuwe trend in gebruikerservaringontwerp op basis van vectorpadanimaties.
SVG-pictogrammen geanimeerd met CSS door Noah Blon (@noahblon) op CodePen
Het afgelopen jaar hebben tv-programma's zoals Breaking Bad een tweede schermervaring geboden, waardoor kijkers een diepere manier hebben om met de inhoud om te gaan.
In 2014, toen de acceptatie van mobiele telefoons nog steeds op de lagere eindmarkten kwam en de connectiviteit in ubiquity toenam, zal de acceptatie van een tweede scherm zich uitbreiden naar meer shows en meer formaten. Dit kan zelfs dingen omvatten zoals het synchroniseren van uw telefoon met uw computer tijdens het kijken naar een programma op Hulu, of het verbinden van uw tablet met uw spelconsole om secundaire informatie te bieden over wat u op het scherm ziet of doet.
Dit is een heel ander ontwerpgebied dan basisinhoudsontwerp. Ontwerpers zullen het concept van secundaire aandacht nog verder moeten overwegen, waarbij ze de rol van 'begeleiding' vervullen in plaats van 'hoofdfase'.
"Responsive" is duidelijk de dominante methode in webdesign. Ondanks hoe u omgaat met de toenemende behoefte aan technologie-agnostische ontwerpen en code, blijven gebruikers overgaan op meer apparaten in meer omgevingen. Tot nu toe was mobiele optimalisatie een niet-triviale onderneming; het zo klein mogelijk maken van uw codeproducten, het opstellen van mediaquery's, het bereiken van hoge framerates, het gebruik van caching en vele andere overwegingen vergt aanzienlijke investeringen.
In 2014 zullen veel frameworks de mobile-first-methodologie volledig overnemen en zal de barrière voor het maken van zeer performante sites voor elke technologie lager zijn. Codebibliotheken zoals Hammer.js, Zepto.js, Animate.css en vele anderen hebben de aanval geleid. Zoals we eerder hebben meegemaakt met de acceptatie door de industrie van HTML5, hopen we ook dat er in de hele industrie best practices voor mobiele optimalisatie worden toegepast die verder gaan dan alleen het schrijven van CSS-zoekopdrachten.
Medium, Svbtle, Editorial, exposure.so, Ghost en tal van andere tools en platformen hebben een nieuw tijdperk van webinhoud ingeluid dat puur op het presenteren van schrijven in een zeer toegankelijk formaat is gericht, zonder designkrukken. Deze verschuiving gaat door en beïnvloedt de ontwikkeling van het thema, nieuwe webservices en de 'collectieve ontwerpesthetiek'.
Misschien wil je ook Collis 'recente gedachten over webontwerptrends voor het komende jaar bekijken: 2014 Voorspellingen voor webontwerp.
Blijkt dat cross-browser testen op zijn weg is? Heeft u een idee over een nieuwe stijgende trend? Deel het in de reacties!
Accentsconagua