Farbrichtlinien für Office-Add-Ins

Farbe wird häufig zum Hervorheben der Marke und zum Verstärken der visuellen Hierarchie verwendet. Sie hilft dabei, eine Oberfläche zu identifizieren und Kunden durch deren Funktionen zu leiten. Innerhalb von Office wird Farbe für die gleichen Ziele verwendet, aber sie wird gezielt und minimal angewendet. Zu keinem Zeitpunkt werden Kundeninhalte dadurch „erdrückt“. Auch wenn jede Office-App mit einer eigenen dominanten Farbe versehen ist, wird sie sparsam verwendet.

Fluent UI React und Fabric Core enthalten eine Reihe von Standarddesignfarben. Wenn diese Bibliotheken auf die Komponenten oder Layouts eines Office-Add-Ins angewendet werden, gelten die gleichen Ziele. Farbe sollte Hierarchie vermitteln und den Kunden gezielt zu einer Aktion leiten, ohne dass der Inhalt beeinträchtigt wird. Designfarben aus Fluent UI React oder Fabric Core können eine neue Akzentfarbe in die Gesamtoberfläche einführen. Diese Akzentfarben können mit dem Branding von Office-Apps und der Hierarchie in Konflikt treten. Überlegen Sie, wie Sie Konflikte und Störungen vermeiden können. Verwenden Sie neutrale Akzente, oder überschreiben Sie Designfarben, um das Branding von Office-Apps oder Ihren eigenen Markenfarben anzupassen.

In Office-Anwendungen personalisieren Kunden ihre Schnittstellen, indem sie ein Office-UI-Design anwenden. Kunden wählen zwischen vier UI-Designs, um die Formatierung von Hintergründen und Schaltflächen in Excel, Outlook, PowerPoint, Word und anderen Apps in der Office-Suite zu variieren. Damit Sich Ihre Add-Ins wie ein natürlicher Bestandteil von Office anfühlen und auf die Personalisierung reagieren, verwenden Sie unsere Design-APIs. Beispielsweise ändern sich die Hintergrundfarben des Aufgabenbereichs in einigen Designs in Dunkelgrau. Folgen Sie mit den Design-APIs dem Beispiel, und passen Sie den Vordergrundtext an, um die Barrierefreiheit sicherzustellen.

Tipp

• Um sicherzustellen, dass Ihr Add-In die richtigen Farbkombinationen auf der Benutzeroberfläche anwendet, testen Sie es mit allen vier Office-Designs, einschließlich der Option Systemeinstellung verwenden .
• Eine Anleitung zum dynamischen Abgleichen des Designs Ihres PowerPoint-Add-Ins mit dem aktuellen Dokument oder Office-Design finden Sie unter Verwenden von Dokumentdesigns in Ihren PowerPoint-Add-Ins.

Wenden Sie die folgenden allgemeinen Richtlinien für Farben an.

• Verwenden Sie Farbe sparsam, um Hierarchie zu vermitteln und Marken zu stärken.
• Die Übermäßige Verwendung einer einzelnen Akzentfarbe, die sowohl auf interaktive als auch auf nicht interaktive Elemente angewendet wird, kann zu Verwirrung führen. Vermeiden Sie beispielsweise die Verwendung der gleichen Farbe für ausgewählte und nicht ausgewählte Elemente in einem Navigationsmenü.
• Vermeiden Sie unnötige Konflikte mit Office-App-Markenfarben.
• Verwenden Sie Ihre eigenen Markenfarben, um den Bezug zu Ihrer Dienstleistung oder Ihrem Unternehmen herzustellen.
• Stellen Sie sicher, dass auf den gesamten Text zugegriffen werden kann. Stellen Sie sicher, dass ein Kontrastverhältnis von 4,5:1 zwischen Vordergrundtext und Hintergrund besteht.
• Berücksichtigen Sie auch Farbenblindheit. Verwenden Sie weitere Elemente außer Farben, um auf Interaktivität und Hierarchie hinzuweisen.
• Weitere Informationen zum Entwerfen von Add-In-Befehlssymbolen mit der Office-Symbolfarbpalette finden Sie unter Richtlinien für Symbole.