Share
I år har det varit en lysande år i webbdesign. Mer än något annat år kanske har stora framsteg gjorts mot modning av fältet. Låt oss ta en titt på några av vad vi kan förvänta oss för framtiden för webbdesign som en bransch.
Den som har gjort webbdesign i längre tid än några år har utan tvekan haft problem med klyftan mellan design och front-end-utveckling. Designers lever i verktyg som liknar Photoshop eller Sketch, och utvecklare bor i sina textredigerare.
Detta vanliga arbetsflöde har sett många försök till en lösning, inklusive saker som SiteGrinder, Dreamweaver och mer nyligen Adobe Muse. Alla dessa lösningar kommer med sina problem och har inte blivit allmänt antagna. Framtidsutvecklare har för det mesta antingen fastnat på sina gamla sätt, eller konstruktörer flyttar mer in i webbläsaren för att arbeta och stänger klyftan. Men verktygen är på väg att stänga detta gap ännu längre. Med verktyg som Macaw på randen för att släppas, förkortas vägen till ett slut på den noggranna klyftan mellan design och framkantutveckling.
Dessa verktyg kommer till stor nytta av att webbdesigntrender har antagit plana färger med väldigt liten textur och förutsägbart upprepade element. Dessa element är mycket mindre komplexa än de starkt bildrelaterade ui-elementen för några år sedan, så det är ett utmärkt steg att introducera verktyg för att automatiskt generera välorganiserad semantisk koda.
Du kommer inte se ett bra "WYSIWYG" -jaktigt JavaScript-implementering för något bortom grundläggande konfigurerbara widgets. Den främsta orsaken till detta är att både HTML och CSS är deklarativ språk, medan JavaScript är ett programmeringsspråk. Den "kanfas" för JavaScript är i sig textredigeraren. Duken för HTML är i sig dokumentet.
Eftersom webbläsare antar de senaste standarderna blir telefonerna snabbare, skärmar blir mer oförutsägbara och mönster fortsätter att platta ut, vi ser en betydande minskning av antalet grafiska bilder som används på en viss webbplats. Komplexa UI-element fortsätter att förlita sig mer och mer på CSS, och för saker som inte kan uppnås rent med CSS kommer SVG att antas. Det främsta undantaget är fotografi. Stora bilder fortsätter att kräva mer designutrymme, eftersom designers lita mer på innehållsorienterade transparenta bilder för att definiera erfarenhet och berättande.
Med vackra exempel som dyker upp överallt slår SVG sitt huvud. Vi kan förvänta oss att se mer tillgängliga verktyg för att skapa grundläggande infovis utan mycket besvär (tänk ChartJS) samt mer pedagogiska verktyg som exponerar SVGs potential och kraft för personer som inte har haft incitament att utforska SVG tidigare.
Även om flexbox-specen fortfarande sitter i ett icke-standardiserat ingenmans land, finns det relativt bra stöd över webbläsare. Det har inte varit ett brett antagande av flexbox (av okända skäl), men vi tror att det här året kommer att bli ett tryck mot adoption.
Vi är glada över flexbox här på Tuts +, så vi lägger ut en guide som förklarar hur du skapar layouter med flexbox snart, så se upp för det!
Du kommer inte att se fullständig adoption av en näthinnans bildlösning än. Även om Webkit har implementerat srcset, löser utvecklarna redan detta problem på något mindre effektivt eller robust sätt. Medan srcset kommer så småningom vara nödvändigt, för de flesta utvecklare fortsätter att lösa problemen genom att spara större bilder med lägre kvaliteter.
Kom ihåg när parallax blev nästa heta? Alla började använda det på nya och spännande (såväl som slitna och skrämmande) sätt att berätta historier och förbättra användarupplevelsen. Du kan förvänta dig att folk kommer att bredda anta video som ett designelement (till exempel som bakgrund) snarare än bara som en "teater" -upplevelse som vi har sett med YouTube.
Detta har funnits länge (det fanns även inkarnationer inbyggda i Flash), men har inte blivit populärt med kommersiella företag fram till nyligen. Med detta kommer det att bli intressanta utmaningar, särskilt relaterade till videostorlek och komprimering.
Medan animeringar verkligen inte är nya, ökar animerad logotyp och ikonelement i popularitet. SVG-animering kan göras med CSS, och projekt som Iconic, som ökade över 6 gånger sitt mål på Kickstarter, samt öppen källkodssatsning som Climacons, visar löftet om en ny trend i användarupplevelse design baserat på vektorvägs animeringar.
SVG Ikoner Animerade med CSS av Noah Blon (@noahblon) på CodePen
Under det gångna året erbjöd tv-serier som Breaking Bad en andra skärmupplevelse, vilket gav tittarna ett djupare sätt att interagera med innehållet.
Under 2014 fortsätter adoptionen av mobilen att nå lägre slutmarknader och anslutningsökningar ökar i ubiquity, antagandet av andra skärm kommer att sträcka sig till fler shows och fler format. Det kan till och med innehålla saker som att synkronisera telefonen till datorn medan du tittar på en show på Hulu eller kopplar din surfplatta med spelkonsolen för att erbjuda sekundär information om vad du ser eller gör på skärmen.
Detta är ett mycket annat designområde än grundläggande innehållsdesign. Designers kommer att behöva överväga ytterligare begreppet sekundär uppmärksamhet, uppfylla rollen som "ackompanjemang" istället för "huvudstadiet".
"Responsive" är klart den dominerande metoden i webbdesign. Trots hur du hanterar det stigande behovet av teknologisk agnostisk design och kod fortsätter användarna att flytta till fler enheter i fler miljöer. Fram till nu har mobiloptimering varit ett icke-trivialt företagande; göra dina kodleveranser så små som möjligt, bygga mediafrågor, uppnå höga framerater, utnyttja caching och många andra överväganden tar betydande investeringar.
Under 2014 kommer många ramar att helt och hållet anta den första första metoden, och barriären för att skapa högpresterande webbplatser för vilken teknik som helst kommer att sänka. Kodbibliotek som Hammer.js, Zepto.js, Animate.css, och många andra har lett till avgiften. Som vi tidigare upplevt med branschens adoption av HTML5, hoppas vi också se en branschövergripande antagande av bästa praxis för mobiloptimering som går utöver att bara skriva CSS-frågor.
Medium, Svbtle, Editorial, exposure.so, Ghost och många andra verktyg och plattformar har inlett en ny era av webbinnehåll som fokuserar rent på att presentera skrivning i ett lättillgängligt format, utan några designkryckor. Detta skifte kommer att fortsätta, vilket påverkar temat utveckling, nya webbtjänster och "kollektiv design estetisk".
Du kanske också vill kolla Collis senaste tankar om webbdesigntrender för det kommande året: 2014 Förutsägelser för webbdesign.
Tänk på att webbläsartestning är på väg ut? Har du en uppfattning om en ny stigande trend? Dela det i kommentarerna!
Accentsconagua