---
title: "Objekte"
description: "Text, Formen, Symbole, Bilder, Tabellen, Diagramme, Schaltflächen und Eingabefelder - so setzt du sie auf die Folie, gestaltest und ordnest sie an."
canonical_url: "https://docs.ols.yonn.online/de/build/objects"
---
# Objekte

> Text, Formen, Symbole, Bilder, Tabellen, Diagramme, Schaltflächen und Eingabefelder - so setzt du sie auf die Folie, gestaltest und ordnest sie an.

Alles auf einer Folie ist ein **Objekt**: ein Textfeld, eine Form, ein Bild, eine Schaltfläche, eine Tabelle. Objekte fügst du im Tab **Einfügen** ein, wählst sie auf der Folie aus und änderst sie rechts im Tab **Format**. Diese Seite behandelt:

- **Einfügen** und welche Objekte es gibt.
- **Den Tab Format**: Position, Größe, Farben und Text.
- **Objektarten** und ihre eigenen Optionen.
- **Anordnen**: auswählen, ausrichten, gruppieren und sperren.
- **Barrierefreiheit**: damit Screenreader deine Folien beschreiben können.

![Der Tab Einfügen mit den Gruppen Text, Grafik, Medien, Interaktion und Bewertung](https://docs.ols.yonn.online/screenshots/de/objects-insert-tab.png)

## Ein Objekt in 3 Schritten einfügen

<procedure>

### Tab Einfügen öffnen

Klick im Menüband auf **Einfügen**. Die Werkzeuge sind in Gruppen sortiert: **Text**, **Grafik**, **Medien**, **Interaktion** und **Bewertung**.

### Objekt wählen

Klick zum Beispiel auf **Textfeld** oder **Schaltfläche**. Knöpfe mit kleinem Pfeil, wie **Formen** oder **Eingabe**, öffnen erst eine Auswahl. Das Objekt erscheint auf der Folie.

### Platzieren und gestalten

Zieh das Objekt an seinen Platz und zieh an den Griffen, um die Größe zu ändern. Rechts im Tab **Format** stehen alle Einstellungen.

</procedure>

## Der Tab Einfügen

<table>
<thead>
  <tr>
    <th>
      Gruppe
    </th>
    
    <th>
      Objekte
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      <strong>
        Text
      </strong>
    </td>
    
    <td>
      <strong>
        Textfeld
      </strong>
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Grafik
      </strong>
    </td>
    
    <td>
      <strong>
        Formen
      </strong>
      
      , <strong>
        Linien
      </strong>
      
       (siehe <a href="https://docs.ols.yonn.online/de/build/lines-and-polygons">
        Linien und Polygone
      </a>
      
      ), <strong>
        Symbol
      </strong>
      
      , <strong>
        Diagramm
      </strong>
      
      , <strong>
        Fortschritt
      </strong>
      
      , <strong>
        Tabelle
      </strong>
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Medien
      </strong>
    </td>
    
    <td>
      <strong>
        Bild
      </strong>
      
      , <strong>
        Video
      </strong>
      
      , <strong>
        Audio
      </strong>
      
      , <strong>
        Mediathek
      </strong>
      
      , <strong>
        Webobjekt
      </strong>
      
      , <strong>
        Untertitel
      </strong>
      
       (siehe <a href="https://docs.ols.yonn.online/de/build/media">
        Medien
      </a>
      
      )
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Interaktion
      </strong>
    </td>
    
    <td>
      <strong>
        Schaltfläche
      </strong>
      
      , <strong>
        Hotspot
      </strong>
      
      , <strong>
        Eingabe
      </strong>
      
      , <strong>
        Marker
      </strong>
      
      , <strong>
        Scroll-Bereich
      </strong>
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Bewertung
      </strong>
    </td>
    
    <td>
      <strong>
        Frage
      </strong>
      
      , <strong>
        Ergebnisfolie
      </strong>
      
      , <strong>
        Fragenpools
      </strong>
      
       (siehe <a href="https://docs.ols.yonn.online/de/interact/questions-and-results">
        Fragen und Ergebnisse
      </a>
      
      )
    </td>
  </tr>
</tbody>
</table>

## Der Tab Format

Wähl ein Objekt aus, und der Tab **Format** zeigt seine Einstellungen in Abschnitten. Die ersten Abschnitte sind bei fast jedem Objekt gleich.

![Der Tab Format einer Schaltfläche mit den Abschnitten Objekt, Darstellung und Text](https://docs.ols.yonn.online/screenshots/de/objects-format-panel.png)

<table>
<thead>
  <tr>
    <th>
      Abschnitt
    </th>
    
    <th>
      Was du dort einstellst
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      <strong>
        Objekt
      </strong>
    </td>
    
    <td>
      <strong>
        Name
      </strong>
      
       (steht in der Zeitleiste und in Triggern), Position <strong>
        X
      </strong>
      
       und <strong>
        Y
      </strong>
      
      , Breite <strong>
        B
      </strong>
      
       und Höhe <strong>
        H
      </strong>
      
       in Pixeln. Das Ketten-Symbol sperrt das Seitenverhältnis. <strong>
        Drehen und Spiegeln
      </strong>
      
       dreht oder spiegelt das Objekt. Das Schloss sperrt es an seinem Platz.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Darstellung
      </strong>
    </td>
    
    <td>
      <strong>
        Deckkraft
      </strong>
      
      , <strong>
        Füllung
      </strong>
      
       (keine, Farbe, Verlauf oder Bild), <strong>
        Kontur
      </strong>
      
       (<strong>
        Keine
      </strong>
      
      , <strong>
        Dünn
      </strong>
      
      , <strong>
        Mittel
      </strong>
      
      , <strong>
        Dick
      </strong>
      
      ), <strong>
        Eckenradius
      </strong>
      
       und <strong>
        Schatten
      </strong>
      
       (<strong>
        Keiner
      </strong>
      
      , <strong>
        Weich
      </strong>
      
      , <strong>
        Hart
      </strong>
      
      ).
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Text
      </strong>
    </td>
    
    <td>
      Schrift, Schriftstärke, Größe, Farbe, kursiv, unterstrichen, Ausrichtung (links bis Blocksatz und oben bis unten) und <strong>
        Innenabstand
      </strong>
      
      , der Abstand zwischen Rand und Text.
    </td>
  </tr>
  
  <tr>
    <td>
      Typ-Abschnitt
    </td>
    
    <td>
      Optionen, die nur diese Objektart hat, zum Beispiel das Symbol einer Schaltfläche oder die Zeilen einer Tabelle.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Barrierefreiheit
      </strong>
    </td>
    
    <td>
      Alternativtext und mehr, siehe unten.
    </td>
  </tr>
</tbody>
</table>

<hint-box kind="tip" title="Auf Design zurücksetzen">

Farben von Hand geändert und du willst das Kursdesign zurück? Klick auf das Pinsel-Symbol neben **Darstellung** oder klick das Objekt mit rechts an und wähl **Auf Design zurücksetzen**. Farben, Schrift, Kontur, Schatten und Rundung folgen wieder dem Design. Größe, Text und Position bleiben.

</hint-box>

## Text

Doppelklick auf ein Textfeld, um zu tippen. Darüber erscheint eine kleine Leiste.

<table>
<thead>
  <tr>
    <th>
      Element
    </th>
    
    <th>
      Was es macht
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      <strong>
        Absatzformat
      </strong>
    </td>
    
    <td>
      <strong>
        Absatz
      </strong>
      
      , <strong>
        Überschrift 1
      </strong>
      
       bis <strong>
        Überschrift 3
      </strong>
      
       oder <strong>
        Zitat
      </strong>
      
      .
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Fett
      </strong>
      
      , <strong>
        Kursiv
      </strong>
      
      , <strong>
        Unterstrichen
      </strong>
    </td>
    
    <td>
      Formatiert die markierten Wörter.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Aufzählung
      </strong>
      
      , <strong>
        Nummerierung
      </strong>
    </td>
    
    <td>
      Macht aus Absätzen eine Liste.
    </td>
  </tr>
  
  <tr>
    <td>
      Ausrichtung, <strong>
        Schriftgröße
      </strong>
      
      , <strong>
        Textfarbe
      </strong>
    </td>
    
    <td>
      Ändern das Aussehen des Texts.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Link einfügen
      </strong>
    </td>
    
    <td>
      Verlinkt auf eine <strong>
        Webseite
      </strong>
      
       (http- oder https-Adresse oder E-Mail-Adresse) oder auf eine andere <strong>
        Folie
      </strong>
      
       des Kurses.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Variable einfügen
      </strong>
    </td>
    
    <td>
      Fügt einen Platzhalter wie <code>
        %Punkte%
      </code>
      
       ein. Im Kurs steht dort der aktuelle Wert.
    </td>
  </tr>
</tbody>
</table>

**Format übertragen** (Pinsel im Tab **Start**) kopiert das Aussehen des ausgewählten Objekts auf das nächste Objekt, das du anklickst. <key-combo keys="Esc">



</key-combo>

 bricht ab. Mit der Tastatur: <key-combo keys="Strg+Umschalt+C">



</key-combo>

 kopiert das Format, <key-combo keys="Strg+Umschalt+V">



</key-combo>

 fügt es ein.

## Objektarten

<table>
<thead>
  <tr>
    <th>
      Objekt
    </th>
    
    <th>
      Was es ist und was du einstellst
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      <strong>
        Formen
      </strong>
    </td>
    
    <td>
      Rechteck, abgerundetes Rechteck, Ellipse, Dreieck, Raute, Fünfeck, Sechseck, Stern, Pfeile in vier Richtungen, Linie, Sprechblase, Herz und Wolke. Formen können Text enthalten und eignen sich daher auch als Beschriftung oder einfache Schaltfläche.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Symbol
      </strong>
    </td>
    
    <td>
      Ein Symbol aus der eingebauten Lucide-Bibliothek. Die Suche geht mit englischen Wörtern, zum Beispiel „arrow“.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Diagramm
      </strong>
    </td>
    
    <td>
      <strong>
        Balken
      </strong>
      
      , <strong>
        Linie
      </strong>
      
      , <strong>
        Kreis
      </strong>
      
       oder <strong>
        Ring
      </strong>
      
      . Du gibst Kategorien und Datenreihen mit Namen und Farben ein. Kreis- und Ringdiagramme zeigen nur die erste Datenreihe.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Fortschritt
      </strong>
    </td>
    
    <td>
      Ein <strong>
        Balken
      </strong>
      
       oder <strong>
        Ring
      </strong>
      
      , der eine Zahl anzeigt, standardmäßig den Kursfortschritt (<code>
        Project.ProgressPercent
      </code>
      
      ).
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Tabelle
      </strong>
    </td>
    
    <td>
      <strong>
        Zeilen
      </strong>
      
      , <strong>
        Spalten
      </strong>
      
      , Spaltenbreiten (<strong>
        Gleichmäßig verteilen
      </strong>
      
      ), eine <strong>
        Kopfzeile
      </strong>
      
      , ihre Farbe und die <strong>
        Linien
      </strong>
      
      . Doppelklick in eine Zelle zum Tippen, <key-combo keys="Tab">
        
      </key-combo>
      
       springt zur nächsten Zelle.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Schaltfläche
      </strong>
    </td>
    
    <td>
      Text mit optionalem Symbol (<strong>
        Links
      </strong>
      
      , <strong>
        Rechts
      </strong>
      
       oder <strong>
        Nur Symbol
      </strong>
      
      ). Gib ihr einen Trigger, damit sie etwas tut.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Hotspot
      </strong>
    </td>
    
    <td>
      Ein unsichtbarer Klickbereich: <strong>
        Rechteck
      </strong>
      
      , <strong>
        Ellipse
      </strong>
      
       oder <strong>
        Freiform
      </strong>
      
       mit eigenen Punkten. Gut für „Klick auf die richtige Stelle im Bild“.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Marker
      </strong>
    </td>
    
    <td>
      Ein kleines Symbol, das beim Anklicken ein Pop-up mit Titel und Text öffnet.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Eingabe
      </strong>
    </td>
    
    <td>
      <strong>
        Texteingabefeld
      </strong>
      
       (speichert, was Lernende tippen, in einer Variablen), <strong>
        Kontrollkästchen
      </strong>
      
      , <strong>
        Optionsfeld
      </strong>
      
      , <strong>
        Schieberegler
      </strong>
      
       und <strong>
        Drehregler
      </strong>
      
       (beide speichern eine Zahl).
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Webobjekt
      </strong>
    </td>
    
    <td>
      Zeigt eine Webseite über ihre https-Adresse, standardmäßig in einer geschützten <strong>
        Sandbox
      </strong>
      
      .
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Scroll-Bereich
      </strong>
    </td>
    
    <td>
      Ein Bereich, in dem Lernende scrollen können, mit anderen Objekten darin.
    </td>
  </tr>
</tbody>
</table>

<hint-box kind="note" title="Was ist eine Variable?">

Eine Variable ist ein benannter Speicherplatz, der während des Kurses einen Wert hält, zum Beispiel einen Namen, Punkte oder „Kapitel erledigt“. Siehe [Trigger und Variablen](https://docs.ols.yonn.online/de/interact/triggers-and-variables).

</hint-box>

## Auswählen, anordnen und ausrichten

<table>
<thead>
  <tr>
    <th>
      Was du willst
    </th>
    
    <th>
      So geht's
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      Mehrere Objekte auswählen
    </td>
    
    <td>
      <key-combo keys="Umschalt">
        
      </key-combo>
      
       oder <key-combo keys="Strg">
        
      </key-combo>
      
       gedrückt halten und klicken, oder auf einer leeren Stelle einen Rahmen aufziehen.
    </td>
  </tr>
  
  <tr>
    <td>
      Genau verschieben
    </td>
    
    <td>
      Pfeiltasten verschieben um 1 px, <key-combo keys="Umschalt+Pfeiltaste">
        
      </key-combo>
      
       um 10 px.
    </td>
  </tr>
  
  <tr>
    <td>
      Nach vorne oder hinten
    </td>
    
    <td>
      <strong>
        Reihenfolge
      </strong>
      
       im Tab <strong>
        Start
      </strong>
      
      : <strong>
        In den Vordergrund
      </strong>
      
      , <strong>
        Eine Stufe nach vorne
      </strong>
      
      , <strong>
        Eine Stufe nach hinten
      </strong>
      
      , <strong>
        In den Hintergrund
      </strong>
      
      .
    </td>
  </tr>
  
  <tr>
    <td>
      Mehrere Objekte ausrichten
    </td>
    
    <td>
      <strong>
        Ausrichten
      </strong>
      
       im Tab <strong>
        Start
      </strong>
      
       oder die sechs kleinen Ausrichten-Knöpfe daneben. <strong>
        Verteilen
      </strong>
      
       setzt gleiche Abstände.
    </td>
  </tr>
  
  <tr>
    <td>
      Gruppieren
    </td>
    
    <td>
      Mehrere auswählen und <key-combo keys="Strg+G">
        
      </key-combo>
      
       drücken. Aufheben mit <key-combo keys="Strg+Umschalt+G">
        
      </key-combo>
      
      . Eine Gruppe bewegt und animiert sich als Ganzes.
    </td>
  </tr>
  
  <tr>
    <td>
      Sperren
    </td>
    
    <td>
      Rechtsklick und <strong>
        Sperren
      </strong>
      
      . Das Objekt lässt sich nicht mehr aus Versehen verschieben.
    </td>
  </tr>
  
  <tr>
    <td>
      Erst später zeigen
    </td>
    
    <td>
      Rechtsklick und <strong>
        Anfangs ausblenden
      </strong>
      
      . Ein Trigger kann es später einblenden.
    </td>
  </tr>
</tbody>
</table>

Im Rechtsklick-Menü eines Objekts findest du außerdem **Ausschneiden**, **Kopieren**, **Einfügen**, **Duplizieren**, **Löschen**, **Auf Ebene verschieben**, **Auf Design zurücksetzen** und **Trigger hinzufügen**.

## Schaltflächengruppe

Objekte mit gleichem Gruppennamen verhalten sich wie Optionsfelder: Ein Klick wählt das Objekt aus und hebt die Auswahl der anderen auf. Das stellst du im Abschnitt **Schaltflächengruppe** im Tab Format ein. Gestalte den Zustand **Ausgewählt** im Tab **Zustände**, damit Lernende ihre Wahl sehen.

## Barrierefreiheit

Jedes Objekt hat einen Abschnitt **Barrierefreiheit**. Er hilft Lernenden, die einen Screenreader nutzen (ein Programm, das den Bildschirm vorliest).

<table>
<thead>
  <tr>
    <th>
      Einstellung
    </th>
    
    <th>
      Was sie macht
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      <strong>
        Alternativtext
      </strong>
    </td>
    
    <td>
      Eine kurze Beschreibung, die der Screenreader vorliest, zum Beispiel „Diagramm: Umsatz steigt 2024 um 12 %“.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Dekorativ
      </strong>
    </td>
    
    <td>
      Der Screenreader überspringt das Objekt. Für reine Dekoration.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Anfangs ausgeblendet
      </strong>
    </td>
    
    <td>
      Das Objekt ist am Anfang unsichtbar und erscheint erst durch einen Trigger.
    </td>
  </tr>
  
  <tr>
    <td>
      <strong>
        Eigene Tab-Reihenfolge
      </strong>
    </td>
    
    <td>
      Legt fest, wann die <key-combo keys="Tab">
        
      </key-combo>
      
      -Taste dieses Objekt erreicht. Kleinere Zahlen kommen zuerst.
    </td>
  </tr>
</tbody>
</table>

Bilder, Symbole und Diagramme brauchen einen Alternativtext oder **Dekorativ**. Die Prüfung vor dem Veröffentlichen erinnert dich daran.

## Wenn etwas nicht klappt

<table>
<thead>
  <tr>
    <th>
      Problem
    </th>
    
    <th>
      Was du tun kannst
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      Ich kann ein Objekt nicht auswählen oder verschieben
    </td>
    
    <td>
      Es ist gesperrt. Klick es mit rechts an und wähl <strong>
        Entsperren
      </strong>
      
       oder klick auf das Schloss in seiner Zeitleisten-Zeile.
    </td>
  </tr>
  
  <tr>
    <td>
      Ein Objekt liegt hinter einem anderen
    </td>
    
    <td>
      Wähl es in der Zeitleiste aus und nutz <strong>
        Reihenfolge
      </strong>
      
      , <strong>
        In den Vordergrund
      </strong>
      
      .
    </td>
  </tr>
  
  <tr>
    <td>
      Farben folgen nicht dem Kursdesign
    </td>
    
    <td>
      Sie wurden von Hand gesetzt. Nutz <strong>
        Auf Design zurücksetzen
      </strong>
      
      .
    </td>
  </tr>
  
  <tr>
    <td>
      Das Webobjekt bleibt leer
    </td>
    
    <td>
      Nur https-Adressen laden zuverlässig. Manche Webseiten lassen sich außerdem nicht in andere Seiten einbetten.
    </td>
  </tr>
  
  <tr>
    <td>
      Im Tab Format stehen nur wenige Optionen
    </td>
    
    <td>
      Es sind verschiedene Objektarten ausgewählt. Typ-Optionen erscheinen nur, wenn alle ausgewählten Objekte von derselben Art sind.
    </td>
  </tr>
</tbody>
</table>


## Sitemap

See the full [sitemap](https://docs.ols.yonn.online/sitemap.md) for all pages.
