Web Design News & Link-Tipps – Nr. 40

Unsere Themen im März: Neue Features für Figma, spannende neue Möglichkeiten mit CSS und JS, verlangsamte WordPress-Entwicklung und positive sowie negative Auswirkungen von KI.

Aktualisiert am 18. März 2025

UX/UI Design

Figma veröffentlicht AI-Features (in Beta)

Figma hat erste AI-Features veröffentlicht. Es können jetzt schnelle Wireframes und Entwürfe automatisch gestaltet und Screens zu Flows verknüpft werden. Auch Ebenen werden auf Wunsch automatisch benannt, Texte ersetzt und Grafiken freigestellt.

Connected Projects in Figma effizient nutzen

Figma erleichtert die Zusammenarbeit zwischen Teams und Organisationen mit »Connected Projects«. Diese offizielle Anleitung erklärt, wie Agenturen und Kund*innen gemeinsam an einem Projekt arbeiten können, ohne Lizenzen mehrfach bezahlten zu müssen. Jedes Team nutzt dazu seine eigenen »billable seats«.

Design im Browser: Ein praxisnaher Ansatz, den auch wir bevorzugen

Statt statischer Mockups direkt im Code arbeiten – dieser Ansatz spart Zeit und sorgt für realistische Designs. Cloud Four beschreibt in diesem Beitrag, warum das Designen im Browser viele Vorteile bietet. Genau diesen Workflow setzen wir seit Jahren in Projekten ein, um Layouts schneller iterativ anzupassen und direkt unter realen Bedingungen zu testen.

Formulare mit dem EAS-Framework vereinfachen

Das EAS-Framework (Eliminate, Automate, Simplify) eignet sich hervorragend zur Vereinfachung von Formularstrecken. Die Nielsen Norman Group hat dazu einen hilfreichen Artikel mit vielen Beispielen veröffentlicht.

Frontend

JavaScript Temporal: Die Zukunft der Datums- und Zeitverarbeitung

Die Date-API in JavaScript war lange fehleranfällig und unflexibel. Dieser Beitrag auf MDN Web Docs stellt Temporal vor – eine neue, leistungsstarke API für präzise und zuverlässige Datums- und Zeitberechnungen. Weniger Workarounds, mehr Kontrolle und endlich eine moderne Lösung für komplexe Zeitoperationen.

CSS Functions

In Chrome Canary können native CSS-Funktionen, vergleichbar mit SCSS-Mixins, jetzt getestet werden. Die Implementierung ist noch unvollständig und muss explizit aktiviert werden (»behind the flag«), aber es tut sich etwas. Mehr dazu auf CSS-Tricks und bei Bram.us.

CSS Relative Colors

Mit sog. relativen Farben lassen sich Farben in CSS dynamisch anpassen, ohne zusätzliche Variablen oder Preprozessoren. Ahmad Shadeed zeigt in diesem Beitrag, wie sich Helligkeit, Sättigung und Farbton direkt aus bestehenden Werten ableiten lassen.

CSS: Border-Radius mit View Transitions animieren

Wie man mit den noch recht neuen und leider noch nicht in im Browser Firefox verfügbaren View Transitions eine sanfte Animation des border-radius erreicht, wird erneut von Bramus in seinem aktuellen Blogbeitrag ausführlich und anschaulich erläutert.

Elemente im DOM verschieben, ohne den Zustand zu verlieren

Mit moveBefore() lassen sich Elemente dynamisch innerhalb des DOMs umpositionieren, ohne dass ihr Zustand verloren geht. Dieser Beitrag zeigt, wie die neue API das bisher umständliche Neu-Rendern vermeidet und den Umgang mit interaktiven Komponenten vereinfacht.

Frontend-Entwicklung im Zeitalter der KI

Webentwickler Josh W. Comeau argumentiert auf seinem Blog, dass trotz der Befürchtungen, dass KI die Frontend-Entwicklung obsolet machen könnte, die Nachfrage nach Entwicklern bestehen bleiben wird, während sich das Feld weiterentwickelt. Er glaubt, dass KI-Tools zwar die Arbeitsweise verändern werden, aber den Bedarf an qualifizierten Entwicklern nicht ersetzen können.

WordPress

Google-Suche vs. AI

WordPress wird in vielen Fällen dafür genutzt, SEO-optimierte Website zu erstellen. Interessierte geben bei Google & Co etwas ein und gelangen so auf eine Website mit redaktionellem Content zum Thema. Diese User Journey wird zukünftig immer weniger rentabel sein. Einerseits durch ein verändertes Suchverhalten (Chat GPT statt Google) und andererseits durch die eine Flut an KI-erzeugtem Content. WinningWP zeigt Strategien auf, um dem zu begegnen.

WordPress 6.8

WordPress 6.8 ist für den 15. April angekündigt. Zu den neuen Features gehören spekulatives Laden, also das Vorausladen von Zielseiten beim Hovern eines Links, Sicherheits-Updates mit der sukzessiven Umstellung auf bcrypt für Passwörter im Hintergrund sowie zahlreiche kleinere Verbesserungen. Weitere Details gibt es auf make.wordpress.org.

Eigenes Theme als WordPress-Default-Theme definieren

Eigentlich für WordPress-Multisites gedacht, aber auch im Single-WordPress-Umfeld einsetzbar, gibt es eine Angabe für die wp-config.php, mit der das Default-Theme definiert werden kann. Im Website-Zustand wird dann nicht mehr angezeigt, dass die Installation eines Standard-Themes empfohlen wird.

WordPress-Entwicklung könnte sich verlangsamen

Der Streit zwischen Matt Mullenweg bzw. Automattic und WP Engine hat dazu geführt, dass beide Unternehmen ihre Beiträge zur WordPress-Weiterentwicklung stark reduziert haben. Nun haben weitere Unternehmen eine Verknappung angekündigt, was dazu führen könnte, dass WordPress künftig nur noch ein Major-Release pro Jahr veröffentlicht. In einem Zoom-Meeting wurden wohl die nächsten Versionen 6.9 für 2026 und 7.0 für Ende 2027 geplant.

Barrierefreiheit

Skip-Links: Warum sie wichtig sind und wie sie funktionieren

Skip-Links erleichtern die Navigation für Tastaturnutzer*innen und Screenreader. Dieser Beitrag auf tempertemper.net erklärt, warum sie unverzichtbar für die Barrierefreiheit sind und wie sie korrekt implementiert werden. Eine einfache, aber wirkungsvolle Maßnahme für eine bessere Nutzerführung.

AI

Wie Generative AI unser Denken verändert

Basierend – ironischerweise – auf einer aktuellen Studie von Microsoft (Hauptinvestor von OpenAI) und deren Hypothese, dass höheres Vertrauen in Generative AI zu weniger kritischem Denken führt, macht sich der Neurowissenschaftler Erik Hoel Gedanken über die Auswirkungen des aktuell diskutierten »Ai Brain Drain«.

Rechtliche Infos zur Video-KI Sora

OpenAIs Video-KI »Sora« ist nun auch in Europa verfügbar. Auf Anwalt.de gibt es rechtliche Tipps zur Nutzung für Agenturen und Unternehmen.

Freier und offener Zugang im Zeitalter der generativen KI

Molly White beschreibt auf ihrem Blog Citation Needed, wie generative KI-Modelle, die mit frei zugänglichem Material trainiert werden, eine Bedrohung für Projekte wie Wikipedia darstellen, indem sie deren Ressourcen nutzen und gleichzeitig deren Existenz gefährden. Auch stellt sie Methoden vor, damit umzugehen, ohne den offenen Zugang für alle einzuschränken.

Tools

Designtokens.fyi bietet eine umfangreiche Sammlung von Definitionen, Ressourcen, Best Practices und Tools rund um das Thema Design Tokens.

Geschrieben von:

Raimund Büchner

Raimund ist oft die erste Ansprechperson bei kulturbanause. Er kümmert sich hauptsächlich um die Betreuung und Beratung unserer bestehenden als auch künftigen Kundschaft. Ein weiterer Schwerpunkt seiner Tätigkeit liegt im Design nicht unmittelbar sichtbarer Dinge: Struktur und Inhalte. Projekte unterstützt er daher vor allem in der Anfangsphase in Bereichen wie Informationsarchitektur, UX-Design und Content Strategy.

Jonas Hellwig

Jonas ist Gründer der Agentur kulturbanause und des kulturbanause Blogs. Er arbeitet an der Schnittstelle zwischen UX/UI Design, Frontend und Redaktion und hat zahlreiche Fachbücher und Video-Trainings veröffentlicht. Jonas Hellwig ist regelmäßig als Sprecher auf Fachveranstaltungen anzutreffen und unterstützt mit Seminaren und Workshops Agenturen und Unternehmen bei der Planung, der Gestaltung und der technischen Umsetzung von Web-Projekten.

Jonas Hellwig bei Xing

Felix Lehmann

Als Team Lead für Design und Code bei kulturbanause verantwortet Felix die Konzeption, Gestaltung und Entwicklung komplexer Websites und Designsysteme. Er begleitet den gesamten Prozess – vom ersten Workshop bis zum Launch. Wenn er nicht selbst maßgeblich an der Umsetzung beteiligt ist, unterstützt er das Team bei der Umsetzung moderner, funktionaler Lösungen mit aktuellsten Browser-Technologien und ist die Schnittstelle zum Kundenteam.

Robert Menzel

Robert arbeitet als Frontend-Developer und Web-Designer bei kulturbanause. Zu seinen Aufgaben gehören die visuelle Gestaltung und die technische Umsetzung von Websites, eCommerce-Shops oder dessen Kombination. Besonders gerne übernimmt er die Entwicklung individueller und anspruchsvoller Websites mit umfangreichen ineinandergreifenden Funktionen, getreu dem Motto: »Der beste Lack bringt nichts, wenn die Maschine darunter nicht läuft.«