Optimierung von Web-Entwicklung durch Design Tokens

Development Zukunftssichere und pflegeleichte Website-Entwicklung dank Design Tokens

24.03.2025 Ein Gastbeitrag von Jens Krahe* 3 min Lesedauer

Bei der Website-Entwicklung kosten Missverständnisse zwischen Design und Entwicklung viel Budget. Design Tokens schaffen hier Abhilfe – dank einem neuen Level an Automatisierung, Robustheit, Konsistenz, Skalierbarkeit und beim Einsatz von KI.

Design Tokens bilden die kleinste Einheit des Atomic Designs. Über eine JSON-Datei definieren sie alle relevanten Designparameter wie zum Beispiel Farben und Abstände.(Bild: Plan Net Köln) — Design Tokens bilden die kleinste Einheit des Atomic Designs. Über eine JSON-Datei definieren sie alle relevanten Designparameter wie zum Beispiel Farben und Abstände.
(Bild: Plan Net Köln)

Design Tokens entwickeln Brad Frosts Atomic-Design-Ansatz weiter, der sich Atome, die kleinsten Grundbausteine des Periodensystems, zum Vorbild nimmt: Atome fügen sich zu Molekülen und immer komplexer werdenden Systemen zusammen. Analog dazu entsteht nach dem Atomic-Design-Ansatz aus kleinsten Designelementen sukzessive ein größeres System.

Design Tokens setzen sogar noch einen Schritt vor dem Atom an. Jedes atomare Designelement setzt sich aus mehreren Design Tokens zusammen. Einmal definiert, bleiben diese immer gleich, einmal geändert, ändert sich das Atom und damit das gesamte System. Beispiele für Design Tokens sind Werte für Farben, Schriftarten oder Abstände. Ein Atom ist beispielsweise ein Button.

Melden Sie sich an oder registrieren Sie sich und lesen Sie weiter

Um diesen Artikel vollständig lesen zu können, müssen Sie registriert sein. Die kostenlose Registrierung bietet Ihnen Zugang zu exklusiven Fachinformationen.

Kostenlosen Account erstellen

Sie haben bereits ein Konto? Hier einloggen

Jetzt Newsletter abonnieren

Verpassen Sie nicht unsere besten Inhalte

Geschäftliche E-Mail

Bitte geben Sie eine gültige E-Mailadresse ein.

Mit Klick auf „Newsletter abonnieren“ erkläre ich mich mit der Verarbeitung und Nutzung meiner Daten gemäß Einwilligungserklärung (bitte aufklappen für Details) einverstanden und akzeptiere die Nutzungsbedingungen. Weitere Informationen finde ich in unserer Datenschutzerklärung. Die Einwilligungserklärung bezieht sich u. a. auf die Zusendung von redaktionellen Newslettern per E-Mail und auf den Datenabgleich zu Marketingzwecken mit ausgewählten Werbepartnern (z. B. LinkedIn, Google, Meta).

Stand: 08.12.2025

Es ist für uns eine Selbstverständlichkeit, dass wir verantwortungsvoll mit Ihren personenbezogenen Daten umgehen. Sofern wir personenbezogene Daten von Ihnen erheben, verarbeiten wir diese unter Beachtung der geltenden Datenschutzvorschriften. Detaillierte Informationen finden Sie in unserer Datenschutzerklärung.

Einwilligung in die Verwendung von Daten zu Werbezwecken

Ich bin damit einverstanden, dass die Vogel Communications Group GmbH & Co. KG, Max-Planckstr. 7-9, 97082 Würzburg einschließlich aller mit ihr im Sinne der §§ 15 ff. AktG verbundenen Unternehmen (im weiteren: Vogel Communications Group) meine E-Mail-Adresse für die Zusendung von redaktionellen Newslettern nutzt. Auflistungen der jeweils zugehörigen Unternehmen können hier abgerufen werden.

Der Newsletterinhalt erstreckt sich dabei auf Produkte und Dienstleistungen aller zuvor genannten Unternehmen, darunter beispielsweise Fachzeitschriften und Fachbücher, Veranstaltungen und Messen sowie veranstaltungsbezogene Produkte und Dienstleistungen, Print- und Digital-Mediaangebote und Services wie weitere (redaktionelle) Newsletter, Gewinnspiele, Lead-Kampagnen, Marktforschung im Online- und Offline-Bereich, fachspezifische Webportale und E-Learning-Angebote. Wenn auch meine persönliche Telefonnummer erhoben wurde, darf diese für die Unterbreitung von Angeboten der vorgenannten Produkte und Dienstleistungen der vorgenannten Unternehmen und Marktforschung genutzt werden.

Meine Einwilligung umfasst zudem die Verarbeitung meiner E-Mail-Adresse und Telefonnummer für den Datenabgleich zu Marketingzwecken mit ausgewählten Werbepartnern wie z.B. LinkedIN, Google und Meta. Hierfür darf die Vogel Communications Group die genannten Daten gehasht an Werbepartner übermitteln, die diese Daten dann nutzen, um feststellen zu können, ob ich ebenfalls Mitglied auf den besagten Werbepartnerportalen bin. Die Vogel Communications Group nutzt diese Funktion zu Zwecken des Retargeting (Upselling, Crossselling und Kundenbindung), der Generierung von sog. Lookalike Audiences zur Neukundengewinnung und als Ausschlussgrundlage für laufende Werbekampagnen. Weitere Informationen kann ich dem Abschnitt „Datenabgleich zu Marketingzwecken“ in der Datenschutzerklärung entnehmen.

Falls ich im Internet auf Portalen der Vogel Communications Group einschließlich deren mit ihr im Sinne der §§ 15 ff. AktG verbundenen Unternehmen geschützte Inhalte abrufe, muss ich mich mit weiteren Daten für den Zugang zu diesen Inhalten registrieren. Im Gegenzug für diesen gebührenlosen Zugang zu redaktionellen Inhalten dürfen meine Daten im Sinne dieser Einwilligung für die hier genannten Zwecke verwendet werden. Dies gilt nicht für den Datenabgleich zu Marketingzwecken.

Recht auf Widerruf

Mir ist bewusst, dass ich diese Einwilligung jederzeit für die Zukunft widerrufen kann. Durch meinen Widerruf wird die Rechtmäßigkeit der aufgrund meiner Einwilligung bis zum Widerruf erfolgten Verarbeitung nicht berührt. Um meinen Widerruf zu erklären, kann ich als eine Möglichkeit das unter https://contact.vogel.de abrufbare Kontaktformular nutzen. Sofern ich einzelne von mir abonnierte Newsletter nicht mehr erhalten möchte, kann ich darüber hinaus auch den am Ende eines Newsletters eingebundenen Abmeldelink anklicken. Weitere Informationen zu meinem Widerrufsrecht und dessen Ausübung sowie zu den Folgen meines Widerrufs finde ich in der Datenschutzerklärung, Abschnitt Redaktionelle Newsletter.