Medien und Ressourcen hinzufügen

In dieser Lektion lernen Sie, wie Sie Ihren Kurs verbessern können, indem Sie verschiedene Arten von Medien und Ressourcen hinzufügen. Dazu gehören Bilder, Videos und herunterladbare Dateien, die helfen können, Konzepte zu veranschaulichen und zusätzlichen Wert für Ihre Lernenden zu bieten.

Kurs-Medienordner

Der einfachste Weg, Medien zu Ihrem Kurs hinzuzufügen, ist die Verwendung eines _media/-Ordners im Stammverzeichnis Ihres Kurses. Dies hält alle Kursmedien an einem Ort organisiert.

Einrichtung des _media/-Ordners

1. Erstellen Sie einen _media/-Ordner in Ihrem Kursverzeichnis:

   content/de/courses/ihr-kurs-name/
   ├── _index.md
   ├── _media/
   │   └── index.md
   ├── 10-getting-started/
   └── ...
   

2. Erstellen Sie eine index.md-Datei in _media/ mit diesem Frontmatter:

   ---
   title: "Course Media"
   _build:
     render: never
     list: never
     publishResources: true
   ---
   

   Warum wird diese Datei benötigt? Hugo behandelt einen Ordner mit einer index.md als Leaf Bundle — eine Inhaltseinheit, die ihre eigenen Ressourcen (Bilder, PDFs usw.) besitzt. Die _build-Einstellungen weisen Hugo an, keine Seite für dieses Bundle zu erzeugen (render: never), es nicht neben Ihren Lektionen aufzulisten (list: never), aber die darin enthaltenen Dateien trotzdem zu veröffentlichen, damit sie per URL erreichbar sind (publishResources: true). Ohne diese Datei würde Hugo die Mediendateien komplett ignorieren.

3. Legen Sie Ihre Mediendateien im _media/-Ordner ab. Sie können Dateien direkt im Stammverzeichnis ablegen oder sie optional in Unterordner organisieren (z.B. nach Lektionsname):

   _media/
   ├── index.md
   ├── kurs-thumbnail.png              ← gemeinsame Dateien auf oberster Ebene
   ├── einfuehrung/                     ← optionaler Unterordner pro Lektion
   │   ├── image1.png
   │   └── image2.png
   ├── erste-schritte/
   │   ├── image1.png
   │   ├── image2.png
   │   └── spickzettel.pdf
   └── fortgeschrittene-themen/
       └── image1.png
   

   Unterordner sind vollständig optional — Sie können alle Dateien auch flach in _media/ ablegen. Unterordner sind hilfreich, wenn mehrere Lektionen Dateien mit dem gleichen Namen verwenden (z.B. image1.png).

Verwendung von Medien aus _media/

Nach der Einrichtung referenzieren Sie Medien mit Dateinamen oder relativen Pfaden:

Dateien im Stammverzeichnis von _media/:

![Thumbnail](kurs-thumbnail.png)
image: kurs-thumbnail.png

Dateien in Lektions-Unterordnern:

![Erstes Bild](einfuehrung/image1.png)
![Zweites Bild](erste-schritte/image2.png)
[Spickzettel herunterladen](erste-schritte/spickzettel.pdf)

Das System löst diese Pfade automatisch aus Ihrem _media/-Ordner auf.

Videos hinzufügen

Videos können besonders nützlich sein, um Prozesse zu demonstrieren oder komplexe Konzepte zu erklären. Verwenden Sie externe Video-Hosting-Plattformen für beste Performance:

Geben Sie die Videoquelle im Front Matter Ihrer Lektion an. Empfohlene Optionen:

---
video:
  youtube: dQw4w9WgXcQ                # YouTube Video-ID (empfohlen)
  # vimeo: 123456789                  # Vimeo Video-ID
  # tibav: 42061                      # TIB AV-Portal ID
  # external: https://.../video.mp4   # Externe Video-URL
  # embed: "<iframe ...></iframe>"    # Beliebiger Embed-Code
---

Das Video wird automatisch oben auf Ihrer Lektionseite angezeigt.

Wichtig: Verwenden Sie externe Video-Plattformen (YouTube, Vimeo, TIB AV-Portal) anstatt Videodateien im Repository zu speichern.

Tipp: Nutzen Sie möglichst das bestehende image-Feld im Front Matter als Vorschaubild (Thumbnail) für Ihr Video.

Herunterladbare Ressourcen hinzufügen

Sie können zusätzliche Ressourcen anbieten, die Ihre Lernenden herunterladen können, wie z.B. PDF-Leitfäden, Codebeispiele oder Übungsdateien.

1. Dateien im _media/-Ordner ablegen (optional in einem Lektions-Unterordner)
2. Verlinken mit dem relativen Pfad:

   [Übungsdateien herunterladen](erste-schritte/übung-dateien.zip)
   [Spickzettel herunterladen](erste-schritte/spickzettel.pdf)
   

Best Practices für die Verwendung von Medien

1. Relevante Medien verwenden: Stellen Sie sicher, dass alle enthaltenen Medien Ihren Lehrinhalt direkt unterstützen.
2. Dateigrößen optimieren: Große Dateien können die Ladezeiten der Seite verlangsamen. Komprimieren Sie Bilder und Videos, wo immer möglich.
3. Alternativtext bereitstellen: Fügen Sie immer beschreibenden Alternativtext für Bilder hinzu, um die Barrierefreiheit zu verbessern.
4. Ausgewogene Verwendung von Medien: Während Medien das Lernen verbessern können, sollten Sie eine Übernutzung vermeiden. Finden Sie eine Balance zwischen Text- und Medieninhalt.

Übung: Verbessern Sie Ihre Lektion mit Medien

1. Fügen Sie mindestens ein Bild zu der Lektion hinzu, die Sie in der vorherigen Übung geschrieben haben.
2. Fügen Sie, wenn zutreffend, eine kurze Videodemonstration in Ihre Lektion ein.
3. Erstellen Sie eine einfache herunterladbare Ressource (z.B. ein PDF-Spickzettel) und fügen Sie einen Link dazu in Ihre Lektion ein.

In der nächsten Lektion werden wir behandeln, wie Sie Ihren Kurs lokal previewen und testen, bevor Sie ihn einreichen.