Webredaktion

Redakteure der Fachbereiche und Einrichtungen können je nach Kapazität folgende Leistungen in Anspruch nehmen:

  • Allgemeiner technischer Support für die Webseite und die Redakteure der Fachbereiche und Einrichtungen (Fehlerbehebungen etc.)
  • Schulung der Redakteure
  • Verwaltung der Nutzeraccounts
  • Beratung zur Gestaltung von Unterseiten
  • Anlegen und Gestaltung von Unterseiten
  • Erstellen von Mailformularen (Anmeldeformulare etc.)
  • Wiederherstellung gelöschter Seiten
  • Einbindung von Medien
  • Support für den Veranstaltungskalender

Leitfaden Typo 3

Tutorials

Seitenstruktur Back-End

Das Backend besteht aus der Programmierung der Webseite inklusive Festlegung des Designs. Alle Inhalte wie Texte, Bilder und Datenbanken, die später im Frontend zu sehen sind, werden im Backend erstellt und eingespielt. Bitte ändern Sie nichts an den Beispielseiten!

Den Login finden Sie unter: www.hs-magdeburg.de/typo3

Die Grundlegende Navigation innerhalb des Back-Ends wird durch die allgemeine Menüfühurung links und den Seitenbaum realisiert.  In der Menüführung sind neben den Benutzereinstellungen die Menüpunkte „Seite“, „Anzeigen“ und „Liste“ für Redakteure relevant. Der Seitenbaum spiegelt die Struktur der Navigation auf der Webseite wieder und dient zur Auswahl der entsprechenden Unterseite für die Bearbeitugnsprozesse.

Im Menüpunkt Seite können auf der im Seitenbaum angewählten Unterseite Inhaltselemente zur Gestaltung angelegt werden. Dabei kann adäquat zur Darstellung im Front-End die Contentspalte und die Marginalspalte bearbeitet werden. Die Reihenfolge der Datensätze entspricht dabei auch der Reihenfolge im Front-End. Eine Vorschau auf die erstellten Datensätze kann dabei sowohl in einem neuen Tab des Browsers als auch im Menüpunkt Anzeigen dargestellt werden. Hierbei bietet die Oberfläche zudem die Möglichkeit die Anzeige auf verschiedenen Endgeräten zu visualisieren. Dies ist insbesondere zur Überprüfung der Darstellung auf mobilen Geräten wie Smartphones und Tablets sinnvoll. Im Menüpunkt Liste erfolgt hingegen eine Auflistung der Datensätze auf der ausgewählten Seite im Seitenbaum. Diese dient für Redakteure primär zur Darstellung und Bearbeitung von Datenbanken, sowie zur Übersicht über alle angelegten Inhalte auf angewählten Unterseiten.

In ausgewählten Fällen kann das Listenmodul zur Gestaltung und Nutzung spezifischer Funktionen, wie beispielsweise Newsletter und aktuellen News auf der Startseite dienen (Diese Funktionen betreffen jedoch nur einige wenige Redakteure). Neben den Gestaltungsmodulen ist eine Mediendatenbank im Menüpunkt Dateiliste integriert. Hier können Audiovisuelle Medien hochgeladen werden um diese in Inhaltselementen nutzen zu können. Der Seitenbaum wird hierbei durch die Ordnerstruktur der Datenbank ersetzt.  Falls möglich sollten alle Dateien (Bilder, PDFs etc.) immer zuerst im Dateimanager in ein entsprechendes Verzeichnis hochgeladen werden! Werden diese direkt über ein Inhaltselement hochgeladen, sind diese unter Umständen nicht wieder auffindbar und mehrfach hochgeladen. Durch solche Mehrfachuploads wird unnötig Speicherplatz auf den Servern belegt.

Zusätzlich zu den internen Datenbanken existiert eine direkte Anbindung an die Cumulus-Cloud des Zentrums für Kommunikation und Informationsverarbeitung der Hochschule (ZKI). Diese sind an dem gelben Zusatzsymbol am Ordnericon im Dateiverzeichnis erkennbar. Hier werden unter anderem zentral Inhalte wie beispielsweise Mitarbeiterfotos und Dokumente eingepflegt. Bitte wenden Sie sich für einen externen Zugriff oder Uploadmöglichkeiten direkt an das ZKI.

Editor (RTE)

Der Texteditor im Back-End funktioniert nach dem „What You See Is What You Get“-Prinzip. So wird der Inhalt im Editor während der Bearbeitung am Bildschirm annähernd genauso angezeigt, wie es bei der Ausgabe im Front-End aussieht. Hier werden vom Redakteur zur Erstellung einer Seite keine HTML-Programmierkenntnisse gefordert, um notwendige Textformatierungen vornehmen zu können. Dabei ist es wichtig das gegebenenfalls die Formatierung kopierter Inhalte aus Worddokumenten im Editor gelöscht wird, da es sonst zu fehlerhaften Darstellung im Front-End kommen kann. Zudem ist es wichtig in allen Inhaltselementen eine Überschrift zu setzen. Sollte dies in der Darstellung nicht gewünscht sein, so sollte im Menüpunkt „Typ“ die Überschrift ausgeblendet werden. Eine Überschrift wird immer als Seitentitel für den angelegten Datensatz im Listenmenü ersichtlich sein und erleichtert dabei die Übersichtlichkeit über alle Datensätze. Ist keine Überschrift angelegt, so erscheint es als „Kein Titel“ und lässt somit nicht direkt einem Inhaltselement zuordnen.

Des Weiteren bietet der Editor Möglichkeiten Bilder hochzuladen, bzw. Galerien zu erstellen, sowie den Hintergrund des Inhaltselementes im Reiter Erscheinungsbild anzupassen. Ebenso können spezielle Zugriffsrechte für das Element festgelegt werden. Dadurch wird ein Login auf der Webseite notwendig um diese Inhalte sehen zu können. Hierfür sind bereits verschiedene Nutzergruppen zur Auswahl angelegt.

Standartelemente: Einfache Inhaltsseiten mit Text und Bildern

In der Kategorie „Typischer Seiteninhalt“ werden Basis-Inhaltselemente für, Texte, Bilder, Tabellen und Bild-Text-Kombinationen angeboten. Diese werden als einfaches Inhaltselement auf einer ausgewählten Unterseite angelegt. Die Gestaltung erfolgt dabei komplett über den Editor.

Bei Inhaltselementen können zusätzlich verschiedene Hintergründe ausgewählt werden: Graue Box mit Überschrift, Graue Box ohne Überschrift, Standard/Hell und ein Transparenter Hintergrund. Freistehende Textelemente sollten dabei immer den Standardhintergrund behalten. Nur bei besonderer Herausstellung der Inhalte sollte ein Grauer Hintergrund ausgewählt werden. Ebenso sollten Überschriftsgrößen hierarchisch auf der Seite angeordnet werden. So sollte nur eine Überschrift die Größe H1 haben und alle weiteren folglich kleiner. Standartmäßig ist hier die Größe H2 eingestellt.

Die nächsten Kategorien „spezielle Elemente“ und „Formulare“ sollte möglichst nur zur Einbindung von Medien, zur Erzeugung von Downloads auf der ausgewählten Unterseite, sowie ggf. für Trennlinien in der Gestaltung des Front-Ends genutzt werden.

Reine HTML-Elemente, sowie Mail-Formulare sollten nur in Rücksprache mit der zentralen Werbeaktion der Pressestelle genutzt werden!

Flexible Inhaltselemente: Akkordeon-Container

Das flexible Inhaltselement Akkordeon eignet sich beispielsweise für kleinere Übersichtsseiten über verschiedene Inhalte, sowie Aufzählungen mit ausführlichen Zusatzinformationen. 

Akkordeons sind standardmäßig mit weißem Hintergrund eingestellt, sollten insbesondere im Marginalbereich jedoch mit einem grauen Hintergrund dargestellt werden. Zusätzlich können Voreinstellungen getroffen werden, ob das Element aufgeklappt oder geschlossen dargestellt werden soll.

Flexible Inhaltselemente: Tab-Container

Zur Organisation und Strukturierung umfassender Inhalte kann das Containerformat Tabs genutzt werden. Ähnlich wie ein Browsertab strukturiert es Inhaltselemente in der Contentspalte und kann gegebenenfalls auch mit Akkordeon-Container kombiniert werden. Dabei sind Akkordeons innerhalb eines Tabs die einzig zulässige Verbindung dieser Containerformate.

Das Anlegen eines Inhaltselements des Typs „Tab“ entspricht immer genau einer Spalte. Für mehrere Spalten müssen konsekutiv mehrere Inhaltselemente angelegt werden Wird ein anderes Inhaltselement außerhalb des Containers zwischen zwei Tabcontainern erstellt, werden die Tabs nicht korrekt angezeigt.

Flexible Inhaltselemente: 2-Spalter

Als weiteres Containerformat für Übersichtsseiten steht das Inhaltselement „Layout - 2 Spalten“ bereit. Hierbei werden flexible Boxen generiert, welche sich in ihrer Größe automatisch dem Inhalt anpassen. Dabei ist zu beachten, dass möglichst eine gerade Anzahl an Inhaltselementen im Container angelegt werden, um eine möglichst einheitliche Darstellung zu ermöglichen. Im Sinne der Übersichtlichkeit und einer ansprechenden Gestaltung, empfiehlt es sich nicht mehr als drei Zeilen, bzw. 6 Inhaltselemente, im 2-Spalter anzulegen.

Gestattet ist die Modulkombination von 2-Spaltern innerhalb eines Tabs oder eines Akkordeons. Ebenfalls ist das Containerformat „Layout – 3 Spalten“ im Back-End vorhanden, welches jedoch nicht genutzt werden soll!

Anlegen englischer Inhalte

Inhalte der Webseite können über die Spracheinstellungen im Front-End nur auf Englisch angezeigt werden, wenn dafür die Übersetzten Inhalte im Back-End hinterlegt werden:

1. Neue Seitenübersetzung anlegen

  • Lokalisierungsansicht öffnen und neue Seitenübersetzung in Englisch anlegen
  • Englischen Seitentitel eingeben, speichern und schließen

2. Auf Deutsch angelegte Inhalte übersetzen und eingeben

  • Kopie für Übersetzung anlegen, auswählen und im Kontextmenü des Übersetzungselements „Bearbeiten“ wählen
  • Englischen Text und Titel eintragen, speichern und schließen (auch in Tabs und Akkordeons möglich)

Individueller Content pro Sprache

Standardmäßig sind die bereits angelegten Inhalte so eingestellt, dass sie nur in der deutschen Sprachversion ausgegeben werden, es sei denn es wird wie beschrieben eine Übersetzung angelegt. Sollen Elemente jedoch nur in der englischen Version ausgegeben werden, muss wie folgt vorgegangen werden:

  • Neues Inhaltselement hinzufügen
  • Im Dropdown „Sprache“ die Auswahl auf Englisch setzen
  • Text und Titel eingeben, Formatierungen machen, speichern und schließen

Die Flagge vor dem Element zeigt an, in welcher Sprachversion das jeweilige Inhaltselement ausgegeben wird

Anlegen von News

Achtung: News werden nicht auf der Seite „Single-News“ erstellt – hier ist lediglich das Plugin hinterlegt, welches die News ausspielt. Im Ordner NEWS im Seitenbaum finden Sie die einzelnen Unterordner für Fachbereiche und Einrichtungen. Die News werden im jeweiligen Ordner für IHRE Einrichtung/Fachbereich angelegt.

  1. Öffnen Sie IHREN News-Ordner
  2. Klicken Sie im Editor-Bereich das Symbol Datensatz erstellen. Es öffnet sich die Maske zum Erstellen einer News
  3. Titel: Geben Sie den Titel des News ein
  4. Untertitel: Geben Sie den Anreißer für die News ein. Der Untertitel ist das, was erscheint, wenn man das jeweilige Akkordeon im News-Plugin aufklappt. Der Untertitel sollte maximal 250 Zeichen lang sein. Der Rest wird abgeschnitten - Bitte auf keine Links im Anreißer verwenden!
  5. Text: Geben Sie hier den eigentlich News-Text ein.  Nur der Titel und das, was im Text-Bereich stehen, werden auf der News-Detailseite angezeigt. Soll der Anreißer/Untertitel auch hier erscheinen, muss er nochmals eingefügt werden.
  6. Abschließend News speichern und falls möglich Seiteninhaltscache löschen, damit die News gleich im Front-End angezeigt wird (Zugriffsrechteabhängig!).

 

Sie können im Textbereich Formatierungen vornehmen und Links einfügen. Hier steht allerdings nur ein Auszeichnungsformat (blau, unterstrichen) zur Auswahl. Bitte achten Sie beim Einfügen aus Word-Dokumenten darauf, die vorhanden Formatierungen mit dem Symbol  zu entfernen!

 

News-Kategorie einstellen

Damit eine News an der richtigen Stelle ausgespielt wird, muss ihr eine Kategorie im Reiter „Categories & Relations“ zugewiesen werden. Üblicherweise ist, sofern Ihre Einrichtung/Ihr Fachbereich nur über eine News-Kategorie verfügt, dies bereits voreingestellt. Sind mehrere Kategorien zu vergeben, nutzen Sie bitte den Reiter „Categories & Relations, um zu prüfen bzw. festzulegen, welcher Kategorie die News zugeordnet ist.

 

News terminieren und Veröffentlichung planen

Standardmäßig wird der Beitrag sofort veröffentlicht. Durch Eingabe eines in der Zukunft liegenden Datums können Beiträge aber auch vorterminiert werden. Im Reiter „Access“ können Sie unter „Start“ das Veröffentlichungsdatum für den Beitrag einstellen.

 

Archivierungsdatum einstellen

Das Einstellen eines Archivierungsdatums ist für zeitlich begrenzt gültige News sinnvoll und erwünscht (Veranstaltungen, Fristen...). Im Reiter „Special“ können Sie das Archivdatum einstellen.

 

News freischalten/verbergen

News sind nach dem Anlegen standardmäßig verborgen geschaltet, also im FE nicht sichtbar. Sie können diese Einstellung gleich beim Editieren ändern, indem Sie im Reiter „Allgemein“ die Checkbox „Verbergen“ deaktivieren. In der Übersicht Ihrer News können Sie auch nachträglich per Klick auf das Dokumentensymbol und Auswahl der Option „Verbergen“ News nicht sichtbar schalten oder wieder aktivieren.

 

Bilder zur News hinzufügen

Die einzufügenden Bilder müssen jedoch vorab in die Dateiliste hochgeladen werden – bitte in IHREN entsprechenden Ordner. Zum Einfügen von Bildern gibt es zwei Varianten mit unterschiedlichem Resultaten. Bitte beachten Sie, dass die Ausgabe im Editor nicht mit der Ausgabe im Front-End übereinstimmt. So können beispielsweise Umbrüche etc. im FE anders verlaufen als im Editor! Es empfiehlt sich meist, das Bild Umfließen zu lassen (Einstellung: links) und dann einen entsprechenden Abstand zum Text einzustellen (5 bis 10 Px). Bitte fügen Sie nach Möglichkeit auch einen Alternativtext (Screenreader) hinzu.

1. Einfügen von Bildern im Text-Bereich (Bild wird direkt im Text eingefügt und kann größenmäßig angepasst werden)

  •  Wählen Sie im Editor die Stelle, an der das Bild eingefügt werden soll und klicken Sie das Symbol  – Bild einfügen.
  • Sie können dort ein neues „flexibles“ Bild einfügen, welches automatisch auf eine Breite und Höhe von maximal 300 x 300 Px skaliert wird.
  • Alternativ kann in Ausnahmefällen ein größeres „normales Bild” eingefügt werden. Dieses Bild darf maximal 640 x 680 Px groß sein! Wählen Sie im Verzeichnisbaum dann das entsprechende Bild aus.


2. Einfügen von Bildern über den „Media“-Reiter (Bild wird zwischen Titel und Text angezeigt, hierbei ist ein Format von 16:9 und eine Mindestauflösung von 800x450 Px einzuhalten, da es sonst zu Verzerrungen des Bildes kommt).

  •  Wählen Sie im Reiter „Media” durch Klick auf das Symbol  "Dateien durchblättern" aus dem Dateibaum das entsprechende Bild aus und geben Sie einen Alternativtext für das Bild (und sofern nötig eine Bildunterschrift)

Gestaltungsvorschriften

Gestaltung von Inhaltselementen

Allgemeine Gestaltungshinweise

  • Seitenüberschriften müssen H1 sein
  • Hintergrund für Standard-Text soll weiß sein (Standard), bitte nur besonders wichtige Textteile mit grauer Farbe hervorheben
  • Der Hintergrund von Akkordeons in der Marginalspalte soll grau sein, Akkordeons in Marginalspalte in der Regel aufgeklappt
  • Der Hintergrund für Akkordeons in Contentspalte soll weiß sein (Standard)
  • Akkordeons in der Contentspalte sollten in der Regel zugeklappt sein
  • Kontaktangaben in der Marginalspalte sollten immer im Format (Akkordeon, darin Text-Bild-Element) sein.
  • Hintergrund für Teaser soll weiß sein (Standard)
  • Format von Linkzeilen Links (mehr erfahren) ist immer „blauer Pfeil“

Einbindung von Medien / Bildern

  • Bilder immer über die Dateiverwaltung in der linken Spalte verwalten
  • sollen Bildern über die halbe Content-Breite (400x225) dargestellt werden, bitte die Bild-Text/Bild-Module immer 2-spaltig anlegen! (Außer Mitarbeiter-Kontakte)

Bildformate:

  • 16:9 (400x225 Pixel) in der Marginalspalte und in den Teasern
  • 16:9 (800x450 Pixel) im Contentbereich
  • 1:1 (140x140 Pixel) für Mitarbeiterbilder

Erlaubte Kombinationen von flexiblen Inhaltselementen

  • Akkordeon im Tab (Akkordeon mit grauem Hintergrund)
  • 2-Spalter im Tab und 2-Spalter im Akkordeon

Nicht erlaubte Kombinationen und Anwendungen von flexiblen Inhaltselementen

  • 3-Spalter
  • Tabs und 2-Spalter in der Marginalspalte
  • Tabs in Akkordeons, Akkordeons in Akkordeons, Tabs in Tabs

Hinweise für gendergerechtes Texten

Texte müssen lesbar bleiben, es dürfen nur den gültigen Rechtschreibregeln entsprechende Schreibweisen verwendet werden!  Das heißt, bitte kein Binnen-I, keine Schrägstriche, Unterstriche oder Sternchen verwenden.

Abwandlungen wie Student(in), StudentIn, Student_in, Student*in, Student/in sind auf den Webseiten zu vermeiden!

In Abhängigkeit von der angesprochenen Personengruppe sollten geschlechtergerechte Bezeichnungen verwendet werden (für Frauen: Studentinnen, Mitarbeiterinnen; für Männer: Studenten, Mitarbeiter). Sollen geleichzeitig Männer und Frauen angesprochen bzw. bezeichnet werden, kann die Fokussierung auf ein Geschlecht durch folgende Formulierungen umgangen werden:

Doppelnennung/Paarformel

Bitte aufgrund der Lesbarkeit der Texte Paarformel sparsam verwenden!

  • Mitarbeiterinnen und Mitarbeiter
  • Professorinnen und Professoren
  • Studentinnen und Studenten

Wer statt er (auch: alle, diejenigen, jene)

  • Statt: Teilnehmer erhalten eine Bestätigung... – Wer am Kurs teilnimmt, erhält eine Bestätigung
  • Statt: Die Studierenden sind berechtigt... – Wer studiert, ist berechtigt...

Passive Formulierungen

Bitte aufgrund der Textverständlichkeit Passivkonstruktionen sparsam verwenden

  • Statt: Teilnehmer erhalten eine Bestätigung... – Teilnahmebestätigungen werden ausgestellt
  • Statt: Referenten sind... – Es reden Frau X und Herr Y

Neutrale Begrifflichkeiten

  • Statt Mitarbeiter – Beschäftigte
  • Statt Leiterin/Leiter – Leitung
  • Statt Dekan/Dekanin – Dekanat
  • Statt Ingenieursmangel – Fachkräftemangel
  • Statt Absolventen – Ehemalige, Alumni
  • Statt Studentenleben – Campusleben, studentisches Leben

Mehrzahl bilden

  • Statt Teilnehmerin/Teilnehmer – die Teilnehmenden, die Anwesenden, die Zuhörenden
  • Statt Studieninteressierte/ Studieninteressierter – die Studieninteressierten
  • Statt Hochschulangehörige/Hochschulangehöriger – die Hochschulangehörigen
  • Statt Professoren/Professorinnen – die Lehrenden

Support und Schulung

Beantragung Redakteurszugang

Um auf die Benutzeroberfläche der Hochschule zugreifen zu können, wird zunächst ein Account benötigt, welcher bei der zentralen Webredaktion der Pressestelle beantragt werden kann.

Bitte ändern Sie ihr Passwort direkt bei dem ersten Login im Menüpunkt „Benutzerwerkzeuge-Einstellungen“.

Im Regelfall haben Redakteure nur Zugriff auf einen spezifischen Teil der Webseite (Institutsseite etc.) und nicht auf die volle Hochschulwebseite. Zur ersten Orientierung werden Schulungen durch die zentrale Webredaktion angeboten. Termine und weitere Informationen finden Sie auf der Unterseite der Pressestelle. Ebenso ist auch eine Beispielseite im Back-End freigegeben, auf der die verschiedenen Inhaltselemente und deren Implementierung aufgezeigt und nachempfunden werden können

Typo3-Schulung

Termine werden zeitnah veröffentlicht...

Kontakt

Webredaktion
Daniel Agha Amiri

Tel.: (0391) 886 41 18
Fax: (0391) 886 41 45
E-Mail: daniel.agha-amiri@hs-magdeburg.de

Besucheradresse: Haus 4, Raum 1.06.1

Hintergrund Bild