Im Browser lesen

Neues von kulturbanause


Guten Morgen aus Berlin!

Nach dem Büro-Umzug im Dezember sind wir seit rund sechs Wochen vollständig im neuen Büro versammelt. Wie erhofft erleichtert das unsere Arbeit in vielerlei Hinsicht, was wir auch gut gebrauchen können. Aktuell und bis in den September hinein haben wir eine sehr hohe Auslastung. Das ist natürlich ein großes Kompliment für unsere Arbeit, aber auf Dauer auch ziemlich anstrengend.

Deshalb werden wir uns bald nach Verstärkung umsehen. Typischerweise hatten wir noch nicht genügend Zeit zum Ausarbeiten der konkreten Anforderungsprofile, die wir demnächst online stellen. Falls jetzt schon jemand denkt, dass er zu uns passt und das Team weiterbringt, freuen wir uns auf eine entsprechende Mail!

Zur Arbeit an der kulturbanause-Website kam es so nur mit häufigen Unterbrechungen. Nach Monaten haben wir endlich ein umfangreiches Update eingespielt. Damit können wir alle Übersichtsseiten, Filter, verschränkte Inhalte usw. über ein globales Modul pflegen. Über die Hälfte aller bisherigen Seiten-Templates ist überflüssig und der Code deutlich schlanker geworden. Gleichzeitig haben wir neue redaktionelle Möglichkeiten, die uns bei der Arbeit im Blog und in der Kunden-Akquise unter die Arme greifen.

Neben all dem sind immerhin einige Blog-Beiträge zusammengekommen. Viel Spaß bei der Lektüre!
 
 
 

Neue Blog-Beiträge

 
 

theme.json – Globale Styles und Einstellungen für WordPress

Seit WordPress 5.8 steht uns ein neuer Mechanismus zur Konfiguration des Blockeditors (Gutenberg) zur Verfügung: die Datei theme.json. Sie gibt uns eine sehr einfache Möglichkeit globale Stile, Stile einzelner Blöcke und auch Funktionen im Blockeditor zu individualisieren oder deaktivieren.

 
 

CSS Logical Properties – Layouts anhand der Leserichtung gestalten

Die Sprache CSS, mit der das Internet gestaltet wird, wurde in Ihren Anfängen einseitig aus westlicher Perspektive entwickelt. Somit haben sich u. a. Befehle für räumliche Anordnungen durchgesetzt (z. B. float:left, margin-right usw.), die in westlicher Leserichtung sinnvoll und schlüssig erscheinen. Doch die Leserichtung von links oben nach rechts unten gilt nicht für alle Menschen.

 
 

CSS contain – Die Geschwindigkeit der Website verbessern

Mit Hilfe von der CSS-Eigenschaft contain können Elemente und deren Inhalte, so weit wie möglich, unabhängig vom restlichen Dokumenten-Baum gerendert werden. Layout, Farben, Stile und Größen, beziehungsweise eine Kombination aus diesen Eigenschaften können vom Browser für einen begrenzten Bereich neu berechnet werden, ohne dass das ganze Dokument neu gerendert werden muss. Hierdurch kann ein deutlicher Performance-Boost der Website erreicht werden.

 
 

CSS color-mix() Funktion

Mit der nativen CSS color-mix() Funktion können zwei Farbwerte miteinander gemischt werden und zusätzlich der Farbraum für die Rückgabe des errechneten Farbwertes bestimmt werden.

 
 

CSS-Pseudoklasse :has() – CSS Parent-Selector

Mit dem CSS-Selektor :has() können Elemente in CSS abhängig von der Anwesenheit untergeordneter oder direkt nachfolgender Elementen angesprochen werden. Die Pseudoklasse kann als »Parent Selector« verwendet werden, ermöglicht aber auch deutlich komplexere Abhängigkeiten. Dadurch ist es möglich, Styling in sehr bestimmten Konstellationen auf Elemente anzuwenden.

 
 

Wie wir User Stories in Web Design-Projekten einsetzen

An der Konzeption eines Website-Projekts sind i. d. R. verschiedene Parteien beteiligt. Auf Agentur-Seite sitzen UX/UI- und Development-Teams. Auf Kundenseite häufig Marketing-Abteilungen, Redaktion & Co. Alle haben eine unterschiedliche Perspektive darauf, was an einer Website wichtig und zielführend ist.

Leider entspricht keiner der soeben aufgezählten Personen der späteren Zielgruppe. Mit sog. User Stories können wir im Rahmen von Konzeptions-Workshops herausarbeiten, welche Ziele einer Website für die wichtigsten Zielgruppen des Produkts entscheidend sind und wie diese Ziele erreicht werden können. Diese Herangehensweise hat zahlreiche Vorteile.

 
 

CSS @media prefers-contrast – stärkere Kontraste aktivieren

Viele Layouts sind kontrastarm gestaltet und bauen somit gestalterisch Barrieren auf. Menschen die z. B. aufgrund von Kurzsichtigkeit nicht gut sehen können, bevorzugen kontrastreichere Layouts. Auch Personen die situativ eingeschränkt sind – zum Beispiel, da sie aufgrund von Sonneneinstrahlung zeitweise schlecht sehen können – freuen sich über stärkere Kontraste.

 
 

CSS color-contrast() Funktion

Mit der nativen CSS-Funktion color-contrast() kann eine Liste von Farbwerten und ein Vergleichswert angegeben werden. Die Funktion gibt den Farbwert mit dem höchsten Kontrast zum Vergleichswert zurück. Dieser wird dann vom Browser verwendet.

 
 

Lottie-Animationen in Websites integrieren

Mit Hilfe von Lottie-Animationen lassen sich frei skalierbare und interaktive Animationen in Websites integrieren. Da Lottie-Dateien keine pixelbasierten Animationen sind, sondern auf SVG und JSON basieren, können sie sich positiv auf die Performance der Website auswirken.

 

 

Link-Tipps

Wir sitzen im Team in der Regel einmal monatlich zusammen und tauschen uns über Neuigkeiten oder zumindest neu entdeckte Informationen der Branche aus. Seit Ende letzten Jahres fassen wir die wichtigsten Funde in einem Blog-Beitrag zusammen und stellen sie in einem weiteren Newsletter-Format zur Verfügung:



Vielen Dank fürs Lesen, genießt den Frühling und bleibt (immer noch!) vor allem gesund. Bis zum nächsten Mal, 

euer Team von kulturbanause
 
kulturbanause®
Reichenberger Str. 29
Berlin 10999
Germany

Zum Adressbuch hinzufügen


Newsletter kündigen

Email Marketing Powered by Mailchimp