Share
Dieses Jahr war ein brillant Jahr im Webdesign. Mehr als in jedem anderen Jahr wurden große Schritte in Richtung Reifung des Feldes unternommen. Schauen wir uns einmal an, was wir für die Zukunft des Webdesigns als Branche erwarten können.
Jeder, der schon länger als ein paar Jahre im Webdesign gearbeitet hat, hat zweifellos das Problem der Kluft zwischen Design und Front-End-Entwicklung. Designer leben in ähnlichen Tools wie Photoshop oder Sketch und Entwickler in ihren Texteditoren.
In diesem allgemeinen Arbeitsablauf gab es viele Lösungsansätze, darunter SiteGrinder, Dreamweaver und Adobe Muse. Alle diese Lösungen sind mit ihren Problemen verbunden und wurden bisher nicht allgemein angenommen. In der Regel haben Frontend-Entwickler entweder an ihren alten Wegen festgehalten, oder Designer gehen mehr in den Browser, um zu arbeiten, und schließen die Lücke. Es werden jedoch Instrumente entwickelt, um diese Lücke weiter zu schließen. Mit Tools wie Macaw, die kurz davor sind, freigegeben zu werden, verkürzt sich der Weg zu einem Ende der mühsamen Lücke zwischen Design und Front-End-Entwicklung.
Diese Tools werden von der Tatsache, dass Web-Design-Trends flache Farben mit sehr geringer Textur und vorhersehbar wiederholten Elementen angenommen haben, stark profitieren. Diese Elemente sind weitaus weniger komplex als die stark imageabhängigen UI-Elemente von vor einigen Jahren. Daher ist es eine wichtige Phase, um Tools zur automatischen Generierung einzuführen gut organisiert, semantisch Code.
Es gibt keine gute "WYSIWYG" -fähige JavaScript-Implementierung, die über grundlegende konfigurierbare Widgets hinausgeht. Der Hauptgrund dafür ist, dass HTML und CSS beides sind erklärend Sprachen, während JavaScript eine Programmiersprache ist. Die "Zeichenfläche" für JavaScript ist inhärent der Texteditor. Die Leinwand für HTML ist inhärent das Dokument.
Da Browser die neuesten Standards annehmen, Telefone schneller werden, Bildschirme unvorhersehbarer werden und die Designs weiter abflachen, wird die Anzahl der Grafikbilder, die auf einer bestimmten Website verwendet werden, deutlich reduziert werden. Komplexe Elemente der Benutzeroberfläche werden immer mehr auf CSS angewiesen sein, und für Dinge, die nicht rein mit CSS zu bewerkstelligen sind, wird SVG übernommen. Die Hauptausnahme ist die Fotografie. Große Fotos beanspruchen immer mehr Gestaltungsraum, da Designer mehr auf inhaltsorientierte, transparente Bilder setzen, um Erfahrung und Erzählung zu definieren.
Mit schönen Beispielen, die überall auftauchen, erreicht SVG seine Blütezeit. Man kann davon ausgehen, dass es barrierefreiere Werkzeuge für die Erstellung grundlegender Infovis gibt (siehe ChartJS). Außerdem gibt es mehr Lerninstrumente, die das Potenzial und die Macht von SVG für Menschen offenlegen, die zuvor noch keinen Anreiz hatten, SVG zu erkunden.
Obwohl sich die Flexbox-Spezifikation immer noch in einem nicht standardisierten Niemandsland befindet, wird sie von Browsern relativ gut unterstützt. Flexbox ist aus unbekannten Gründen nicht weit verbreitet, aber wir glauben, dass es in diesem Jahr einen Adoptionsschub geben wird.
Wir freuen uns sehr über die flexbox hier bei Tuts +, dass wir bald eine Anleitung veröffentlichen werden, in der erklärt wird, wie Sie mit flexbox Layouts erstellen können!
Eine Retina-Image-Lösung wird noch nicht vollständig angenommen. Obwohl Webkit srcset implementiert hat, lösen Entwickler dieses Problem bereits auf etwas weniger effiziente oder robuste Weise. Während srcset wird schließlich notwendig sein, denn die meisten Entwickler werden die Probleme weiterhin lösen, indem sie größere Bilder mit geringerer Qualität speichern.
Erinnern Sie sich, als Parallaxe das nächste heiße Ding wurde? Alle nutzten es auf neue und aufregende Weise (und auch erschöpft und beängstigend), um Geschichten zu erzählen und das Benutzererlebnis zu verbessern. Sie können davon ausgehen, dass die Menschen Video als Gestaltungselement (z. B. als Hintergrund) und nicht nur als fokussiertes "Theater" -Erlebnis, wie wir es bei YouTube gesehen haben, allgemein annehmen werden.
Das gibt es schon lange (in Flash wurden sogar Inkarnationen gebaut), hat sich aber bei kommerziellen Unternehmungen bis vor kurzem nicht durchgesetzt. Dies bringt interessante Herausforderungen mit sich, insbesondere in Bezug auf Videogröße und Komprimierung.
Animationen sind zwar nichts Neues, aber animierte Logo- und Ikonenelemente werden immer beliebter. SVG-Animationen können mit CSS ausgeführt werden, und Projekte wie Iconic, bei denen das Ziel bei Kickstarter um das 6fache angestiegen ist, sowie Open-Source-Projekte wie Climacons versprechen einen neuen Trend im User Experience-Design, der auf Vektorpfadanimationen basiert.
Mit CSS animierte SVG-Icons von Noah Blon (@noahblon) auf CodePen
Im vergangenen Jahr bot TV-Sendungen wie Breaking Bad ein zweites Bildschirmerlebnis, das den Zuschauern eine tiefere Möglichkeit bietet, mit dem Inhalt zu interagieren.
Im Jahr 2014, da die Einführung von Mobilgeräten immer weiter die unteren Märkte erreicht und die Konnektivität in der Allgegenwart zunimmt, wird die Einführung des zweiten Bildschirms auf mehr Shows und weitere Formate ausgedehnt. Dazu gehören unter anderem das Synchronisieren Ihres Telefons mit Ihrem Computer, während Sie eine Show in Hulu ansehen, oder die Verbindung Ihres Tablets mit Ihrer Spielekonsole, um sekundäre Informationen darüber zu erhalten, was Sie auf dem Bildschirm sehen oder tun.
Dies ist ein ganz anderer Gestaltungsbereich als bei der grundlegenden Gestaltung von Inhalten. Designer müssen das Konzept der sekundären Aufmerksamkeit noch weiter in Betracht ziehen und die Rolle der "Begleitung" anstelle der "Hauptbühne" erfüllen.
"Responsive" ist eindeutig die dominierende Methode im Webdesign. Obwohl Sie mit dem steigenden Bedarf an technologieannostischen Entwürfen und Code umgehen, wechseln die Benutzer immer mehr Geräte in mehr Umgebungen. Mobile Optimierung war bisher ein nicht triviales Unterfangen. Ihren Code so klein wie möglich zu gestalten, Medienanfragen zu erstellen, hohe Frameraten zu erzielen, Caching zu nutzen, und viele andere Überlegungen erfordern erhebliche Investitionen.
Im Jahr 2014 werden viele Frameworks die Mobile-First-Methodik vollständig übernehmen, und die Barriere bei der Erstellung hochperformanter Sites für jede Technologie wird geringer. Codebibliotheken wie Hammer.js, Zepto.js, Animate.css und viele andere haben die Ladung angeführt. Wie wir zuvor bei der Einführung von HTML5 in der Branche erfahren haben, hoffen wir auch auf eine branchenweite Übernahme von Best Practices für die mobile Optimierung, die über das einfache Schreiben von CSS-Abfragen hinausgeht.
Medium, Svbtle, Editorially, Exposure.so, Ghost und viele andere Tools und Plattformen haben eine neue Ära von Web-Inhalten eingeläutet, die sich ausschließlich auf die Darstellung von Schriften in einem leicht zugänglichen Format ohne Design-Krücken konzentrieren. Diese Verschiebung wird sich fortsetzen und die Themenentwicklung, neue Webdienste und die "kollektive Designästhetik" beeinflussen..
Vielleicht möchten Sie auch die neuesten Gedanken von Collis zu Trends im Webdesign für das kommende Jahr lesen: Prognosen für Webdesign für 2014.
Denken Sie, dass Cross-Browser-Tests auf dem Weg sind? Haben Sie eine Vorstellung von einem neuen steigenden Trend? Teilen Sie es in den Kommentaren!
Accentsconagua