In diesem Leitfaden sind wichtige Hinweise zum Redaktionsprozess, zum Einarbeitungsprozess mit WordPress (im UBlog-System) und sonstige Hinweise zum Umgang mit sowie zur Verwaltung und Pflege von WWUB zusammengestellt.
Wir bitten alle Beteiligten, die Prozessabläufe und sonstigen Hinweise zu beachten. Sollen Ergänzungen, Änderungen oder Aktualisierungen vorgenommen werden, kontaktiert bitte je nach Thema folgende Personen:
- 1. Redaktionsprozess – Was ist bei der Erstellung von Beiträgen zu beachten?
- 2. Einarbeitungsprozess – Was ist bei der Einarbeitung von Beiträgen zu beachten?
- 2.1. Material wird gesichtet
- 2.2. Material wird eingearbeitet
- 2.2.3 Medien-Elemente
- Dateien im Backend hochladen
- Bilder
- Vorbereitung: Bildbearbeitung
- Bilder mit Klick vergrößern
- Bildbeschriftung / Bildquellen
- Link zu anderem WWUB-Artikel
- Downloads/Dateien
- Videos
- Wissensbasis Videos hochladen und einbetten
- Audio-Dateien hochladen
- Videos in WordPress einbetten
- Video-Vorschaubilder erstellen und einfügen
- Thumbnail einfügen
- Videos in PuMuKIT ersetzen
- Herunterladen von Videos in PuMuKIT
- Video-Qualität bei Screencast-Videos verbessern (ungetestet/Fortgeschrittene)
- 2.2.4 Barrierefreiheit
- 2.2.5 Für Fortgeschrittene
- 2.2.6 Sonstiges
- 2.3 Freigabe für Beitrag anfordern
- 2.4 Beitrag veröffentlichen
- 3. Qualitätssicherung und Pflege der Seite
- 4. Dokumentation von Layout, Gestaltung, Technik, bekannte Probleme
1. Redaktionsprozess – Was ist bei der Erstellung von Beiträgen zu beachten?
1.1 Beitrag wird erstellt
Bei der Erstellung von Artikeln sind die Autor*innen-Hinweise zu beachten. Diese werden den Autor*innen zur Verfügung gestellt. Das Formular zur Beitragserstellung ist in den Autor*innen-Hinweisen zum Download verlinkt. Ist ein Artikel in Planung, wird dieser vom Redaktionsteam, d. h. der Person, die die Artikelerstellung mit den Autor*innen initiiert hat, in die Artikel-Übersicht eingetragen.
1.2 Beitrag wird eingereicht
Der Artikel landet auf Nextcloud im Ordner der Wissensbasis unter „\Produkte\100_noch-ohne-Zuordnung\“.
Beiträge werden von den Autor*innen in Nextcloud hochgeladen. Eine Upload-Funktion ist in die Autor*innen-Hinweise integriert („Einsendung und Umfang“). Gleichzeitig ist das Redaktionsteam (wwub@uni-bremen.de) per E-Mail über den Upload zu informieren.
1.3 Beitrag wird vorgeprüft
Miriam Kahrs legt im o. g. Ordner einen Beitragsordner an und informiert den studentischen Hilfskräftepool (s. u.), dass ein neuer Beitrag vorliegt. Sie vermerkt zudem den Status „eingereicht“ in der Artikel-Übersicht.
Anschließend prüft eine studentische Hilfskraft folgende Punkte:
- Sind alle obligatorischen Angaben im Beitragsformular (= Haupttext-Dokument) eingetragen?
- Entspricht der Umfang dem Richtwert von ca. 3.000 bis 7.000 Zeichen (inkl. Leerzeichen)?
- Wurde die Ansprache ‚Sie‘ formuliert (nicht ‚Du‘)?
- Max. 2 Rubrikzuordnungen, bei mehr gilt die Richtlinie: Je allgemeiner die Rubrik, desto eher kann sie gestrichen werden (idealerweise bleiben am Schluss nur die spezifischsten und daher hilfreichsten Kategorien übrig)
- Sind folgende Vorgaben bei Beitragsbildern eingehalten:
- Ist mindestens ein aussagekräftiges Bild vorhanden? Das Bild darf keinen weißen Hintergrund haben, damit es sich vom weißen Hintergrund deutlich unterscheidet. Liegen alle Bilder im Format 4:3 vor? (Falls nicht bitte Catharina Berg Bescheid geben, damit sie das Format mit Affinity ändert; z. B. in 2000 x 1500 Pixel.) Ist die Qualität von beigefügten Bildern gut und vergleichbar zu den anderen Bildern?
- Sind alle Bilder als separate Dateien beigefügt?
- Gibt es eine Angabe zur Quelle/Autor*innenschaft? (Muster: „© ImageAI /Julie Direnga“ oder „© Universität Bremen / Matej Maza“). Hinweis: © nur bei eigener Lizenz (Person/Uni) verwenden, nicht bei kostenlosen Bildquellen.
- Ist die Qualität von weiteren Medien (Videos, Audios etc.) gut?
- Funktionieren alle im Beitrag enthaltenen Links?
- Sind alle ggf. erwähnten Anhänge vorhanden? Wenn es PDFs sind, sollte auch die Quelldatei dabei sein (z. B. Word-Datei, auf der die PDF beruht), damit wir diese einerseits im Überarbeitungsmodus lektorieren können und andererseits ggf. eine barrierearme PDF daraus erstellen können.
Anmerkungen zur Qualität von Bildmedien
- Das Bild darf keinen weißen Hintergrund haben, damit es sich vom weißen Hintergrund deutlich unterscheidet.
- Betiragsbilder müssen im Format 4:3 vorliegen. (Falls nicht, bitte Catharina Berg Bescheid geben, damit sie das Format mit Affinity ändert, z.B. in 2000 x 1500 Pixel.)
- Ist die Qualität von beigefügten Bildern gut und vergleichbar zu anderen Bildern?
- Abmessung: lange Seite mind. 1.000 Pixel, besser mehr (Beitragsbilder werden aktuell mit 720 px dargestellt, aber wir brauchen etwas Spielraum)
- Bild muss ‚scharf sein/genügend scharfe Elemente beinhalten
- Bild muss hell genug sein (ggf. in der Bildbearbeitung aufhellen, reicht aber nicht immer aus)
- Text im Bild, z. B. Copyright-Hinweise, sollte es nicht geben (nicht barrierearm/wir notieren die Quellenangabe unter dem Bild).
- Grafiken mit informativen Details, wie z. B. Diagramme o.ä. mit Textelementen eigenen sich weniger. Diese sollten Bestandteil des Inhalts sein.
- Porträtbilder eignen sich nicht für Beitragsbilder. Nicht eine Person, sondern die Inhalte sollten über das Bild repräsentiert werden. Das Personenbild kann gut im Beitrag platziert werden.
Generell muss das Bild zur Qualität der anderen, z. T. professionell erstellten Bilder passen und sich ins ‚Gesamtbild‘ (vgl. Übersicht aller Beiträge) gut einfügen.
Ist noch etwas nachzusteuern, nimmt die bearbeitende SHK Kontakt mit den Autor*innen auf und nutzt dafür die Adresse wwub@uni-bremen.de (Zugangsdaten über Christoph Wieselhuber, Stefanie Wiechers oder Miriam Kahrs). Bei Bedarf wird mit Miriam Kahrs Rücksprache gehalten. Ist der Beitrag geprüft und vollständig, legt die bearbeitende SHK ihn im Ordner der erstgenannten Beitragskategorie (Excel Artikel-Übersicht) ab und informiert Miriam Kahrs. Wichtig: im Anschluss in der Excel-Tabelle die erstgenannte Kategorie eintragen! Sonst findet man die in Unterordner verschobenen Beitragsordner im Explorer viel schlechter.
Schließlich informiert Miriam Kahrs Stefanie Wiechers, dass der Artikel ins Lektorat gehen kann.
1.4 Beitrag wird lektoriert
Stefanie Wiechers koordiniert das Lektorat. Sie vergibt zu lektorierende Beiträge an eine Person aus dem Lektoratspool (s. u.). Dafür gibt es eine Mattermost-Gruppe „WWUB-Lektorat“ in den Uni Bremen-Kanälen (Zugang zur Gruppe über Stefanie Wiechers und Christoph Wieselhuber). Sobald ein Beitrag an eine Person vergeben wurde, wird dieser in der Artikel-Übersicht mit dem Status „im Lektorat“ versehen und das Kürzel der Person in der Spalte „Wer? (Lektorat)“ eingetragen.
Im Lektorat ist Folgendes zu prüfen / zu tun:
- Sind die Rechtschreibung und Grammatik korrekt?
- Bindestrich-Regelung beachten: Es heißt zwar „Future Skills“, aber „Future-Skills-Angebot“. Es muss hier ‚durchgekoppelt‘ werden, d. h. immer der Bindestrich verwendet werden. (vgl. scribbr.de)
- Bei mehrteiligen Begriffen in fremder Sprache wird nur das erste Wort groß geschrieben: „Status quo“ (nicht: Status Quo)
- Genitiv bei Anglizismen: Wenn diese in der deutschen Sprache „angekommenn“ sind, bekommen diese auch ein Genitiv-S (siehe korrektur-plus-lektorat.de)
- Sind folgende Vorgaben berücksichtigt:
- Ist die Ansprache ‚Sie/Ihnen‘ konsequent genutzt und großgeschrieben?
- Sind die typografischen Anführungszeichen in dieser Form genutzt: (deutsch: „x“ und ‚y‘, nicht das Zollzeichen („) verwenden? Einfach in der Textverarbeitung das Anführungszeichen neu eingeben, dann wird es i. d. R. korrigiert.)
- Sind Gedankenstriche korrekt gesetzt, ein echter Gedankenstrich mit Leerzeichen davor und danach („–“ statt dem Minus; in der Textverarbeitung ein ‚Minus‘ mit Leerzeichen davor/danach eingeben und nach dem folgenden Wort die Leertaste drücken, dann wird es i. d. R. korrigiert.)
- Sind Zahlenworte bis inkl. „zwölf“ ausgeschrieben? (Ausnahmen sind m. E. in tabellarischen Darstellungen/Listen möglich. FB)
- keine Doppelpunkte in Überschriften, nur in Ausnahmefällen, wenn z. B. direkt Listen angekündigt werden
- Beginnt der Artikel auf eine ansprechende Art, die Leser*innen zum Anklicken des Artikels in der Übersicht motiviert? Die ersten Worte des Beitragstextes werden als Teaser in der Übersicht angezeigt, daher keine langwierige Einleitung, sondern direkter Einstieg in das Thema bzw. Ansprache der Leser*innen.
- Ist der Text gut lesbar / hat er eine leseunterstützende Struktur (wurden z. B. Absätze, Zwischenüberschriften, Aufzählungen u. ä. genutzt)
- Ist der Beitrag inhaltlich verständlich und kohärent?
- Wird eine einheitliche Gendersprache (idealerweise eine gendersensible) Sprache verwendet?
- Wurden ggf. Quellen und Urheberrechte für alle Bestandteile (z. B. Texte, Bilder) angegeben?
- Passt die angegebene Kategorie-Zuordnung (ggf. mehrere Kategorien) zum Inhalt des Beitrags?
- Wenn dem Artikel eine Unterkategorie (unterhalb von „Lehren und Lernen“) zugewiesen ist, wie z. B. „Tools“, dann sollte NICHT auch die Oberkategorie zugewiesen werden. In der Hauptkategorie gibt es keine Artikel!
- Anmerkung zur Kategorie und dem Schlagwort „Tools“: Leitsatz dazu: ‚Wenn ein konkretes Tool/Toolset vorgestellt wird, dann die Kategorie „Tools“ und das Schlagwort „Tools“ zuweisen. Wenn das Thema ‚Tools‘ berührt/thematisiert wird (aber nicht konkret ein Tool vorgestellt wird), dann nur das Schlagwort.‘
Analog hierzu ist auch die Kategorie/das Schlagwort „Unterstützungsangebote“ zu nutzen.
- Zusätzlich zu den zwei Schlagworten aus dem Beitragsformular werden weitere passende Schlagworte aus einer generischen Liste angegeben: Welche zwei Schlagworte aus unserer Schlagwort-Liste passen am besten zum Beitrag? Bitte auswählen und im Hauptdokument des Beitrags (= Beitragsformular) in der Zeile ‚Schlagworte‘ mit dem eigenen Kürzel dahinter in Klammern ergänzen. (Achtung, es sollte keine ähnlichen Schlagworte parallel geben; z. B. „KI“ und „Künstliche Intelligenz“.)
Alle Korrekturen sollten möglichst direkt im Text-Dokument vorgenommen werden. Das Korrekturlesen sollte im Überarbeitungsmodus stattfinden, um Korrekturen/Änderungen nachvollziehen zu können.
Ist noch etwas im Beitrag mit den Autor*innen nachzusteuern, nimmt die bearbeitende Person Kontakt auf und nutzt dafür die Adresse wwub@uni-bremen.de (Zugangsdaten über Christoph Wieselhuber, Stefanie Wiechers oder Miriam Kahrs). Bei Bedarf wird mit Stefanie Wiechers Rücksprache gehalten.
Ist der Beitrag fertig lektoriert, bitte Stefanie Wiechers informieren. Wichtig: An dieser Stelle sollten keine Änderungsvorschläge u. ä. mehr im Beitrag zu finden sein, es sei denn, es handelt sich um Kommentare, die Hinweise für die Einarbeitung in das Blog-System enthalten.
1.5 Beitrag wird für die Einarbeitung freigegeben
Ist das Lektorat inklusive eventueller Änderungsabsprachen abgeschlossen, ändert Stefanie Wiechers den Status in der Artikel-Übersicht auf ‚Für die Einarbeitung freigegeben‘ und informiert das Einarbeitungsteam, dass ein neuer Beitrag vorliegt.
2. Einarbeitungsprozess – Was ist bei der Einarbeitung von Beiträgen zu beachten?
2.1. Material wird gesichtet
Die Person, die die Einarbeitung eines Beitrags übernimmt, trägt ihr Kürzel zunächst in der Artikel-Übersicht ein. Sobald sie mit der Einarbeitung beginnt, setzt sie den Status auf „einarbeiten“.
Sie sichtet das Beitragsmaterial, um sich einen Überblick zu verschaffen und macht sich erste Gedanken, wie der Beitrag gut eingearbeitet werden kann (z. B. im Hinblick auf die Nutzung verschiedener Inhaltselemente, die Platzierung von Bildern). Zum Teil sind Darstellungsideen von den Autor*innen in den Beiträgen vermerkt. Bei Fragen und Unsicherheiten im Rahmen der Einarbeitung kann Fadri Bischoff angesprochen werden.
Es ist sinnvoll, sich zunächst die Basiselemente wie Text und einfache Fotos einzuprägen und mit Blocksätzen (Absatz-Block) zu beginnen. Kleine Stilelemente und andere gestalterische Fragen erfordern oft ein gewisses Ausprobieren. Grundsätzlich gilt: In der Regel sollte man mit den Blocksätzen beginnen und sich von dort aus gestalterisch in die Feinheiten vorarbeiten.
Idealerweise beginnt dieser Denkprozess bereits bei der ersten Sichtung des Materials.
2.2. Material wird eingearbeitet
Die Einarbeitung des Blogbeitrags wird vorgenommen. Nachstehend ist ein Glossar mit Hilfestellungen für die Einarbeitung zu finden.
Hinweis zum Status von Beiträgen
- Beiträge, die eingearbeitet werden, auf Status „Entwurf“ festlegen (nicht „Veröffentlicht“)
- Beiträge, die fertig eingearbeitet sind und als Vorschau an Autor*innen gesendet werden, müssen im Status „Veröffentlicht“ sein und erhalten ein simples aber nicht zu erratendes Passwort (über „Schnellbearbeitung“ geht das Festlegen ggf. am einfachsten). Das Passwort wird in der Artikel-Übersicht dokumentiert, da nur Personen mit Admin-Rechten alle Passworte sehen können. [To-do: Verfahren ändern, da Artikel nach außen leider doch sichtbar sind! FB]
- interne Beiträge auf Status „Privat“ festlegen (damit diese nicht öffentlich sichtbar werden)
- interner Seiten, die aber ohne Anmeldung in WordPress erreichbar sein müssen (Autor*innen-Hinweise/Redaktions-Leitfaden), müssen im Status „Veröffentlicht“ sein.
2.2.1 Grundsätzliches und Einstellungen
Grundsätzlich soll bei allen Beiträgen eingestellt sein, dass das Änderungsdatum nicht aktualisiert wird. Kleineren Änderungen direkt nach der Veröffentlichung wirken sonst schnell unprofessionell. Dafür auf der Beitragsseite die Einstellungen öffnen, auf „Seite“ gehen (nicht: „Block“) und den Haken setzen bei „Das Änderungsdatum nicht aktualisieren“.
Nur bei grundsätzlichen Überarbeitungen eines Beitrags soll eine Aktualisierung kenntlich gemacht werden.
2.2.2 Text-Elemente und Layout-Hinweise
Schaut bitte auch immer wieder auf Beiträge, die bereits eingearbeitet sind. Der Aufbau und das Layout/die Gestaltung der einzelnen Elemente sollte vergleichbar aussehen.
Bei Unsicherheiten gern Fadri Bischoff fragen.
Beispiele:
- Wie bildgenerierende KI die universitäre Lehre bereichern kann
- Zweistufige Prüfungen (Two-stage exams)
Grundsätzliches zum Layout
Alle Elemente werden grundsätzlich linksbündig und bündig oben angelegt, z. B. auch Text in Info-Boxen oder auch zumeist Buttons betreffend. Es wird auf der gesamten Seite kein Blocksatz verwendet und zentrierter Text nur in begründeten Ausnahmefällen. Dies entspricht dem Corporate Design, wie es auf der Uni-Webseite umgesetzt ist.
Beispiel:

Exzerpt-/Teaser-Text
Ein einladender und zugleich aussagekräftiger Teaser-Text mit 20 bis maximal 40 Worten muss für jeden Beitrag unter Beitrag > Textauszug hinzufügen eingetragen werden (sonst werden die Autor*innen-Namen zuerst genannt, was nicht sein soll). Der Text darf auch etwas länger sein, dann wird jedoch automatisch mit einer Ellipse („…“) gekürzt.
Der Einfachheit halber können die ersten Sätze des Artikels verwendet werden. Besser ist ein neuer Text (wenn sich der Text wiederholt, was möglich ist, Text nicht im Artikel entfernen; der Artikel muss vollständig bleiben). Der Teaser sollte sonst möglichst durch Autor*innen geliefert werden (wird über das Beitrags-Formular abgefragt). Auch Chat.AI mit den internen Modellen (nicht ChatGPT etc.) kann als Werkzeug für eine Grundlage eines Exzerpt-Textes genutzt werden.
Der Exzerpt-Text beinhaltet nicht die*den Autor*in.
zum Hintergrund
Der Exzerpt-Text wird nicht nur in den Beitragskacheln angezeigt, sondern auch in den Suchergebnissen der internen Suche und in den nicht sichtbaren Angaben für Suchmaschinen, so dass der Text von Suchmaschinen verwendet werden kann.
Es kann nur die Anzahl der Worte eingestellt werden, nicht die Anzahl von Zeichen. Maximal technisch möglich sind 55 Worte. Eingestellt ist aktuell eine Zahl von 40 Worten. Mehr Worte werden in den Beitragskacheln auf der Startseite und den Kategorie-Seiten nicht dargestellt.
Artikel einarbeiten (SHK)
Bei der Einarbeitung von Artikel bitte generell achten auf:
- Links sollten aussagekräftig sein („Im Artikel xy finden Sie …“ statt „hier“ oder „Artikel“; i. S. von Barrierefreiheit und Suchmaschinenoptimierung). Links werden nicht ausgeschrieben eingefügt (also nicht mit „https://www.uni-bremen.de…“).
- Alle externen Links werden mit „Open in new window“ o. ä. versehen. Links zur Uni-Bremen-Webseite gelten als extern. Ebenso werden interne Links (d.h. Links innerhalb von WWUB) ebenfalls mit „Open in a new window“ versehen, wenn sie den Lesefluss des Textes unterbrechen (z.B. mitten im Text, etc.).
- Text wird in fast allen Fällen linksbündig und in Tabellen/Spalten etc. oben bündig angesetzt (entspricht dem Corporate Design der Uni bzw. ist teilweise auf schmalen Bildschirmen leichter zuzuordnen).
- Beitrag/Seite in erster Version immer auch einmal checken, wie es auf schmalem Bildschirm aussieht (Notebook-Symbol im Editor oben rechts für schmale Ansicht wählen).
- Artikel den Kategorien und Unterkategorien sowie maximal 2 generischen (siehe Tabelle) und 2 Autor*innen-Schlagworten zuordnen (ggf. nach Kategorien und Schlagworten fragen)
- immer Beitragsbild festlegen (ggf. nachfragen)
- Autor*innen-Name vor erstem inhaltlichen Satz als neuen Absatz mit „von …“ erstellen und CSS-Klasse „verfassende“ für den Absatz eintragen (rechts unter Block > Erweitert > Zusätzliche CSS-Klasse(n)) (Autor*innen werden immer ohne Titel wie z. B. „Dr./Prof.“ angegeben.)
- Hinter Autor*innen-Name Urheber*innen-Angabe zum Beitragsbild einfügen. Muster: „von Julie Direnga und Lee Wittig — Bild: © ImageAI / Julie Direnga“ (Beispiel ‚Kick-off‘-Artikel; bitte auf den langen Gedankenstrich achten und am besten kopieren)
Überschriften
Infobox: Die Infobox muss unter der Überschrift H4 platziert werden (siehe Screenshot).
Überschriften schließen nicht mit einem Doppelpunkt ab (die Überschrift sagt bereits aus, dass etwas folgt; auch i. S. der Barrierearmut wäre der Doppelpunkt ein vom Screenreader überflüssig vorgelesenes Zeichen).

Buttons
Wann können Buttons sinnvoll sein?
- wenn der Link zentral ist und betont werden sollte (der Artikel bezieht sich stark auf eine Webseite)
- wenn zur Handlung aufgefordert wird (‚Call-to-action‘, wie Anmeldung, E-Mail)
- ggf. auch wenn der Artikel wenig durch verschiedene Layout-Element aufgelockert ist (‚Textwüste‘) und noch etwas Abwechslung vertragen kann
Wann setze ich lieber einen einfachen Link?
- wenn der Link nicht zentral ist, eher am Rande erwähnt ist oder optional geklickt werden könnte
- Wenn es zu viele Buttons auf der Seite/untereinander geben könnte (nicht mehr als 5). Ist hier ggf. eine Liste alternativ besser geeignet?
Einfügen von Buttons
Einfügen von Buttons geht am einfachsten über den „Buttons“-Block mit dem schwarzen Symbol. Buttons sollten linksbündig eingearbeitet werden.

Buttons sollten einen für sich sprechenden Text enthalten (z. B. „mehr Informationen zu Opencast“ statt „Opencast“/“zur Webseite“). Der Button sollte nicht alleinstehen und mit einem Absatz, ggf. auch nur einem kurzen Absatz, eingeführt werden.
Der blaue Buttons-Block kann ebenfalls genutzt werden, interne Links können hier jedoch nicht bequem über eine Suche angegeben werden. Zur einheitlichen Darstellung der Buttons ist Folgendes wichtig
- General > Content > Inherit From Theme einschalten
- „Primary“ für Standard-Buttons wählen („Secondary“ nur in Ausnahmefällen, wenn ein weißer Button mit Rahmen benötigt wird, um z. B. diesen von einer Reihe blauer Buttons zu unterscheiden)

Info-Box/Kontakt-Kasten
Wie in fast allen Blöcken sollte Text in einer Info-Box links ausgerichtet sein. Buttons sollten kein Icon enthalten.
Info-Boxen können aktuell farbig blau oder grau hinterlegt werden (mehr ist möglich). Dazu die folgenden zusätzlichen CSS-Klassen angeben (rechts unter Block > Erweitert > Zusätzliche CSS-Klasse(n); vgl. wie bei der Autor*innen-Angabe oben).
Blaue Info-Box:
info-box-1
und graue Info-Box
info-box-2
Gibt es Kontaktangaben o. ä. im oder am Ende des Artikels sollte eine Info-Box „Kontakt“ für die Angaben verwendet werden. Dabei sollte ein Briefumschlag-Icon angezeigt werden (in der Icon-Auswahl unter „Communications“). (Beispiel) [To-do: Icon wird zur Zeit nicht angezeigt. Unklar warum. FB]
In Info-Boxen können leider keine Buttons genutzt werden. Ggf. bitte Fadri ansprechen, wenn dies doch mal notwendig sein sollte/wiederkehrende möglich sein sollte. Dann entwickeln wir einen eigenen, flexibleren Kasten.
Zitate/Pullquote
- Zitat-Block: Unterscheidung zwischen „Standard“ und „Einfach“ innerhalb von Zitat-Block: Zitat-Block auswählen und in den Block reinklicken (Vorsicht nicht in das Textfeld sondern in den ganzen Block) in rechter Miniaturleiste kann zwischen Standard und Einfach gewählt werden
- Pullquote-Block: Geeignet für Selbstzitat aus dem Artikel.
Fußnoten einarbeiten
Beachten: Aus Gründen der Übersichtlichkeit empfiehlt es sich, die Fußnoten erst als letzten Schritt im Artikel einzuarbeiten.
- Satz anklicken, in den die Fußnote eingebracht werden soll.
- Daneben den Shortcode: „[mfn]Fügen Sie hier Ihre Fußnote ein[/mfn]“ einfügen.
- Der Text in den Klammern ist durch eine eigene Quellenangabe zu ersetzen.
- Darauf achten, dass kein Leerzeichen zwischen Fußnotentext und Satz ist.
- Referenzen werden automatisch angezeigt, wenn auf den Hyperlink am Ende der Seite geklickt wird.
- Fußnote verändern: Verhaltensweisen oder Stil der Fußnoten kann geändert werden, durch folgende Shortcodes. [mfn referencenumber=3] Diese Fußnote wird die Nummer 3 haben [/mfn] [mfn class=’my-pretty-class‘]Diese Fußnote erhält ‚my-pretty-class‘ als zusätzliche Klasse, mit der du einzelne Fußnoten individuell gestalten kannst.[/mfn] [mfn referencereset=’true‘]Diese Fußnote setzt den Fußnotenzähler zurück und erhält daher eine 1 als Nummer. Auch die folgenden Fußnoten erhalten ihre Nummer entsprechend dem neuen Start.[/mfn]
Bitte einarbeiten:
- Bitte alle Links einmal überprüfen.
Lizenz für Beitrag angeben
Ganz unten auf der Seite kann eine Lizenz zum Beitrag angegeben werden (bisher: Creative-Commons-Lizenzen).
- mit Block „Spalten“ anlegen
- Block mit zusätzlicher CSS-Klasse „oer“ versehen (Erweitert > Zusätzliche CSS-Klasse(n)).
- mit dem entsprechenden CC-Badge (siehe Downloads; „SVG“ runterladen!) in der linken Spalte und rechte Spalte den Lizenzhinweis „Lizensiert unter Namensnennung-Share Alike 4.0 International (CC BY-SA)“ notieren (Liste aller Lizenzen)
- dabei „CC BY-SA“ verlinken auf den jeweiligen „Deed„
Die CC-Badges-Grafik sollten unter /30_Icons in der Mediathek abgelegt werden.
Beispiel-Beitrag: ICAP
Die Creative-Commons-Lizenzen werden in der Kurzform wie folgt notiert: „CC BY-NC-ND 4.0“. Die Bindestriche werden nur zwischen den Attributen gesetzt (vgl. creativecommons.org).
Übersicht über die empfohlenen Lizenzen nach der OER-Policy der Uni Bremen
2.2.3 Medien-Elemente
Dateien im Backend hochladen
Alle Dateien, die im Backend in der Mediathek hochgeladen werden, müssen einem Ordner zugewiesen werden, damit auf lange Sicht eine Übersicht über Dateien erhalten werden kann. In den meisten Fällen wird dies der Ordner „10_Beiträge > JAHR“ sein. Die wichtigsten Ordner:
- aktuelle Beiträge: 10_Beiträge > JAHR
- Seiten: 20_Seiten > JAHR
- Redaktions-Leitfaden/Autor*innen-Hinweise: 80_intern

Bilder
Vorbereitung: Bildbearbeitung
Alle Bilder sollten in etwa gleicher Qualität erscheinen und einheitlich sein. D. h. Bilder sollten im gleichen Seitenverhältnis (Ausnahme Screenshots) und in gleicher Helligkeit/Bildwirkung eingearbeitet werden.
- Beitragsbilder beschneiden auf Seitenverhältnis 4:3
- ggf. verkleinern auf: lange Seite 2.400 Pixel (wenn länger als ca. 3.000 Pixel)
- Bilder ggf. aufhellen (vgl. immer andere ‚gute‘ Bilder auf den Seiten als Referenz)
- in Bildern mit größeren weißen Bereichen am Bildrand das Weiß um ca. 3 % abdunkeln, damit es sich vom ‚Papierweiß‘ unterscheidet
Unscharfe oder zu kleine Bilder müssen ggf. abgelehnt werden und nach Ersatz gefragt werden.
Achten auf:
- Bilder grundsätzlich im 4:3-Format anlegen: Das Beitragsbild muss immer 4:3 sein. Auch z. B. die meisten formatfüllenden Bilder im Text, dies sind oft Fotos, müssen 4:3 sein.
Es gibt jedoch für die Bildmaterialien im Fließtext auch wichtige Ausnahmen (nicht vollständig):- Grafiken/Illustrationen, z. B. Diagramme, angeordnete Ansammlung von Symbolen, die nicht formatfüllend, also überwiegend ‚freistehend‘ sind und nicht bis zum Bildrand gehen (oft stehen diese auf einem weißen Hintergrund; das sollte auch so bleiben)
- Logos
- Symbole
- Screenshots (richten sich nach dem Inhalt und Text in Screenshots muss, mindestens bei Vergrößerung, gut lesbar sein)
- Video-Standbilder
- Bilder im Block „Image Gallery“ werden nicht 4:3 dargestellt, sollten jedoch dennoch 4:3 angelegt werden, da diese in der vergrößerten Ansicht (Lightbox) in 4:3 angezeigt werden.
- Copyright bzw. Bildquelle angeben. Bitte die Vorgaben unter dem Leitfadenpunkt „Bildbeschriftung“ beachten (s. u.).
- Barrierefreiheit: Jedes Bild bzw. Beitragsbild muss eine kurze Beschreibung dessen enthalten, was darauf zu sehen ist (Beschreibung und Alternativtext; der Einfachheit halber hier den gleichen Text nehmen). So können auch Menschen mit Sehbehinderung die Inhalte mithilfe eines Screenreaders erfassen.
Zum Einfügen des Alternativtexts wird in der Mediathek das gewünschte Bild ausgewählt. Anschließend kann am rechten Rand im Feld „Alternativtext“ eine kurze Beschreibung der Bildinhalte eingetragen werden.
Dieser Prozess muss vor dem ersten Einfügen eines Bildes vollständig vorgenommen werden.
Wenn ein Bild aktualisiert werden muss, bitte unbedingt die Funktion „Datei ersetzen: Eine neue Datei hochladen“ in der Mediathek unter dem jeweiligen Bild nutzen. Kein Bild sollte doppelt vorhanden sein. Ggf. bitte aufräumen und dabei auch auf die Meta-Angaben wie Beschreibung/Alternativtext achten!
Wenn ein Bild/eine Grafik im Fließtext viel weißen Hintergrund am Bildrand enthält, sollte das Bild mit der Klasse „rahmen“ versehen werden, damit ein Rahmen um das Bild gelegt wird (Erweitert > Zusätzliche CSS-Klasse(n)).
Bilder mit Klick vergrößern
Bilder sollten immer so eingearbeitet werden (außer dem Beitragsbild), dass diese per Klick vergrößert darstellbar sind. Dies ist wichtig gerade bei Details, die erkennbar sein sollen, wie in Screenshots, aber auch im Sinne der Barrierefreiheit.
Sollte ein Bild nicht zu vergrößern sein, weil keine größere Version vorliegt, sollte nach einer größeren Version oder einem alternativen Bild gefragt werden. Wenn das Bild verwendet werden muss, aber keine hinreichend größere Version vorliegt: ausnahmsweise keine Vergrößerung anlegen.
- Block „Image“: Bild klicken > Link-Symbol wählen > „Link zur Bilddatei“ klicken
- Block „Bild“: Bild klicken > Link-Symbol wählen > „Vergrößern bei Klick“ wählen
Bildbeschriftung / Bildquellen
Bilder müssen immer unter dem Bild beschriftet werden (Bildunterschrift). In der Regel sind diese mit Quellen zu versehen. Bei Bildbeschriftungen muss aus Barrierefreiheitsgründen immer ein Doppelpunkt verwendet werden.
Bei Titelbildern ist im Beitrag ganz oben eine Zeile für die Bildbeschriftung einzufügen. Bei Bildern die an anderer Stelle in Beiträgen stehen, muss die Beschriftung im Feld „Untertitel“ in der Mediathek eingefügt werden (siehe Screenshot).

Bei Bildern für die wir über das Urheberrecht verfügen (z. B. Bilder der Uni, Bilder der Autor*innen u. ä.) ist die Angabe wie folgt zu machen: Bild: © Name und/oder Agentur/Generator / Universität Bremen.
Beispiele:
- „Bild: © Matej Meza / Universität Bremen“
- „Bild: © Akademie für Weiterbildung / Universität Bremen“
- „Bild: © Ursula Meyer, Akademie für Weiterbildung / Universität Bremen“
- „Bild: © Patrick Zerrer, Midjourney / Universität Bremen“
- Bildunterschrift mit inhaltlichem Hinweis -> bitte Quellenangabe in Klammer setzen:
„Zeitliche Einteilung und Inhalte der drei Phasen im Methoden-Seminar (Bild: © Catharina Berg und Julie Direnga / Universität Bremen)“ - komplexere Angabe eines bearbeiteten Bildes unter dem Bild neben der Bildbeschriftung:
„… (Mondphasen: Isabell Schaffer, Mondoberflächenaufnahmen Bildvergleich: NASA, GSFC, Arizona State University – Bild: © Isabell Schaffer / Universität Bremen)“ (vgl. Artikel) - komplexe Angabe mit Lizenz:
„Das ICAP-Modell aktiven Lernens nach Chi und Wylie (2014) (Bild: © Julie Direnga, in Anlehnung an Schäfle und Dölling (2025) / Universität Bremen, Lizenz: CC BY-SA 4.0)“
Bei Bildern für die wir nicht über das Urherberrecht verfügen, insbesondere bei kostenfrei nutzbaren Bildern aus Datenbanken, sind die Bildquellen wie in der nachstehenden Tabelle stehend vorzunehmen. Bei nicht aufgeführten Plattformen ist die Form der Angabe zu prüfen und einzuhalten.
| Plattform | Lizenz / Nutzung | Quellenangaben | Beispiel |
| Pixabay | Private & kommerzielle Nutzung, Bearbeitung erlaubt. Keine Pflicht zur Namensnennung. | Keine Pflicht, Empfehlung: „Bild: Nutzername / Pixabay“ | Bild: Max Müller / Pixabay |
| Unsplash | Kostenlose, auch kommerzielle Nutzung, Bearbeitung erlaubt. Keine Pflicht zur Namensnennung. | Keine Pflicht, Empfehlung: „Bild: Fotograf/in auf Unsplash“ | Bild: Anna Schneider / Unsplash |
| Pexel | Frei nutzbar privat & kommerziell, Bearbeitung erlaubt. | Keine Pflicht, Empfehlung: „Bild: Fotograf/in – Pexels“ | Bild: Peter Becker / Pexels |
| Flickr | Abhängig von der gewählten CC-Lizenz. Viele CC BY / CC BY-SA / CC0. Immer Lizenzseite prüfen. | Immer Name + Lizenz + Link, z. B. „Bild: Name / CC BY 2.0 (Link zur Lizenz)“ | Bild: Julia Hoffmann / CC BY 2.0 (https://creativecommons.org/licenses/by/2.0/) |
| Freepik | Private & kommerzielle Nutzung mit Namensnennung. Nutzung ohne Quellenangabe nur mit Premium-Abo. | Pflicht: „Designed by Freepik“ + www.freepik.com direkt beim Bild oder in der Nähe platzieren (muss aber nicht verlinkt sein!). Urheber:in optional. | Bild: Anna Müller / Designed by Freepik, www.freepik.com |
Link zu anderem WWUB-Artikel
Um einen Artikel mit einem weiteren zu verknüpfen, muss der Originaltitel aus dem Backend abgelesen und in die Link-Suche eingegeben werden (siehe Screenshot). Diese Vorgehensweise funktioniert auch, wenn sich der Artikel noch im Entwurfsstatus befindet.

Downloads/Dateien
Mehrere Downloads können mit dem „Datei-Block“ eingearbeitet werden. Hierzu das gewünschte Dokument mit „Datei-Block“ hochladen.
Um eine einzelne Datei zu verlinken, sollte der Buttons-Block verwendet werden (der Datei-Block verwirrt einzeln eher, da der Text links und der Button rechts auf breiten Bildschirmen weit auseinander liegen).
Videos
Videos sollten nicht in die Wissensbasis hochgeladen werden, sondern über ein externes System. Dazu wird die Plattform PuMuKIT vom ZMML genutzt.
In den Videos sollten das offizielle ‚Outro‘ der Universität am Ende des Videos zu sehen sein (.psd-Datei unter \Nextcloud\SKILL\020_Logos-Design-PR\005_Corporate-Design-Uni\Digital Assets Video\02_Outro (Credits)\).
[Anleitung/Vorgehen dokumentieren, FB]
Wissensbasis Videos hochladen und einbetten
Voraussetzung: Für PuMuKit ist ein gesonderter Zugang über das ZMML notwendig. Ein Login mit dem Uni-Account ist nicht möglich. Zugänge gibt es über Michael Doppelstein oder Alexander Hillmann vom ZMML.
Videos hochladen in PuMuKIT
- In PuMuKIT unter https://ml.zmml.uni-bremen.de/login anmelden
- oben rechts „Videos verwalten“ klicken
- Series (‚Ordner‘) „Wissensbasis“ klicken
- „+ Wizard“ wählen
- Titel (de) und möglichst auch Beschreibung (de) eingeben (dazu ggf.
- „Next“ klicken
- „WebTV“ und Sprache auswählen, Video unter „Durchsuchen…“ hochladen
- „Next“ klicken und warten, bis statt „Progress…“ „Audio/Video uploaded successfully“ gemeldet wird (das Video wird im Hintergrund umgewandelt)
- „Edit multimedia object“ wählen (oder, bei mehreren Uploads empfohlen, „Create another Multimedia Object in same Series“ wählen)
- Video sollte nun in der Liste als Zeile angezeigt werden
- Video ggf. anwählen, wenn noch nicht grün markiert
- nach unten blättern und unter dem Reiter „Publication“ „Status“ mit „Published“ festlegen,
mit „OK“ bestätigen (!) - im Reiter „Multimedia“ unter „Anhänge“ „New“ wählen und wie folgt festlegen:
Name = Titel des Videos wie zuvor festgelegt (de und en beide ggf. deutschen Titel angeben)
Sprache = deutsch
Type = vtt
Mode = File
unter „Durchsuchen…“ VTT-Datei hochladen (wenn diese nicht zur Verfügung steht, muss diese generiert werden über die Transkriptions-Funktion auf dem Stud.IP-Dashboard-Seite)
Das Video sollte nun hochgeladen und im ZMML- Videoportal veröffentlicht sein (bei größeren Videos kann es etwas länger dauern).
Audio-Dateien hochladen
Vgl. „Videos hochladen in PuMuKIT“, aber ab inkl. 4.:
- „New“ wählen (statt „Wizard“)
- Neuen, ‚leeren‘ Track mit Namen „New“ in der Liste oben auswählen.
- Unter „Multimedia“ „Video Files: New master…“ wählen.
- Datei hochladen und unter „Profile: broadcastable_master“ (anstatt „master_copy“) wählen.
Empfohlen ist, ein einladendes Vorschaubild zu hinterlegen, welches auf den Inhalt hinweist und symbolisch zeigt, dass es sich um eine Audio-Datei handelt. (Als Standardbild erscheint ein gut zu deutendes Kopfhörer-Symbol auf eher optisch ungünstigem schwarzen Grund).
Videos in WordPress einbetten
In den UBlogs kann einfach der Link des Videos aus der Adresszeile des Videos im PuMuKIT-Frontend eingefügt werden – z. B.: https://ml.zmml.uni-bremen.de/video/67bccbdbd42f1cf60a8b4769
Der Link wird in die Darstellung eines Players umgewandelt.
Video-Vorschaubilder erstellen und einfügen
- Als Vorschaubild nimmt PuMuKIT immer das erste Bild im Video. Es sollte ein aussagekräftigeres und einladendes Bild verwendet werden. Oft muss daher ein eigenes Bild hochgeladen werden.
- Wichtig: Das Vorschaubild muss im gleichen Seitenverhältnis wie das Video vorliegen (also oftmals 16:9, z. B. 1920 x 10180 px). Dies ist oft sichergestellt, wenn das Vorschaubild mit der Funktion eines Video-Players erstellt wird
über Video-Player auf dem eigenen Rechner
- z. B. über https://www.videolan.org/vlc/ [FB1]

- Über VLC Video aufrufen
- In Kopfzeile „Video“ auswählen, dann auf „Schnappschuss“(Mac Benennung) klicken
- Screenshot wird an dem Ort gespeichert, welcher kurzzeitig eingeblendet wird
- Wichtig ist das gleiche Seitenverhältnis zum Video, geht eventuell auch mit anderem Snipping Tool.
Thumbnail einfügen
- Falls vorhanden, das erste, ‚leere‘, weiße Thumbnail über das „x“ löschen!
- auf „New thumbnail…“ klicken und eigenes Thumbnail auswählen. Dabei unbedingt auf das richtige Seitenverhältnis achten.
- „Datei auswählen“ und mit „ADD“ neues Thumbnail hinzufügen.
- Reihenfolge kontrollieren ggf.: Ist das erste Thumbnail, das welches verwendet werden soll? Ggf. Reihenfolge mit Pfeilen ändern.
Videos in PuMuKIT ersetzen
- Unter dem Video im Reiter „Multimedia“ die „Master“-Datei über das „x“-Symbol löschen. (Falls dies nicht möglich sein sollte, fehlen im Account Rechte, dann bitte Alexander Hillmann im ZMML kontaktieren.)
- Original-Video über „New master…“ neu hochladen und „master_video_h264“ wählen
Das neue Video sollte nun nach Neuladen der Seite sichtbar sein.
Herunterladen von Videos in PuMuKIT
- Video auswählen
- unten auf Reiter „Multimedia“ klicken
- unter „Video files“ darin den breiten Pfeil nach unten klicken, um das gewünschte Video herunterzuladen
Video-Qualität bei Screencast-Videos verbessern (ungetestet/Fortgeschrittene)
- für Fortgeschrittene, ungetestet (!) als Info von Alexander Hillmann, ZMML
- Aufnahmen vom Bildschirm können prinzipiell mit höherer Qualität dargestellt werden. Dazu könnte ein proprietärer Techsmith-Codec verwendet werden, der theoretisch in FFMPEG enthalten ist. PuMuKIT rekodiert jedoch alle Videos standardmäßig per H264/MPEG-4, so dass eine Verwendung eines alternativen Codec zunächst nicht sinnvoll ist. In PuMuKIT kann jedoch beim Upload von Video-Dateien „broadcastable_master“ ausgewählt werden, so dass nicht rekodiert wird.
Insofern wäre hier ein entsprechender Testlauf sinnvoll, wenn man eine höhere Darstellungsqualität erreichen will. (Wenn die broadcastable_master-Funktion im persönlichen PuMuKIT-Account nicht zur Verfügung steht, kann Alexander Hillmann es testen.)
Transkripte von Videos (Barrierefreiheit) zum Download bieten wir zunächst nicht an, aber ggf. später.
2.2.4 Barrierefreiheit
Grundprinzipien
- Semantische Struktur: Überschriften, Listen, Tabellen und Abschnitte korrekt auszeichnen.
- Texte:
- Semantische Struktur nutzen (Überschriften als Überschriften kennzeichnen, Listen korrekt auszeichnen)
- Links im Flattersatz und linksbündig formatieren
- Serifenlose Schrift (z. B. Arial, Calibri) in ausreichender Größe (mind. 14 pt)
- Sprache klar, zielgruppenorientiert und verständlich halten (Fremdsprachen markieren (z. B. mit lang-Attribut)
- Fremdwörter und Abkürzungen auszeichnen und beim ersten Auftreten erklären
- Lange Beiträge ggf. mit Inhaltsübersicht/Zusammenfassung ergänzen
- Bei Zeilenumbrüchen in Überschriften: Trennstellen mit ­ einfügen
- Tabellen: Übersicht oder kurze Zusammenfassung voranstellen
- Kontraste: Mindestkontrast 4,5:1 sicherstellen, keine reinen Rot-Grün-Kontraste verwenden
- Mehrkanal-Prinzip: Informationen nicht nur durch Farbe, sondern zusätzlich durch Symbole, Text oder Fettdruck hervorheben
- Medien:
- Bilder mit Alternativtext versehen (außer bei rein dekorativen Elementen) -> KI-gestützte Tools (z. B. ChatGPT oder andere Modelle) können beim Erstellen helfen (Kontrolle bleibt notwendig, da KI nicht immer korrekt erkennt), Alternativtexte direkt in der Mediathek eintragen → sie übertragen sich automatisch auf Beitragsbilder. Hilfreich ist diese Entscheidungshilfe, ob ein alternativer Text verwendet werden sollte.
- Videos mit Untertiteln, Audiodeskription und ggf. Gebärdensprache
- Audiodateien mit Transkripten ergänzen
- Keine Autoplay-Elemente oder blinkende Inhalte verwenden (keine automatisch startenden Animationen, Videos oder Slider/Karussells)
- Bedienbarkeit:
- Inhalte per Tastatur vollständig nutzbar machen
- Fokus-Markierungen sichtbar machen
- Steuerelemente korrekt beschriften und implementieren
- Technische Anforderungen:
- Inhalte bis 200 % vergrößerbar ohne Verlust der Lesbarkeit
- Screenreader-Kompatibilität testen
- Auf CAPTCHAs verzichten oder barrierearme Alternativen nutzen
Organisatorische Punkte
- Barrierefreiheitserklärung: Jede Website muss eine aktuelle Erklärung zur Barrierefreiheit enthalten
- Feedbackoption: Möglichkeit bereitstellen, Barrieren zu melden
- Mehrsprachigkeit: Im universitären Bereich deutsche Inhalte auch auf Englisch anbieten
- Tests:
- Eigene Tests mit Screenreadern durchführen
- Accessibility-Checker einsetzen (z. B. WAVE, Axe)
Weiterführende Checkliste
Für detaillierte Prüfkriterien (z. B. zu Schriftarten, Farbkontrasten, Formularen, Navigationen, externen Inhalten und gesetzlichen Normen) verweisen wir auf die Courseware: Barrierearmes Lehren und Lernen (Kapitel Websites)
2.2.5 Für Fortgeschrittene
Silbentrennung/Trennungen
Lange Worte trennen
Besonders bei langen Worten auf schmalen Bildschirmen kommt es im Browser zu ungeeigneten Worttrennungen. Um den Umbruch selber zu steuern kann dort, wo das Wort möglichst getrennt werden soll, ein „bedingter Trennstrich“ eingefügt werden. Zwischen den Buchstaben wird folgender Code reinkopiert (nicht eintippen!):
­
Nicht wundern, es ist nach dem Einfügen nichts zu sehen. Das Zeichen ist jedoch (hoffentlich) eingesetzt. Wenn man es löschen will, tippt man am besten das Wort neu (man kann auch zwischen die Buchstaben gehen und es löschen, man merkt es, trifft aber das Zeichen ggf. nicht sofort).
Sonderzeichen einfügen
Besondere Zeichen können vglw. einfach über den Nummernblock rechts in der Tastatur angegeben werden (mehr Info bei typefacts.com). Die Alt-Taste bleibt gedrückt während die Ziffern eingegeben werden. Wenn es nicht funktioniert, bitte einmal die „Num Lock“-Taste ausschalten (diese blockiert den Nummernblock).
– = Alt + 0150 (Gedankenstrich und bis-Strich, ohne Leerzeichen verwenden)
— = Alt + 0151 (Geviertstrich in Quellenangabe Beitragsbild)
© = Alt + 0169
„ = Alt + 0132
“ = Alt + 0147
‚ = Alt + 0130
‘ = Alt + 0145
2.2.6 Sonstiges
Schlagwort zuweisen
Es gibt zwei Varianten dafür.
Variante 1: In der Beitragsübersicht mit der Maus über den Beitragstitel hovern. Es erscheinen darunter Optionen. Auf „Schnellbearbeitung“ klicken. Mittig erscheinen die zur Auswahl stehenden Kategorien, rechts das Fenster für mögliche Schlagworte. Mehrere Schlagworte mit Komma trennen.
Variante 2: Beitrag öffnen und rechts die Einstellungen einblenden. Beitrag (statt Block) muss sichtbar sein. Runter scrollen bis zum Bereich Schlagwörter. Unter „Schlagwort hinzufügen“ ein oder mehrere Schlagwörter eingeben und dabei auf korrekte Rechtschreibung achten. Mehrere Schlagworte mit Komma oder Eingabetaste trennen.
Weiteres/Sammlung
- [Zielgruppenorientierung]
- [Leitfragen an einen Artikel(-Typus)]
- Interessante Überschriften zwischen ‚catchy‘ und sachlich? [Vorschlag geben ggf.]
- Link-Hinweise unterhalb/neben Texten
- kurze Zusammenfassung zum Nutzen des Links geben, um zu verdeutlichen, ob der Link für Lesende hilfreich sein könnte (jeder Klick ist eine ‚Investition‘ der Nutzenden)
- Quelle/Autor*in nennen
- [Beispiel]
- [Schreiben fürs Web]
- [passenden und kostenloses Bildmaterial finden: Uni-Datenbank, Portale empfehlen, Info zur Quellenangabe geben]
- [Suchmaschinenoptimierung (Seitentitel, Beschreibung, Link, Inhalte ggf.)]
[ergänzen, wie es in WordPress zu machen ist; SHK beauftragen]
Beitrags-Serien (mehrere Beiträge zu einem Thema): zu bedenken
Achtung, bitte bedenken: Bei einer Aufteilung in mehrere Beiträge (also nicht Seiten) erscheint jeder einzelne Artikel auf der Startseite oder den Kategorie-Seiten als einzelner Beitrag und ist ggf. durch Suchmaschinen auch als einzelner Beitrag auffindbar. Daher müssen die Artikel alle gegenseitig untereinander verlinkt werden und sollten als Serie erkennbar sein.
Ebenfalls zu bedenken: Eine solche Beitragsserie ‚verfälscht‘ die Schlagwortwolke, da das zugeordnete jeweilige Schlagwort mehrfach gezählt wird.
2.3 Freigabe für Beitrag anfordern
Um den Einarbeitungsprozess zu beenden, erledigt die Person, die den Beitrag eingearbeitet hat, folgende Schritte:
- Ist ein Beitrag fertig eingearbeitet und nochmal alles überprüft, ist er in der Artikel-Übersicht mit dem Status „Endabnahme einholen“ zu versehen.
- Für jegliche Kommunikation mit den Autor:innen wird die Adresse wwub@uni-bremen.de verwendet! Zugang dazu erhält man über Christoph Wieselhuber, Stefanie Wiechers oder Miriam Kahrs.
- Autor*innen mit Zugang zum WWUB-Blog werden von der Adresse wwub@uni-bremen.de aus angeschrieben und gebeten, sich den Artikel im Blogsystem über die Voransicht anzuschauen und eventuelle Änderungswünsche per E-Mail mitzuteilen bzw. die Freigabe zu erteilen.
- Wenn Autor*innen keinen Zugang zum WWUB-Blog haben, gibt es verschiedene Wege, ihnen Artikel zur Vorabansicht zu schicken. Wir nutzen aktuell eine Variante, die Vorschau als HTML-Datei mit dem Browser-Addon „SingleFile“ zu senden (vorher per PDF, siehe unten):
- Addon runterladen und installieren: https://www.getsinglefile.com/#download (geht in allen Browsern mit großem Marktanteil)
- Addon über Button im Browser auf der Beitrags-Seite ausführen, die versendet werden soll
- warten, bis die Seite vollständig geladen ist (!)
- In den Browser-Downloads findet sich nun eine HTML-Datei, die versendet werden kann.
- Diese Seite bitte einmal testweise im Browser öffnen. (Einige interaktive Elemente, wie der Slider, funktionieren dort nicht. Das ist verschmerzbar.)
- Geben die Autor:innen ihren Beitrag frei, gibt die einarbeitende SHK Christoph Wieselhuber Bescheid. Er überprüft ein letztes Mal alles, veröffentlicht den Beitrag im Anschluss und setzt den Status des Beitrag in der Artikel-Übersicht auf „veröffentlicht“. Damit ist der Einarbeitungsprozess abgeschlossen.
- Für den Fall, dass nach der Veröffentlichung noch Korrekturen nötig werden, oder falls für die Zukunft weitere Aktionen vorgemerkt werden (z.B. die Verlinkung zu einem noch nicht veröffentlichten Beitrag), wird in der Artikel-Übersicht der Status „Korrektur nach Veröffentlichung“ gesetzt und eine entsprechende Anmerkung notiert.
alternative Beitrags-Vorschau-Methoden
- Beitragsseite aufrufen und im Frontend ansehen.
- Wichtig: Man muss auf der Seite ganz nach oben scrollen, weil sonst visuelle Elemente über dem Text des PDF eingeschoben werden.
- Druck als PDF mit folgenden Einstellungen:
Skalierung 75%
Deaktivieren von „Kopf- und Fußzeilen drucken“ und „Hintergrund drucken“ - Überprüfen, ob Verlinkungen funktionieren oder nicht. Wenn nicht, kann Christoph Wieselhuber das PDF bei Bedarf erzeugen.
- Diese Datei den Autor*innen schicken und um Freigabe bitten.

2.4 Beitrag veröffentlichen
- Geben die Autor:innen ihren Beitrag frei, gibt die einarbeitende SHK Christoph Wieselhuber Bescheid. Er überprüft ein letztes Mal alles, veröffentlicht den Beitrag im Anschluss (siehe unten) und setzt den Status des Beitrags in der Artikel-Übersicht auf „veröffentlicht“. Damit ist der Einarbeitungsprozess abgeschlossen.
- Es sollen pro Woche zwei Beiträge veröffentlicht werden. Veröffentlichungstage sind in der Regel Dienstag und Donnerstag.
- Geplante bzw. terminierte Veröffentlichung: Beiträge können direkt veröffentlicht werden, indem man den Status über Schnellbearbeitung auf „Veröffentlicht“ setzt. Man kann aber auch eine Veröffentlichung in der Zukunft festsetzen. Dafür in der Beitragsübersicht beim Beitrag auf Schnellbearbeitung gehen. Dort Datum und Uhrzeit (in der Regel 7 Uhr) einstellen, zu der veröffentlicht werden soll und „aktualisieren“ anklicken. Danach den Status händisch auf „geplant“ setzen.
- Für den Fall, dass nach der Veröffentlichung noch Korrekturen nötig werden, oder falls für die Zukunft weitere Aktionen vorgemerkt werden (z.B. die Verlinkung zu einem noch nicht veröffentlichten Beitrag), wird in der Artikel-Übersicht der Status „Korrektur nach Veröffentlichung“ gesetzt und eine entsprechende Anmerkung notiert.
3. Qualitätssicherung und Pflege der Seite
3.1 Checkliste
- Alle Bilder haben Bild-Credits inkl. Beitragsbild und sind mit Klick vergrößerbar?
- Vollständige Sätze in Bildunterschriften oder Tabellen haben einen Punkt am Ende?
- Der alternative Text für das Bild erklärt knapp aber vollständig und verständlich nicht-sehenden Menschen den Bildinhalt?
- Das „Inhaltsverzeichnis“ heißt nicht mehr „Table Of Contents“, ist eingeklappt und berücksichtigt ggf. nur die wichtigste Überschriften? Sind dort die Aufzählungspunkte entfernt wenn die Überschriften nummeriert sind?
- Externe Links (= nicht-WWUB-Links) werden in einem neuen Fenster geöffnet und sind ggf. mit der „Relation/rel“ „noopener“ versehen (Sicherheitsgründe/Good practice; eine Angabe ist nicht immer möglich und wird z. T. bereits automatisch gesetzt)?
- Haben alle Beiträge einen passenden Exzerpt-Text?
- Lange Links sind nicht im Klartext (mit https://…) sichtbar (nur in Ausnahmefällen)?
- Sind Beiträge mit der Kategorie „Unterstützungsangebote“ auch mit dem Schlagwort „Unterstützungsangebote“ versehen (bei „Tools“ ist es optional, bitte ggf. auch überprüfen)?
3.2 „Aktuelles & Veranstaltungen“ auf der Startseite
Unter Design > Widgets können die Einträge für Aktuelles zeitgesteuert vorgenommen werden. Es sollten nur 4–5 Einträge zur Zeit zu sehen sein.
Achtung: Die Einträge (jeweils ein Block „Absatz“) müssen sich innerhalb des Blocks „Gruppe“ befinden!
3.3 Bereich „Vorgestellt“ auf der Startseite
Über die Vergabe der Kategorie „vorgestellt“ werden bis zu 3 Beiträge unter der Überschrift auf der Startseite dargestellt.
3.4 Schlagwort-Redaktion
Schlagworte sind in der Schlagwortwolke zu sehen und unter Beiträge > Schlagwörter zu bearbeiten (sowie in den Beiträgen, z. B. unter „Schnellbearbeitung“).
- Schlagworte durchsehen (hier sind bis zu 100 Schlagworte dargestellt: Alle Schlagworte) und evtl. Doppelungen und ggf. Schlagworte mit Tippfehlern korrigieren und zusammenführen (um Beiträge aufzurufen, denen bestimmte Schlagworte zugewiesen wurden, auf die Ziffer klicken)
- zu spezifische (z. B. „Chat.AI“) und zu allgemeine (z. B. „Lernen“) Schlagworte entfernen (Beiträge sollten dabei dennoch 2–4 Schlagwörter, in Ausnahmefällen mehr, enthalten)
- Schlagwörter, die nicht verwendet werden (Anzahl: 0) überprüfen, ob diese gelöscht werden können
Im Zweifel verwenden wir Schlagworte in der Mehrzahl, also z. B. „Workshops“ statt „Workshop“, aber nicht „Veranstaltungsplanungen“ („Veranstaltungsplanung“ ist bereits ‚umfassend‘).
3.5 Seiten auf fehlerhafte Links überprüfen
Mindestens 1x/Monat sollten alle Links auf der Seite überprüft werden. Dies kann über folgenden Link geschehen (in Tools dieser Art die Startseite eingeben: https://blogs.uni-bremen.de/wissenswert/):
W3C Link Checker (Das Tool ist eher unübersichtlich, liefert aber viele Ergebnisse und überprüft auf interne Links. Es fehlt die Anzeige der Herkunftsseite/Referrer. Eine )
Alternativen (müssen noch weiter auf Zuverlässigkeit/Umfang getestet werden):
- Ahrefs (kann man direkt nach Captcha loslegen)
- brokenlinkcheck.com
- deadlinkchecker.com
Anforderungen
- Suche nur mit exakter URL blogs.uni-bremen/wissenswert/ (damit nicht alle Blogs durchsucht werden, nur WWUB)
- keine Begrenzung in der Tiefe der Seitenstruktur/URL-Struktur
- findet auch defekte interne Links
- zeigt möglichst Herkunftsseite an
- findet ggf. auch nicht optimale Weiterleitungen
- möglichst Ausführen direkt mit Klick auf einen Link
3.6 Andere Autor*in zuweisen
Über die Schnellbearbeitung können in Beiträge und Seiten die*der Autor*in gewechselt werden (1. neue Person zuweisen, 2. alte Person löschen). Für alle Beiträge und Seiten sollte aktuell (8/2025) „Christoph“ (Nutzer „WWUB“) eingetragen sein!
3.7 Statistik/Web-Analyse
Seit 1.09.25 (Abend) ist die Analyse-Software „Matomo“ zur Nutzenden-Statistik auf den Seiten aktiv. Bitte schließt euch von der Erfassung aus, damit wir interne Zugriffe möglichst nicht erfassen. Dies geht per Haken ganz unten im Impressum (müsste noch in Datenschutz umziehen, aber da haben wir bisher auf die Uni-Seiten verlinkt).
Eingeloggte Nutzende werden von der Statistik automatisch ausgeschlossen. Setze den Haken dennoch und kontrolliert zwischendurch, ob der Haken noch aktiv ist.
Die Berichte können unter Matomo Analytics > Berichte (u. a.) aufgerufen werden (müsste auch für Redakteur*innen klappen).
4. Dokumentation von Layout, Gestaltung, Technik, bekannte Probleme
Viele Anpassungen der Seite wurden von Fadri Bischoff (fadri@uni-bremen.de) per CSS-Code unter Design > Customizer > Zusätzliches CSS vorgenommen.
Einige Dokumente zu Einstellungen und weitere Arbeits-Dokumente finden sich unter: \Nextcloud\Wissensbasis\Technik\.
4.1 Startseite, Kategorie- und Unterkategorie-Seiten
- Kategorien im Kategorien-Filter im Post-Grid-Block (‚Kacheln‘ mit Übersicht aktueller Beiträge) können erst ausgewählt werden, wenn die Kategorie mindestens einmal einem Beitrag zugewiesen wurde.
4.2 Exzerpt-/Teaser-Text („Textauszug“)
- in Beitrags-Kacheln: Block Post Grid > General > Content > „Max number of words in excerpt“. Nach mehr als 55 Worten wird nicht mehr Text in der Kachel angezeigt.
4.3 Layout
[To-do FB: aktualisieren, könnte nicht mehr aktuell sein]
- Kachelbild von Block „Post Grid“ hat 4:3 maximal 504 x 378 px (?)
- Site Layout: „Full width“ für breite Header/Footer
- Container Layout
- Breite: 1550 px
- „Narrow“ für schmale Zeilenbreite von ca. 80 Zeichen (Barrierefreiheit/Lesbarkeit),
Breite: 750 px
- Font
- Zeichenabstand: .87
- line-height 1.65
4.4 Menü
Icon zu Menüpunkt hinzufügen
- Design > Menüs > Menü-Eintrag aufklappen > Astra Menu Settings
- Größe/Abstand: Size: 38 px, Icon Spacing: 12 px
Menü für schmale Bildschirme (Tablet/Smartphone)
Für schmale Bildschirme ist ein separates ‚Off-Canvas-Menü‘ angelegt, welches sich vom Hauptmenü unterscheidet (vgl. Design > Menüs).
Der Link zu „Aktuelles …“ in diesem Menü geht auf die ID „#block-60“. Sollte sich die Block-ID ändern (siehe HTML-Quellcode), muss dieser Link angepasst werden.
Footer
Um den Footer zu bearbeiten, geht man folgendermaßen vor:
Customizer –> Footer –> Footermenue –> dann Mauszeiger auf den zu bearbeitenden Abschnitt, es erscheinen ein oder mehrere Stiftsymbole. Auf das entsprechende Symbol klicken.
Nach der Bearbeitung nicht vergessen: Oben links auf „Veröffentlichen“ klicken!
Updates
Wichtig! Die zentralen Plugins Astra Pro/Spectra Pro können in Multisite-Umgebungen lt. Support automatisch aktualisiert werden. Dies funktioniert jedoch in den UBlogs aus unbekannten Gründen nicht. Daher gilt bis auf Weiteres folgendes Verfahren:
- 1x im Monat überprüfen, ob es sicherheitsrelevante Updates (oder Updates mit ggf. wichtigen Funktionserweiterungen/relevanten Problembehebungen) gibt unter https://wpastra.com/whats-new und https://wpspectra.com/whats-new
- wenn ja: Updates für „Astra Pro“ und „Spectra Pro“ runterladen (ZIP) unter https://store.brainstormforce.com/account/ (Zugangsdaten s. SKILL-KeePass)
- beide ZIP-Dateien an Oliver Oster senden und um Update bitten (z. B. per Chat)
Zum Quartalswechsel oder mindestens halbjährlich sollten Updates an Oliver Oster gesendet werden, unabhängig von der Relevanz der Updates (zur Sicherheit).
Mehrsprachigkeit
Sprachdateien übersetzen (hier: Astra)
Als Sprache ist „Deutsch (Sie)“ (= „formal“) festgelegt.
siehe: https://wpastra.com/docs/astra-poedit-translation/
mit Peoedit: https://poedit.net/download
Sprachcodes:
https://wpastra.com/docs/complete-list-wordpress-locale-codes
Deutsch (Sie) ^= de_DE_formal (vgl. https://zeiller.eu/wordpress-deutsch-sie-localization-de_de_formal/ )
=> Dateiname: de_DE_formal.mo
Für die Übersetzung der Lesezeit oberhalb des Beitrags-Inhaltes musste die Übersetzung in der Datei /wp-content/plugins/astra-addon/languages/astra-addon-de_DE_formal.mo übersetzt werden.
Um die Suchfunktion im Frontend zu übersetzen („Search…“ -> „Suche…“) musste jedoch im Customizer in der Suche-Einstellung per Hand übersetzt werden (bei Mehrsprachigkeit vmtl. problematisch).
spätere Übersetzung
Im „Zusätzlichen CSS“ wurden über content:““ deutsche Worte eingefügt. Diese müssten bei einer möglichen späteren Übersetzung der Seite ins Englische mit übersetzt werden (gesteuert vorauss. über eine Klasse „gb-en“ etc.).
technische Einschränkungen
In den UBlogs sind iframes nicht nutzbar. Um Videos aus PuMuKiT einbetten zu können gibt es daher ein MU-Plugin im Hintergrund.
Bekannte Probleme
- Beitragsbilder werden unter Windows (nicht unter MacOS/Safari) unscharf dargestellt, wenn für das Bild im Customizer die Werte für Breite und Höhe mit „Auto“ angegeben werden.
Workaround: Für die Breite den Wert „780 px“ eintragen. (Ggf. an den Support melden, da es ein Fehler zu sein scheint.) - Nutzung vom Größeneinheit „em“ in der Typografie im Customizer: Fließtext verrschwindet, über CSS (mit !important) lässt sich font nicht beeinflussen.