Webrelaunch 2017/18
Aus alt wird neu 2
Was bleibt? Die Struktur Jede Datei Die Inhalte Bilder und Texte sind im neuen Layout übertragen Das Einloggen und die Quick Edit Leiste Die Eingabemasken Die Eingabemasken werden nach Quick Edit aufgerufen, beinhalten jedoch kleine Änderungen Der Workflow Quick Edit - Speichern Ende - Jetzt freischalten 3
Wo wird es einfacher! Navigation Navigationspunkte werden automatisiert mit dem Anlegen von neuen Seiten im entsprechenden Bereich erstellt. Flexmodule Optimierte Flexmodule erleichtern die Gestaltung Bildmaterial Fotos werden in den Webseiten automatisiert skaliert. (Desktop, Mobil) Bild Varianten sind nicht erforderlich 4
Was ist neu? Ansicht Responsive Darstellung für alle Endgeräte Responsive Navigation Punkte der rechten Spalte erscheinen am Seitenende Eingabemasken Flexmodule in den Eingabemasken Ablösung einiger Flexmodule (z.b. kleiner Textblock) Navigationspunkte werden durch Seitentitel H1 neu erstellt Bildmaterial Neues Bildmaterial (MAM Bilderpool - Web Relaunch 2017) Verpflichtende Bildangaben zum Bildautor Hochladen von maximalen Bildbreiten Automatisierte Anpassung von Bildern in den Flexmodulen 5
Responsive Darstellung Smartphone Desktop Tablet 6
Eingabemaske und Flexmodule (bisher) Die Eingabemaske ist im wesentlichen nicht verändert. Die Navigation wird über den Seitentitel in der Eingabemaske angelegt. Einige Flexmodule entfallen, werden aber automatisiert ins neue Layout übertragen. Ggf. sind händische Anpassungen nötig. Neue Module, wie Kontaktbox, Bilderliste und Zitatbox sind hinzugekommen. 7
Eingabemaske und Flexmodule (neu 2018) Die Eingabemaske ist im wesentlichen nicht verändert. Die Navigation wird über den Seitentitel in der Eingabemaske angelegt. Einige Flexmodule entfallen, werden aber automatisiert ins neue Layout übertragen. Ggf. sind händische Anpassungen nötig. Neue Module, wie Kontaktbox, Bilderliste und Zitatbox sind hinzugekommen. Freigabe der Module nach Basis- und Fortgeschrittenen Redaktion 8
Navigationspunkte Durch den Namen des Seitentitels wird dies automatisiert ein Navigationspunkt. Tipp: Sortierung 10, 20, 30 lässt Luft für neue einzufügende Seiten! Durch Vergabe eines alternativen Textes wird der Navigationspunkt wie gewünscht dargestellt. Kurze Navigationpunkte sind von Vorteil! Durch den Wert der Navigation bestimmen Sie die Position. 1 = oben Ansonsten wird alphabetisch sortiert. Soll dieser nicht erscheinen Können Sie ihn durch setzen eines Häkchens ausblenden 9
Neues Bildmaterial im MAM Neues Bildmaterial unter: IMAGES - Bilderpool - Webrelaunch 2017 Weiter zu Hochladen in max. Bildgrößen 10
Hochladen in max. Bildgrößen Breite 800 x Höhe 480px für Standardbilder Breite 1000 x Höhe 350px für Landscape (Panorama) Breite 500 x Höhe 600px z.b. für Portraits Alle Bilder werden ausschließlich über die Breitenangabe skaliert. Sollte ein Bild höher oder kürzer sein, wird es entsprechend verlängert oder gekürzt. Händisches Erstellen von Größenvarianten ist nicht mehr erforderlich. Weiter zu Angaben zum Bildmaterial 11
Angaben zum Bildmaterial Der Bildnachweis muss eingetragen werden. Sie sind verpflichtend! Soweit die Bildautoren in der MAM nicht automatisiert eingetragen wurden gelten für die Kürzel in den Dateinamen folgende Urheber: hw = Foto: Hardy Welsch ts = Foto: Torsten Silz jk = Foto: Jörg Koch vm = Veit Mette js oder FUH= Foto: Jakob Studnar Fotos, die von FernUni-Mitarbeitenden erstellt wurden benötigen keinen Vor- und Nachnamen, sondern nur die Angabe: Foto: FernUniversität (Dateiname mit fu gekennzeichnet) Fotos aus externen Bildmaterialanbietern entsprechend der Geschäftsbedingungen Foto: fotalia, lumina Images Bereits beim Hochladen der Bilder im MAM werden sie aufgefordert Angaben zum Bildnachweiseinzutragen. Diese werden dann in der Webseite übernommen. Weiter zu Fehlermeldung bei fehlenden Angaben 12
Meldung bei fehlenden Angaben Wird diese Eingabe vergessen, erscheint eine Meldung mit Focus auf das nicht ausgefüllte Feld vor dem Beenden des Dokuments. Wird bei der Warnung Abbrechen gedrückt, erhalten Sie die Möglichkeit zu korrigieren. Wird OK gedrückt wird das Dokument ohne Bildnachweis gespeichert ( nicht empfehlenswert!) Weiter zu Alternativtexte 13
Alternativtexte Alternativtexte sind wichtig für Screenreader Rein dekorative Fotos benötigen keinen Alternativtext 14
Beispiel: Rechter Bereich jetzt unten Der untere graue Bereich zeigt, was vorher im rechten Bereich stand. Wir empfehlen einzelne Links passend zu den Themen im Inhalt zu verteilen! 15
Beispiel: Textrahmen (mit Bild) Kleine Bildicons entfallen und farbige Rahmen werden grau. 16
Ergänzende Arbeiten im CKEditor Der Editor wurde erweitert. So ermöglicht er über die rechte Maustaste eine Sprachauszeichnung in englisch und das Erklären von Abkürzungen. Das Ergebnis wird so usabilityfreundlich und screenreadertauglich! 17
Was ist zu tun? Betrachten Überarbeiten Optimieren Die Migration aller Webseiten bringt nicht immer das gewünschte Ergebnis. Vor allem bei älterem Bildmaterial und bei dem Wegfall des rechten Bereichs sind Überarbeitungen erforderlich. 18
Das war s erstmal Wir arbeiten ständig weiter an den Webseiten. Sie können uns helfen die Seiten zu verbessern und freuen uns auf Rückmeldungen. Mail mit URL und Screenshot bitte an: webrelaunch@fernuni-hagen.de Probleme? Wir helfen gerne weiter! webberatung@fernuni-hagen.de 19