---
schema_version: "1"
id: fce4e5e39d2b6786372d8cb6d1b3167d31ee3614e58fa8b0788e981aa6abe72d
title: Standardkomponenten
collection: architect
version: next
locale: de-de
portal_url: https://docs.salesforce.com/architect/next/de-de/reference-diagrams/guides/kit-of-parts.md
canonical_url: https://staging.architect.salesforce.com/docs/architect/de-de/reference-diagrams/guide/kit-of-parts.html
source_site: staging.architect.salesforce.com
content_type: documentation
content_hash: de9678111772b9c5cd1e72312f0735cd6be5e9307e276447c5269c9198ff7bee
products:
  - Referenzdiagramme
  - Architect Site Content Repo
updated_at: 2024-09-01T00:00:00Z
---
## Standardkomponenten

Standardkomponenten erleichtern Ihnen das Erstellen, Anpassen und Wiederverwenden hochwertiger, konsistenter Diagramme. Dieser professionelle Stil wird für alle Salesforce-Diagrammvorlagen verwendet und ist in unseren Partnertools zum Diagrammieren von Anwendungsfällen verfügbar:

<div class="template-boxes">
<a class="template-button" href="https://lucid.co/marketplace/d97f792f/salesforce" target="new">
    <img src="https://a.sfdcstatic.com/developer-website/prod/images/architect/logos/lucidchart.png" alt="Lucidchart"></img>
    Lucidchart
</a>

<a class="template-button" href="https://elements.cloud/salesforce-architecture-diagram/" target="new">
    <img src="https://a.sfdcstatic.com/developer-website/prod/images/architect/logos/elements-cloud.png" alt="Elements.cloud"></img>
    Elemente
</a>
<a class="template-button" href="https://miro.com/marketplace/salesforce-for-miro/" target="new">
    <img src="https://a.sfdcstatic.com/developer-website/prod/images/architect/logos/miro.png" alt="Miro"></img>
    Miro
</a>
<a class="template-button" href="https://sfdc.co/diagrams-kop" target="new">
    <img src="https://a.sfdcstatic.com/developer-website/prod/images/architect/icons/slides.png" alt="Google Folien"></img>
    Google Folien
</a>
</div>
<br/>

Beispiele für die Verwendung von Komponenten in der [Referenzarchitekturgalerie](https://architect.salesforce.com/diagrams#reference-architecture-gallery)

## Bewährte Vorgehensweisen

In den folgenden Abschnitten werden ausführliche bewährte Vorgehensweisen für die in den Standardkomponenten enthaltenen [Kopfzeilen](#header), [Karten](#karten), [Symbole](#symbole) und [Konnektoren](#konnektoren) beschrieben.

## Header

<img class="center" src="https://architect.salesforce.com/ns-assets/legacy/howto-header.png" alt="Diagrammkopfzeile"></img>

Die Kopfzeile sollte in allen Diagrammen vorhanden sein und Folgendes enthalten:

- Ein Titel, der von Ihrer Zielgruppe schnell verstanden werden kann
- Eine klare Beschreibung dessen, was das Diagramm abdeckt, seinen Zweck und Intent
- (optional) Ihr Logo oder Firmenname, um den Autor zu vermitteln
- (optional) ein Schlüssel zur Verdeutlichung von Symbolen, Designs oder Symbolen, die als Klassifizierungen verwendet werden

Die Größe sollte mindestens 10 % der Diagrammhöhe und 100 % der Breite einnehmen.

Die Schriftgröße der Beschreibung sollte mindestens halb so groß sein wie der Titel.

Ein Schlüssel sollte enthalten sein, wenn Symbole, Konnektoren, Farben usw. verwendet werden, die nicht mit Titeln im Diagramm selbst angegeben sind. Der Schlüssel sollte nach Möglichkeit in gerade Zeilen gruppiert werden.

## Karten

Alle Eigenschaften Ihres Diagramms sollten mit einer Karte dargestellt werden. Karten können in ihrer Größe angepasst werden und transparente oder farbige Füllungen aufweisen. Es gibt mehrere Abschnitte der Karte, die Variationen bereitstellen, mit denen Sie verschiedene Konzepte in Ihrem Diagramm darstellen können.

### **Kartenanatomie**

Eine Beispielkarte befindet sich unten mit den verschiedenen beschriebenen Abschnitten. Der einzige erforderliche Karteninhalt ist der Titel. Die anderen Abschnitte können bei Bedarf für bestimmte Anwendungsfälle verwendet werden.

<img class="center" src="https://architect.salesforce.com/ns-assets/legacy/standardcomponents-cardanatomy.png" alt="Kartenanatomie"></img>

**Kartensymbol**  
Kartensymbole sind visuelle Datenbestände, die die Karteneigenschaft darstellen.

**Kartentitel**  
Der Kartentitel ist ein Name für eine Karte, der schnell verstanden werden kann und erfasst, welche Eigenschaft, welchen Bereich oder welches Konzept die Karte darstellt.

**Kartenattribute**  
Kartenattribute sind textbasierte Details zur Eigenschaft, die als Liste dargestellt und verwendet werden, wenn Sie mehrere Datenpunkte erfassen und übertragen müssen.

**Kartenfußzeile**  
In der Fußzeile der Karte sind weitere Eigenschaften der Eigenschaft angegeben. Beispiele: Paket-/ Objekt-/ API-Namen, Inhaberschaft, Funktionen usw.

**Kartenfußzeilensymbole**  
Im Abschnitt "Fußzeilensymbole" können visuelle Datenbestände zusätzliche Informationen zur Immobilie anzeigen. Beispiele: Kanäle, freigegebene Services, Funktionen usw. Fußzeilensymbole sollten in Ihrem Diagrammschlüssel enthalten/erläutert sein.

### **Kartenvariationen**

Die Verwendung verschiedener Abschnitte bietet unterschiedliche Kartenvariationen für unterschiedliche Verwendungen. Sie können die Kartenanatomie nach Bedarf kombinieren und abgleichen, um diese Variationen in Ihren Diagrammen zu erstellen. Siehe Beispiele unten:

<img class="center" src="https://architect.salesforce.com/ns-assets/legacy/standardcomponents-cardvariations1.png" alt="Ausgeblendete Karte"></img>

<img class="center" src="https://architect.salesforce.com/ns-assets/legacy/standardcomponents-cardvariations2.png" alt="Detailkarte"></img>

<img class="center" src="https://architect.salesforce.com/ns-assets/legacy/standardcomponents-cardvariations3.png" alt="Detailkarte mit Fußzeile"></img>

In der [Referenzarchitekturgalerie](https://architect.salesforce.com/diagrams#reference-architecture-gallery) finden Sie Ideen zur Verwendung dieser Variationen.

Nutzen Sie die Möglichkeit, die Größe und Farbe Ihrer Karten nach Bedarf anzupassen, um Typen zu unterscheiden und klare, verständliche Diagramme zu erstellen.

## **Container**

Karten können auch als Container fungieren, d. h. als Gruppierungen für mehrere Eigenschaften. Sie können Karten auf einer anderen Karte verschachteln, um hierarchische Beziehungen darzustellen oder zugehörige Eigenschaften nach Bedarf zu klassifizieren.

<img class="center" src="https://architect.salesforce.com/ns-assets/legacy/standardcomponents-containers.png" alt="Container"></img>

## **Symbole**

Salesforce-Diagramme bieten einen grundlegenden Satz an Salesforce-Produktlogos sowie zusätzliche Symbole, die Eigenschaften und andere Bereiche in Ihrem Diagramm darstellen.

<img class="center" src="https://architect.salesforce.com/ns-assets/legacy/standardcomponents-icons.png" alt="Symbole"></img>

Beispiele für die Verwendung von Symbolen finden Sie in der [Referenzarchitekturgalerie](https://architect.salesforce.com/diagrams#reference-architecture-gallery)

_Weitere Symbole finden Sie in den [Lightning Design System-Symbolen.](https://www.lightningdesignsystem.com/icons/)_

## Konnektoren

Konnektoren sollten immer Winkelverbindungsleitungen verwenden und nach Möglichkeit gerade sein, um die Lesbarkeit zu verbessern.

<img class="center" src="https://architect.salesforce.com/ns-assets/legacy/howto-connectors.png" alt="Konnektoren und Pillen"></img>

**Konnektoren** stellen eine Beziehung, Integration oder einen Prozessschritt zwischen zwei Karten dar. Linienstile weisen auf einen anderen Verbindungstyp hin und sollten in Ihrem Diagrammschlüssel dargestellt werden. Endpunkte geben die Richtung eines Integrations- oder Prozesskonnektors an. Endpunkte geben auch Kardinalität und Gewöhnlichkeit in einem Beziehungskonnektor an.

**Pillen** werden verwendet, um Details zu den Verbindungen bereitzustellen. Weitere Informationen zur Verwendung von Pillen finden Sie in den Diagrammen zur [Lösungsarchitektur](/docs/architect/de-de/reference-diagrams/guide/section-solution-architecture) und zum [Interaktionsprozess-Flow](/docs/architect/de-de/reference-diagrams/guide/section-interaction-process-flow).

## Barrierefreiheit

Weltweit leben etwa [1,3 Milliarden](https://www.salesforce.com/company/legal/508_accessibility/#:~:text=Product%20Accessibility%20Status&text=Around%20the%20world%2C%20approximately%201.3,global%20economy%20that%20includes%20everyone.) Menschen mit einer Behinderung, was 15 % der Weltbevölkerung entspricht. Beim barrierefreien Zugriff geht es darum, Ihr Diagramm für alle Betrachter verständlich zu machen. Es gibt zwei spezielle Fokusbereiche, die Ihnen dabei helfen können, besser auf Ihre Diagramme zuzugreifen: die Optimierung für Bildschirmleseprogramme und die entsprechende Verwendung des Farbkontrasts.

Weitere Ressourcen zur barrierefreien Gestaltung finden Sie im [Salesforce Design-Blog](https://medium.com/salesforce-ux/tagged/accessibility).

**Bildschirmleseprogramme**  
Ein Bildschirmleseprogramm ist eine Softwareanwendung, die die Wörter in einer Datei, Anwendung oder Website vorliest. Bildschirmleseprogramme können Diagramme für Einzelpersonen lesen, die sie nicht klar sehen können. Das beste Format für die Bildschirmleseprogramm-Kompatibilität ist PDF (Portable Document Format). Im Gegensatz zu Bildern und nicht barrierefreien Anwendungen können Bildschirmleseprogramme auf PDFs zugreifen, um Wörter, Formen und Farben zu lesen. Wenn Sie Ihre Diagramme beim Freigeben für andere ins PDF-Format exportieren, kann der barrierefreie Zugriff verbessert werden.

**Farbkontrast**  
Die Erhöhung des Farbkontrasts ist eine weitere Möglichkeit, damit Ihr Diagramm leichter zugänglich ist. Personen können Ihre Diagramme besser erkennen und lesen, wenn sie den minimalen Farbkontrast zwischen der Hintergrundfarbe hinter dem Text und der Farbe des Texts selbst erfüllen, der [Web Content Accessibility Guidelines (WCAG)](https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html) entspricht.

<img class="center" src="https://architect.salesforce.com/ns-assets/legacy/standardcomponents-accessibility.png" alt="Farbpalettenbeispiel zum Anzeigen des vorgeschlagenen Kontrasts"></img>

Jeder Farbe im [Salesforce-Farbsystem](https://medium.com/salesforce-ux/the-salesforce-color-system-c7c6b5b9c577) ist eine Zahl zwischen 0 und 100 zugeordnet. Achten Sie bei der Auswahl der Farben für Ihre Diagramme darauf, dass die Hintergrundfarbe hinter dem Text mindestens 50 Punkte größer oder kleiner als die Farbe des Texts ist. Wenn Ihre Hintergrundfarbe beispielsweise 80 ist, sollte Ihre Textfarbe nicht höher als 30 sein. Ziehen Sie in Erwägung, die 50-Punkte-Regel nach Bedarf auch für Rahmen und Umrisse zu verwenden.

**Haben Sie Eingaben oder Fragen zu Salesforce Diagrams?** Bitte teilen Sie uns [hier](https://docs.google.com/forms/d/e/1FAIpQLSe5RmVA2ZtpfGlR2u436FA4QN6QmJGdAWxtZ_AcRLMAH_US9Q/viewform?usp=sf_link) Ihre Gedanken mit.
