Web Design News & Link-Tipps – Nr. 18
Von kulturbanause Team In dieser Ausgabe versorgen uns Konferenzen mit Neuigkeiten, sorgen Deals für Unruhe und bieten Jubiläen die Gelegenheit zum Feiern.
Scoped CSS ist zurück
Im zweiten Anlauf in der CSS-Spezifikation soll mit CSS möglich werden, was einige JS-Frameworks von Natur aus beherrschen: CSS-Styles auf Komponenten zu beschränken. Noch experimentell in Chrome mit Feature Flag verfügbar, wird das ggf. ein lange erwarteter »Game Changer«.
Block Templates in WordPress
Der Artikel »Understanding the Power of Block Templates in WordPress« gibt eine gute Einführung zum Erstellen und Anpassen von Block Templates für den WordPress-Block-Editor (Gutenberg). Block Templates sorgen dafür, dass beim Erstellen eines neuen Beitrags pro Post Type automatisch bestimmte Blöcke mit Platzhalter-Texten eingefügt werden.
Bessere Performance mit CSS
Obwohl nicht mehr ganz neu, doch wieder bei uns im Gespräch gewesen: Mit der CSS-Eigenschaft content-visibility: auto; in Kombination mit contain: layout; können wir dem Browser signalisieren, dass er das Rendern von nicht sichtbaren Layoutbereichen verzögern und Komponenten unabhängig voneinander behandeln kann.
Individuelle Einstellungen in WooCommerce
»Settings Pages in WooCommerce« zeigt, wie man im Backend von WooCommerce die Einstellungen für Unterseiten (Tabs) anpasst und erweitert.
KI-Tool »Firefly« von Adobe
Das Tool »Firefly« kann in Beta-Version und nach Anmeldung getestet werden. Es lässt sich schon erkennen, welchen Weg solche visuellen KI-Tools bereits zurückgelegt haben.
Jamstack für Alles?
In seinem Artikel »Ist der Jamstack wirklich komplett das Ding?« erörtert Gerrit van Aaken das Für und Wider der stark gestiegenen Beliebtheit der Jamstack-Entwicklung. Neben unbestreitbaren Vorteilen fällt ihm insbesondere die Abhängigkeit vieler Frameworks von großen Hosting-Anbietern ins Auge.
Google I/O 2023
Die Entwickler-Konferenz von Google bringt viele interessante Neuigkeiten, bspw. den neuen Core Web Vital »INP« ab 2024 und ein Update für Material Design. Sehr interessant ist auch die Stakeholder-freundliche Bewertung des Browser-Supports mit Hilfe des neuen Dienstes »Baseline« . Für den kompletten Überblick zur Konferenz gibt es reichlich Videos.
Post Type & Taxonomy-Registrierung in ACF deaktivieren
Seit Version 6.1 bietet das bekannte Plugin »Advanced Custom Fields« (ACF) die Möglichkeit, individuelle Beitragstypen und Taxonomien zu registrieren. Der Beitrag bei WP Fieldwork zeigt, wie man das Feature »schnell und schmerzlos« deaktiviert.
Design für Alle
In der angekündigten Serie »UX-Design und Inklusion« ist der erste Teil erschienen, der Design für Menschen mit Seheinschränkungen behandelt, welche alle von uns zumindest temporär beeinträchtigen. Wir können nicht oft genug darauf hinweisen.
UX, Usability und a11y
Dieser sehr schöne Artikel gleicht die »10 Usability Heuristics for User Interface Design« von Jakob Nielsen mit den Barrierefreiheitsanforderungen der WCAG ab. Für jede Regel werden alle zutreffenden Erfolgskriterien verlinkt. Es zeigt sich: Hohe Nutzerfreundlichkeit hat viel mit uneingeschränkter Zugänglichkeit gemeinsam.
WordPress-Plugins im Periodensystem
Zum 20-jährigen Jubiläum von WordPress hat Pascal Birchler nach Art des Periodensystems eine Übersicht über die über hundert populärsten WordPress-Plugins erstellt.
WebContainer nun auch in Safari
Damit wird die Technologie von allen bedeutenden Browsern unterstützt. Der Artikel auf StackBlitz blickt zurück und gibt einen Ausblick.
Invertierte User Stories
Nutzende wollen keinen Task ausführen, sondern einen Nutzen gewinnen. Das findet sich in produktorientierten Nutzungsszenarien immer weniger wieder. Wenn man diese »umdreht«, geben sie u.U. mehr Sinn: »Ich möchte etwas erreichen, OHNE etwas anderes zu müssen.«
Feature Support testen
Auf moderncss.dev gibt es ein interessantes Tutorial, wie man die Unterstützung von modernen CSS-Features mit der @supports-Regel testet, worauf man dabei achten muss und wie Fallbacks eingebaut werden können.
Animationen durch Scrollen auslösen
Bei den Chrome Developers gibt es ein gewohnt ausführliches Tutorial zum Thema »Animate elements on scroll with Scroll-driven animations«. Zum Nachvollziehen und Betrachten vieler Demos braucht man Chrome 115+ mit aktivierter »Experimental Web Platform Features«-Flag.
Unruhige Zeiten für Figma und XD
Durchaus beunruhigende Nachrichten zu den Prototyping-Tools von Adobe: XD ist scheinbar nicht mehr als Einzelapplikation herunterzuladen, US- und EU-Behörden überprüfen wohl den Figma-Deal … Im Adobe-Forum gibt es populäre Stimmen, die zur Migration von XD zu Figma raten, dabei können wir gerne unterstützen.
Responsive Kontrolle in WordPress
Auf olliewp.com gibt es einen in vielen Bewertungen und Argumenten richtigen Beitrag zum Zusammenspiel von Responsive Design und WordPress. Es spielen allerdings Marketing-Aspekte für das eigene Block-Theme hinein, die für ein werbliches Geschmäckle des Artikels sorgen.
Mehr Farbtreue mit OKLCH
Die neue Farbnotation OKLCH ermöglicht eine deutlich besser an die menschliche Wahrnehmung angepasste Farbdarstellung als der bisherige (inoffizielle) Standard HSL. Der Beitrag »It’s Time to Learn oklch Color« erläutert Grundlagen und zeigt Unterschiede zum HSL auf.
Wie die Zeit vergeht …
Nicht nur WordPress, sondern auch der im besten Sinne stilprägende CSS Zen Garden feiert dieses Jahr den 20. Geburtstag. Wer (wie die meisten bei uns) sich an die damalige Aufbruchsstimmung erinnern kann, hat schon ein paar Jahre auf dem Buckel.
Tools
- Auf svggradients.com ist ein Generator für SVG-Gradients zu finden.
- oklch.com ist der Picker und Konverter für den Einsatz von OKLCH-Farben.
Geschrieben von kulturbanause Team
Beiträge bei denen das kulturbanause-Team als Autor angegeben ist, wurden von mehreren Personen in Zusammenarbeit geschrieben. Wir nutzen diesen Blog als öffentliches Archiv und um euch bei alltäglichen Problemen im Zusammenhang mit der Erstellung von Websites zu helfen. Neben diesem Blog bieten wir auch Trainings wie Schulungen, Bücher oder Videos an. Und natürlich unterstützen wir auch gerne im Rahmen unserer Agenturtätigkeit.