Ah, ich erinnere mich gut an die Tage ... als alles ein glänzender, im Schatten fallender Farbverlauf war, mit mindestens 6 Stück ClipArt und einem Foto von 5 feierlichen Büroangestellten. Wir liebten Bilder von Keyboards mit unsinnigen Knöpfen und 3D-Effekt-Sticks mit glänzenden Symbolen.

Und was ist dann passiert? iOS 7 kam mit. Das Farbverlaufswerkzeug in unseren Photoshops begann zu verstauben und wir löschten unsere riesige Bibliothek mit Stockfotos.

Flaches Design übernahm im Jahr 2013 . Alles musste hell, cartoonhaft und natürlich flach sein. So wie das flache Design eine Reaktion auf den Skeuomorphismus war, beginnen wir zu sehen, dass die Dinge ganz anders laufen.

Also, was ist der neue Geschmack des Jahres? Ich freue mich, dass Sie gefragt haben: Websites, die wie die Downloadseite eines Open-Source-Softwareunternehmens aussehen, das Ende der 90er Jahre heruntergefahren wurde.

Dies wurde dokumentiert durch Brutalistische Webseiten , die die Traktion aufnahm und die Deckung erreichte Washington Post und Schnelle Co um ein paar zu nennen. Aber das sind nur Webseiten von anspruchsvollen Designagenturen und experimentellen Künstlern? In der Brutalist Websites Showcase, das ist meistens richtig, aber wir beginnen zu sehen, diese ästhetische Leckage bis zum Mainstream. Nett! Wir können das glatte flache Design für den Rest unserer Tage nicht betrachten, können wir?

Persönlich liebe ich diesen Trend. Ich bin nicht der schärfste Webdesigner da draußen, und ich möchte auch kein abgedroschenes Framework verwenden - was immer ich zusammensetzen kann, ist das Beste, was ich tun kann.

Ich verbrachte Zeit damit, das Internet nach veraltetem Webdesign zu durchsuchen, und erfreute mich an klobigen Times New Roman und unbeholfenen Framesets. Wahrscheinlich weil es mich an eine einfachere Zeit erinnerte, in der sich die Leute Webmaster nannten und alles permanent "Under Construction" war.

Aber, um Webdesign von Grund auf zu lernen anstatt ein WP-Thema zu übernehmen oder CSS-Framework, ich war schon immer zu beschämt, um die einfache, hässliche Website meiner Träume zu erstellen. "Was wäre der Sinn?", Dachte ich. Es zu zeigen, würde mich lächerlich machen. Ich kann es nicht als eine Mappe für irgendetwas verwenden, ohne wie ein Chaos auszusehen.

CSS-light-Websites zu sehen, ohne dass JavaScript in Sicht war, gab mir die Zuversicht, dass ich aufhören muss, auf den Seiten anderer Leute zu arbeiten und stattdessen meine eigenen zu erstellen.

Mit Blick auf die Auswahl neuer minimalistischer Seiten bemerkte ich einige Schlüsselthemen, die scheinbar ihre hässlichen Köpfe aufziehen.

Einfarbig

Monochromes Design macht genau das, was gutes Design leisten sollte : lenkt Aufmerksamkeit auf den Inhalt.

001

Kein ausgefallenes CSS

Erinnerst du dich an die guten alten Zeiten? Wenn jeder eine Website besaß und etwas beweisen musste? Der (oder kleine) CSS-Ansatz bringt diese Tage zurück und macht mich persönlich extrem nostalgisch für einfachere Zeiten, in denen eine Website nur eine kurze Biografie und eine Sammlung von Links sein könnte.

002

Schräg geneigter / überlappender Text

Schräggestellter Text löst den Benutzer ein wenig aus und nicht auf eine erstaunliche Weise . Stattdessen ist es etwas, das der Benutzer nicht gewohnt ist zu sehen, so dass es einen starken Eindruck macht.

Sehen Sie sich die experimentelle Textplatzierung an, auf der Loïc verwendet seine Website . Die völlige Missachtung der Lesbarkeit gibt den Besuchern das Gefühl eines Modehauses, das keine Preisschilder hat. Es ist so informationslos (und in diesem Fall unnahbar), dass es nobel ist.

004

Wenig Rücksicht auf Maßstab oder Polsterung

Bloombergs ziemlich experimentell werden in diesen Tagen, und ich liebe es. Stellen Sie sich die Schwierigkeiten vor, die der Designer durchmachen musste, um mit dem großen Boss einverstanden zu sein.

Der Grund dafür ist, dass es so anders ist. Es berücksichtigt wenig harte Designregeln: genug Platz zwischen den Elementen lassen, Dinge in einem ähnlichen Maßstab halten und sogar sicherstellen, dass alles auf allen Geräten gut lesbar ist.

005

Verweise auf Legacy-Tech

Viele von uns werden gute Erinnerungen an Windows 98 oder frühe Mac-Betriebssysteme haben. Einige Websites vermitteln ein Gefühl von Nostalgie - und vielleicht auch Humor - indem sie auf alte Software verweisen. Schließlich stammt viel brutalistisches Webdesign aus den "alten Zeiten".

Schau dir dieses Beispiel an HTML veröffentlichen (Diese Ordner enthalten jeweils experimentelle Kunst).

006

Was das für Designer bedeutet

Wir dachten, dass flach = Einfachheit, aber offensichtlich brauchte es noch eine Menge Designarbeit, um es richtig zu machen.

Mit brutalistischer Ästhetik, die in den Vordergrund rückt, müssen sich Designer weniger auf traditionelle CSS-Frameworks und Code-Sites von Grund auf verlassen.

Es scheint jedoch nicht so zu sein, dass Unternehmen diesen Trend auf ihren Websites nutzen. Brutalistisches Design - abgesehen von Bloomberg und einigen anderen größeren Namen - beschränkt sich derzeit auf Design-Agenturen, experimentelle Sites und persönliche Blogs.

Wenn Sie Ihre eigene brutalistische Website erstellen möchten, hier sind ein paar Hinweise ...

Entfernen Sie das CSS von Ihrer aktuellen Site

Während einige Websites für horizontale Positionierung stark auf CSS angewiesen sind, ist es möglich, alle Stile von einigen Websites zu rippen und sie trotzdem "richtig" anzeigen zu lassen. Hier ist ein Beispiel:

Wenn Ihre Website auf auffällige Animationen, JavaScript oder ausgefallenes CSS angewiesen ist, muss sie wahrscheinlich neu erstellt werden, wenn Sie diesen Stil übernehmen möchten. In der Tat war der Grund, warum ich WordPress verließ, weil ich kein Thema finden konnte, das zu meiner Vision passte. Am Ende lernte ich schließlich HTML / CSS, indem ich eine alte Vorlage aus den frühen 2000ern bearbeitete. Danach war ich zuversichtlich, weiterzumachen und von vorne anzufangen, meine eigene chaotische CSS zu kritzeln und das Äußerste von einer polierten, "modernen" Seite zu machen.

Zurück zu Monochrom

Manchmal bedeutet brutalistisches Design ein einfaches Design. Und das ist immer großartig für die Benutzererfahrung. Wenn Sie Ihre aktuelle Farbpalette auf nur zwei Farben (schwarz und eine andere weiß, technisch) reduzieren, können Sie die Überlastung des Benutzers reduzieren und ihm eine klarere Richtung geben, wohin er gehen soll. Schließlich sehen Sie im Textbereich keine Websites mit vielen verschiedenen Farben, weil es schwer ist, sich darauf zu konzentrieren.

Werden Sie kreativ bei der Textpositionierung

Wer hat gesagt, dass man alles schön anordnen muss? Die obige Website von Loïc Dupasquier ist zum Beispiel eine mutige Aussage, die etwas über den Designer aussagt. Sieht genauso aus wie jeder andere potentielle Mieter ist kein gutes Aussehen.

Wenn Sie nicht der berühmteste Designer in diesem Bereich sind, werden Sie immer die zweitbeste sein. Indem Sie die traditionellen Regeln der Typografie meiden, heben Sie sich von der Masse ab.

Erlernen Sie die Grundlagen und alten Wege neu

Es ging mir nicht darum, Design oder Skillset einer neuen Mentalität anzupassen. Ich habe die Grundlagen des Webdesigns gelernt, als die Websites tatsächlich so aussahen wie die, die ich Ihnen gezeigt hatte, also musste ich mich nur kurz auffrischen und zur Arbeit gehen.

Ich würde empfehlen, den Quellcode auf alten Seiten und auf Brutalist-Websites zu lesen, alte HTML-Tutorials , oder diese Goldmine Das enthält eine Liste der ältesten noch lebenden Websites.

Wo dieser Stil gut funktioniert (und wo nicht)

Am Ende ist eine Website immer ein Gleichgewicht zwischen Selbstausdruck und Schaffung der besten Erfahrung für Ihre Benutzer.

In einem Blog ist es wahrscheinlich am besten, sich darauf zu konzentrieren, den Textkörper einfach zu verdauen. Sie werden feststellen, dass während Bloombergs Stück auf Yahoo ziemlich seltsam beginnt, der Hauptteil des Textes leicht zu lesen ist.

Wenn Sie also einen Blog erstellen, ist es besser, sich an Konventionen für den Artikelkörper zu halten. Beispielsweise, VERDRAHTET Das Design ist sehr markant, aber wenn es um die Artikel selbst geht, verwenden sie eine angenehme Schriftart und halten sie lesbar.

Für einen Designer, der hauptsächlich mit stickigen Unternehmen arbeitet, könnte ein experimentelles Portfolio den Kunden im wichtigsten Moment - dem ersten Kontakt - abschalten.

Am Ende kommt es darauf an, dein Publikum zu kennen und ob du es konntest, Konventionen völlig zu ignorieren.

Geh hervor und mach etwas Ekelhaftes.