Internet Service

SEO Regeln: Worauf muss ein Web-Autor achten?

2019-10-24T11:16:01+02:00

Wenn Sie Ihre Seiten für Suchmaschinen optimieren möchten, um bei Suchergebnissen besser platziert zu werden, gibt es einige Dinge, die Sie beachten müssen.

Wichtige Kriterien für eine gute Suchmaschinen-Platzierung sind beispielsweise die richtige Pflege von:

Metadaten
Texte
Verlinkungen
Bilder
Sitemaps
https
Datei- und Ordnernamen
Mobilfähigkeit

Wenn man Änderungen an den Metadaten und/oder Inhalten der Webseiten durchführt, kann es durchaus 14 Tage dauern bis diese von den Suchmaschinen aufgegriffen werden.

Metadaten

Was ist was?

Nachfolgend werden die einzelnen Funktionen der Metadaten beschrieben, wie wichtig sie für Suchmaschinen sind und wo sie gegebenenfalls auf der Webseite oder im Suchergebnis auftauchen.

Page-Title:

Der Page-Title ist der Seitentitel, den Suchmaschinen als Titel im Suchergebnis anzeigen.
Der Seitentitel ist das wichtigste Element für die Suchmaschinenoptimierung.
Auf der Website selbst ist der Page-Title in der Regel nur im Browser-Tab zu sehen.
Der Page-Title sollte immer mit dem Zusatz " - Universität Bielefeld" stehen. Dieser Zusatz wird im Roxen – Backend automatisch hinzugefügt.
Für die Zeichenlänge (inkl. Leerzeichen und Zusatz) sind bis zu 56 Zeichen optimal. Wenn nicht anders möglich sind auch bis zu 70 Zeichen zulässig.

Meta-Description:

Die Meta-Description wird von Suchmaschinen für das Textsnippet im Suchergebnis genutzt.
Inhaltlich liefert die Meta-Beschreibung ergänzende Informationen zum Page-Title.
Für die Zeichenlänge sind bis zu 128 Zeichen optimal. Wenn nicht anders möglich sind auch bis zu 160 Zeichen zulässig.

Keywords:

Keywords sind für Suchmaschinenoptimierung kaum noch relevant.
Im Feld "Keywords" können aber trotzdem Stichwörter eingegeben werden, die für die interne Suche von Roxen relevant sein könnten.
Bitte kein Keyword-Stuffing betreiben: d.h. keine Stichwörter hinzufügen, die eigentlich keinen Bezug zu der Seite haben. Solche Webseiten werden von Google negativ bewertet und aus der Suche entfernt.
Weitere Information dazu: https://www.cnet.com/news/google-blacklists-bmw-de/

H1-Überschrift:

H1 ist in der Regel die größte sichtbare Überschrift auf einer Website.
Die H1 ist für die Suchmaschinenoptimierung nicht ganz so relevant wie der Page-Title, sollte aber nach Möglichkeit das wichtigste Suchstichwort enthalten.
Pro Seite sollte es nur jeweils eine H1 geben.

Sollten Page-Title und H1 identisch sein oder sich unterscheiden?

Der Page-Title ist für Suchmaschinen ausgelegt. Der/die Nutzer_in befindet sich noch nicht auf der Website, sondern soll dorthin finden.
Die H1 hingegen richtet sich an die Nutzer_innen, die sich schon auf der eigentlichen Website befinden. Daher ist es oft sinnvoll, wenn Page-Title und H1 voneinander abweichen.
Die meisten SEO-Experten empfehlen, dass sich Page-Title und H1 unterscheiden sollten - wichtig ist dabei jedoch das wichtigste Suchstichwort: Es sollte möglichst sowohl im Page-Title und in der H1 stehen.
Aber: Es ist auch nicht falsch, wenn H1 und Page Title identisch sind, es ist nur nicht völlig optimal.
Ein Beispiel für eine Seite, auf der sich Informationen zur Rückmeldung befinden. Das wichtigste Suchstichwort ist "Rückmeldung".
- H1: "Rückmeldung"
- Page-Title: "Informationen zur Rückmeldung - Universität Bielefeld"
- Meta-Description: "Sie möchten sich für das nächste Semester zurückmelden? Hier finden Sie alle Infos zur Rückmeldung und dem Semesterbeitrag."

Wo wird was im Backend gepflegt?

In der rechten Seitenleiste im Roxen-Backend unter dem Reiter "Metadata" werden die Metadaten gepflegt:
Das Feld "Title" wird bei der Erstellung der Webseite automatisch von Roxen mit dem Ordnernamen belegt und in Menüs angezeigt.
Per Default ist dieser Eintrag ebenfalls der "Page Title" und somit für Suchmaschinen von großer Bedeutung.
Über die PageOptions-Komponente ist es Möglich den Page-Title der Metadaten zu überschreiben, falls der Title zum Beipiel zu Gunsten eines kürzeren Menüeintrags abweichen soll.
Standardmäßig wird die H1-Überschrift über die Cover-Komponente im Titel des Headerbildes angegeben.
Wenn kein Headerbild verwendet wird, wird die erste Überschrift im Contentbereich als H1 ausgewiesen.

Tipps für den Aufbau Ihres Portals

Nach Möglichkeit sollten die Seiten auf den ersten beiden Strukturebenen optimierte Page-Title und Meta-Descriptions enthalten (mindestens aber auf der ersten Strukturebene).
Grundsätzlich ist es sinnvoll auch die tieferen Portalebenen betreffend Page-Title und Meta-Description zu optimieren.
Für Page-Title und Meta-Description ist es sinnvoll, sich in suchende Nutzer_innen hineinzuversetzen.
Ein Beispiel: Die wenigsten Studieninteressierten werden "Universität Bielefeld Bachelor Baukasten" bei Google eingeben, weil sie in der Regel noch gar nicht wissen, dass es den Bachelor-Baukasten gibt. Für Page Title und Meta-Description ist es also sinnvoller auf Suchstichworte wie "Was soll ich studieren?" oder "Bachelor Studium Bielefeld" hin zu optimieren.
Für Längenbegrenzungen und für eine Vorschau der angestrebten Suchergebnisse kann das Sistrix SERP-Tool verwendet werden: https://app.sistrix.com/de/serp-snippet-generator

Texte

Ihre Texte sollten sinnvoll strukturiert und mit Zwischenüberschriften versehen werden. Dazu gibt es auch zahlreiche Anleitungen im Internet, die im Hinblick auf SEO-konformes Schreiben ausführlichere Tipps geben (Zeichenzahl, Keyword-Dichte, richtige Überschriftensetzung, etc.)
Die richtigen Schlagworte sollten am besten mehrfach im Inhalt der besagten Webseite auftauchen (bitte sinnvoll einsetzen).
Schlagworte in Überschriften werden dabei als besonders wichtig gewertet.

Verlinkungen

Aussagekräftige Link-Titel vergeben.
Nicht: "Hier finden Sie den Veranstaltungskalender" - Sondern: "Zum Veranstaltungskalender" (oder ähnlich).
Mit "nofollow" kann angegeben werden, wenn ein Link nicht gecrawlt werden soll.
Verlinkungen auf die eigene Webseite: Google bewertet auch wie oft auf eine Webseite von außerhalb verwiesen wird.

Bilder

Image alt-Tags sollten immer dann gepflegt werden, wenn das Bild tatsächlich inhaltlichen Bezug hat. Bei rein dekorativen Bildern, muss kein alt-Tag gesetzt werden. Der alt-Text ist nicht nur für Suchmaschinen relevant, sondern auch für die Barrierefreiheit (Screenreader etc.). Es sollte kurz beschreiben, was auf dem Bild zu sehen ist und nach Möglichkeit das wichtigste Suchstichwort enthalten.
Image title-Tags werden angezeigt, wenn der Nutzer mit der Maus über ein Bild hovert. Da diese title-Tags aber für Suchmaschinen nicht wichtig sind, muss dahingehend nicht zwingend optimiert werden.

Sitemaps

Wenn keine ausreichende Verlinkung über Menüs stattfindet, sind zur Auffindung aller wichtigen Seiten zusätzliche Sitemaps sinnvoll.

https

Die https-Fähigkeit der Seiten wird von Suchmaschinen ebenfalls bewertet.
Alle Seiten unter uni-bielefeld.de werden per https ausgeliefert. Achten Sie daher auch darauf, dass Sie Links auf älteren Seiten dahingehend korrigieren.

Datei- und Ordnernamen

Die Datei- und Ordner-Namen sollten beschreibend sein, das heißt den Inhalt der Seite widerspiegeln und leicht lesbar sein. Die Seite sollte beispielsweise nicht "seite4.xml" etc. heißen.

Mobilfähigkeit

Die Webseite muss für mobile Endgeräte gut erreichbar sein.
Daher sollten Sie darauf achten immer ein aktuelles Template zu verwenden und den Aufbau des Inhalts entsprechend im Auge zu behalten (keine Tabellen als grafisches Gestaltungselement, etc.).

robots.txt

Webseiten, die nicht gecrawlt werden sollen (die also nicht in Suchergebnissen von Suchmaschinen auffindbar sein sollen), werden in der robots.txt im Root-Verzeichnis hinterlegt.
Soll eine Ihrer Seiten nicht gecrawlt werden, schreiben Sie uns eine E-Mail an webentwicklung@uni-bielefeld.de

Weiterführende Links auf externe Webseiten

Bestellung von Rechten für Roxen17 über das Prisma-Portal

2019-08-14T12:07:46+02:00

Seit einigen Wochen ist es möglich CMS-Rechte für das neue Roxen17 über das Prisma-Portal (IDM - Identity Management) zu beantragen:
https://prisma.uni-bielefeld.de

Anleitung

Das BITS hat eine ausführliche Anleitung zur Bestellung von Rechten im IDM verfasst:
https://www.uni-bielefeld.de/bits/downloads-anleitungen/Beantragung-von-CMS-Berechtigungen.pdf

Roxen5

Die Beantragung von Rechten für das alte Roxen5 bleibt unverändert:
https://www.uni-bielefeld.de/kommunikation/internet/roxen/index.html

Integration von Blog-Feeds

2018-08-07T14:23:05+02:00

Was sind BIS-Blogs?

Das BIS - Bielefelder Informationssystem - betreibt seit 2009 in enger Kooperation mit der Web-Entwicklung die 'BIS Blogs' als Blogdienst. Folgende Seite soll Ihnen einen Überblick über den Dienst geben:
Einführung in die BIS Blogs

Ein wichtiges Ziel der BIS Blogs ist die Möglichkeit alle Bloginhalte in andere Webseiten integrieren zu können. Die Integration kann in beliebigen Webservern erfolgen, es muss nicht das zentral angebotene Roxen CMS genutzt werden.

Wie funktioniert die Einbindung in Roxen?

Zur Einbindung der Blog-Feeds nutzen wir aktuell jFeed. Das Javascript-Plugin selbst ist recht einfach gehalten, erfüllt aber voll und ganz den Zweck die News aus den Blogs auf den Internet-Seiten der Universität anzuzeigen.

In Roxen wird das Proxy-Modul HTTP Relay verwendet, das ein virtuelles Verzeichnis /ekvv-feed/ für die URL https://ekvv.uni-bielefeld.de/blog/ anlegt. Der Aufruf kann in Roxens data cache zwischengespeichert werden.

Wie kann ich einen Blog-Feed einbinden?

Sie haben bei der Blog-Feed-Integration die Wahl zwischen verschiedenen Anzeigemöglichkeiten.
Beispielsweise können die einzelnen Blog-Beiträge als einfache Listenelemente dargestellt werden, welche auf den jeweiligen Beitrag verlinken, oder als Teaser-Elemente, welche mit Titel, Bild und Text-Anriss in einer Contentbox angezeigt werden.

Der Quelltext zur Feed-Einbindung in Roxen wird auf nachfolgender Internetseite einmal anhand des uni.aktuell-Blogs dokumentiert:
RSS-Feeds einbinden (jFeed)

Bild- und Video-Lightbox-Anzeige

2018-07-17T14:43:25+02:00

Mit dem Fancybox-Plugin lassen sich Bilder, Videos, Maps und andere iFrames in einem Pop-Up-Rahmen anzeigen und im Galerie-Modus nacheinander durchklicken.

Die Scripte für Fancybox sind bereits im Portal-Template 2017 integriert und sofort mit den untenstehenden Code-Schnipseln nutzbar.

So nutzen Sie die Bildanzeige

Legen Sie einfach einen Link mit der Bild-URL an und fügen das Attribut data-fancybox="galerie1" hinzu (der Wert "galerie1" ist optional und beliebig wählbar).

Alle Bilder, die den gleichen Wert bei data-fancybox hinterlegt haben, können in der Lightbox nacheinander durchgeklickt werden.


    <a href="/images/template_2017/kopfbilder/schmaler/bau.jpg" data-fancybox="galerie1"> 
    <img src="/images/template_2017/kopfbilder/schmaler/bau.jpg" alt="Beschreibender Bildtext" width="484" /></a>

So nutzen Sie die Videoanzeige

Die Videoanzeige funktioniert im Grunde genau wie die Bildanzeige, nur dass Sie einen zusätzlichen DIV-Container mit der Klasse "video" anlegen müssen.

Da es nicht möglich ist automatisch ein Vorschaubild aus dem YouTube-Video zu ziehen, müssen Sie selbst ein Vorschaubild erstellen und in Ihrer Roxen-Struktur abspeichern.


    <div class="video">

      <a href="https://www.youtube-nocookie.com/embed/C2H1pNerMrU" data-fancybox="galerie1"> 

        <img src="/kommunikation/internet/cd/images/in-der-unihalle.jpg" alt="Beschreibender Bildtext" width="484" />

        <div class="copyright float-right">YouTube-Video</div>
      </a>

    </div>

Anlegen einer Playlist

Auf diese Weise ist es ebenfalls möglich eine Playlist (Video-Galerie) anzulegen, ohne dass es lange Ladezeiten gibt.

Weitere Informationen dazu und eine Anleitung mit Popup-Beispielen finden Sie auf den Webseiten des Internet Service:
→ Bild- und Video-Popup-Anzeige mit Fancybox

Webseiten-Elemente für mobile Endgeräte anpassen

2018-05-14T15:10:12+02:00

Mit dem 2017er Template sind bereits die meisten Elemente nicht nur für die Desktop-Ansicht, sondern ebenso für die Darstellung auf mobilen Endgeräten angepasst.
Hier finden Sie eine kurze Anleitung wie Sie spezielle eigene Elemente Ihrer Webseite für mobile Endgeräte optimieren oder wie Sie bestimmte Inhalte in Abhängigkeit von der Displaygröße anzeigen oder ausblenden können.

CSS-Anpassungen selbst vornehmen

Um eigene Elemente für verschiedene Endgeräte zu optimieren, kopieren Sie untenstehenden Quellcode, fügen ihn in Ihre eigene Style-Datei ein und passen Ihre Styles entsprechend der hier angegebenen Displaygrößen an:



/* Small screen / tablet / 760px to 991px */

@media (max-width: 991px) {

    ...

}



/* Smaller screen / tablet+phone / 480px to 759px */

@media (max-width: 759px) {

    ...

}



/* Extra small screen / smartphone / 280px to 479px */

@media (max-width: 479px) {

    ...

}

Mobile Klassen verwenden

Sie haben außerdem die Möglichkeit über die Klassen "mobile" und "no-mobile" Einfluss auf die Anzeige von Inhalten auf mobilen Endgeräten zu nehmen.

mobile

Alle Elemente, welche die Klasse "mobile" besitzen, werden bis zu einer Bildschirmgröße von 991px mit display:block angezeigt.
Ab 992px werden diese Elemente mit display:none versteckt.


  <div class="mobile">

      <p>Dieser Inhalt ist nur für mobile Endgeräte sichtbar.</p>

  </div>

no-mobile

Alle Elemente, welche die Klasse "no-mobile" besitzen, werden bis zu einer Bildschirmgröße von 991px mit display:none versteckt.
Ab 992px werden diese Elemente mit display:block angezeigt.


  <div class="no-mobile">

      <p>Dieser Inhalt ist nur für Bildschirme ab einer Größe von 992px sichtbar.</p>

  </div>

In Kombination mit der Klasse "screenreader"

Sie können die Klassen "mobile" und "no-mobile" auch in Kombination mit "screenreader" verwenden. Für den Betrachter am Bildschirm oder mobilen Endgerät verändert sich dadurch nichts.
Für die Nutzer eines Screenreaders können Sie mit der Verwendung der Klasse "screenreader" jedoch sicher stellen, dass diese Inhalte dort ebenfalls zugänglich sind.

(Inhalte, die mit display:none ausgeblendet werden, sind auch für Screenreader nicht verfügbar)


  <div class="mobile screenreader">

      <p>Dieser Inhalt ist für mobile Endgeräte und Screenreader sichtbar.</p>

  </div>

Anwendungsbeispiel: Mobile Klassen

Wofür braucht man Mobile Klassen überhaupt?

Stellen Sie sich vor, Sie haben zwei längere Listen, die Sie in der Desktop-Version zwar übersichtlich nebeneinander platzieren können, die in der Mobil-Version jedoch untereinander dargestellt werden müssen.
Siehe: Webseite - Beratung & Service

Jemand, der sich nun diese Listen auf dem Smartphone anschaut oder von einem Screenreader vorgelesen bekommt, muss entweder viel scrollen oder sich viel anhören, bevor er oder sie am eigentlichen Ziel ist.

Mit Hilfe der Mobile-Klassen ist es möglich auf unterschiedliche Bildschirmgrößen einzugehen und zusätzliche Inhalte einzufügen oder auch gezielt Inhalte auszublenden.

Im eingangs genannten Anwendungsbeispiel können wir also in der Mobil-Version zusätzlich Skip-Links anzeigen lassen, die es dem Nutzer erleichtern auf der Seite zu navigieren.

Screenshots:

Ihnen ist ein Anzeigefehler aufgefallen?

Auf Grund der Vielzahl von Endgeräten und Browsern, die CSS-Styles vielfach unterschiedlich wiedergeben und unterstützen, kann es trotz all unserer Anpassungen zu Darstellungsfehlern führen.
Wenn Sie auf Fehldarstellungen von Standard-Elementen stoßen, teilen Sie uns dies gerne unter Angabe Ihres Browsers und Endgerätes mit. Als Standard-Elemente gelten solche, die in unserem Styleguide aufgeführt sind.

Kopfbild-Slider und zufällige Kopfbilder

2018-03-21T14:39:56+01:00

In den 2017er-Templates haben Sie verschiedene Möglichkeiten Ihre Kopfbilder zu organisieren und zu animieren.

Mit einem Slider ist es beispielsweise möglich automatisch mehrere Kopfbilder nacheinander einblenden zu lassen. Hierbei kann auch die Art und Weise der Bild-Navigation/Pagination über die Config-Datei angepasst werden.

Das Template erkennt eine Slider-Datei am Namen ("bild-slider.html" oder "bild-slider-portal.html") und bindet diese automatisch ein, wenn diese vorhanden ist.

Möchten Sie, dass die Slider-Datei für alle Portal-Seiten verwendet wird, dann legen Sie eine "bild-slider-portal.html" auf Ihrer Portal-Hauptebene ab.
Möchten Sie hingegen eher eine ordnerbasierte Lösung so verwenden Sie eine "bild-slider.html" auf der entsprechenden Ordnerebene.

Kopfbild-Slider

Den passenden Quelltext und eine ausführliche Anleitung zu den Bild-Slider-Dateien finden Sie auf den Internetseiten der Web-Entwicklung:
zur Anleitung

Zufällige Kopfbilder

Ebenso können die Slider-Dateien verwendet werden, um ein zufälliges Kopfbild ohne Slide-Funktion und ohne Bild-Navigation anzeigen zu lassen.

Neue Besonderheit hierbei:
Es ist möglich einen Ordner zu benennen, aus dem automatisch ein Bild ausgewählt wird. Wenn Sie beispielsweise Ihre Kopfbilder in dem Ordner /ihr-portal/images/kopfbilder/ ablegen, so können Sie diesen Pfad in der Slider-Datei angeben und aus allen in diesem Ordner vorhandenen Bildern wird nach dem Zufallsprinzip eines ausgewählt und im Kopf der Seite angezeigt.

Auch diesen Quelltext finden Sie mit weiteren Tipps und Hinweisen auf den Seiten der Web-Entwicklung:
zur Anleitung

Copyright-Hinweis möglich

Auch in den Kopfbild-Slidern können Sie ein Foto-Copyright anzeigen lassen.

Tipp: Roxen-Edit-Lesezeichen

2018-03-13T10:06:22+01:00

Für alle, die unser CMS Roxen tagtäglich nutzen, dürfte folgendes kleine Goodie ein echter Zugewinn sein:
Ein Lesezeichen, das einen von jeder beliebigen Uni-Bielefeld-Webadresse direkt in den Roxen-Editbereich bringt, ohne dass man das "edit" extra in der Adresszeile eingeben muss.

Wie richte ich dieses Lesezeichen ein?

Auf den Seiten der Web-Entwicklung gibt es eine kurze Anleitung wie Sie das Lesezeichen einfach und schnell einrichten können (siehe Klappbox "Roxen Login-Oberfläche):
→ Anleitung Lesezeichenerstellung

Alternativ können Sie auch diesen Quelltext in das Adress/Url-Feld eines neu angelegten Lesezeichens reinkopieren.

Der Lesezeichen-Quellcode wurde uns von Patrick Jentsch zur Verfügung gestellt.

Copyright-Hinweis im Kopfbild anzeigen lassen

2018-02-26T14:59:07+01:00

Seit kurzem ist es in den 2017er-Templates möglich den Titel des Kopfbildes als Copyright-Hinweis anzeigen zu lassen.

Dieser Hinweis wird in der rechten unteren Ecke des Bildes platziert.

Kurz-Anleitung: So geben Sie das Copyright an

Gehen Sie im Roxen-Backend auf das entsprechende Kopfbild
Bearbeiten Sie über "Edit" > "Edit Metadata.." die Metadaten des Bildes

In den 2017er-Templates ist diese Funktion automatisch freigeschaltet.

Den Bild-Titel NICHT als Copyright anzeigen lassen

Falls Sie die Copyright-Funktion für Ihr Portal unterbinden möchten, gehen Sie wie folgt vor:

Rufen Sie im Roxen-Backend Ihre Config-Datei auf
Suchen Sie nach der Variable "kopfbild-copyright" oder, falls diese noch nicht existiert, fügen Sie sie hinzu
Setzen Sie die Variable auf "no"

Schauen Sie sich dazu auch die Beschreibung der Config-Datei an:
→ Anleitung - Config-Datei

Neue Roxen-Videoanleitungen

2017-12-21T14:02:04+01:00

Die neuen Videoanleitungen für das Content-Management-System Roxen sind ab sofort auf dem Portal „Internet Services“ verfügbar. Die Anleitungsreihe richtet sich an sämtliche Benutzerinnen und Benutzer – egal ob mit oder ohne Vorkenntnisse.

Die Internetseiten der Universität Bielefeld werden mit dem Content-Management-System Roxen verwaltet. Gerade für Einsteigerinnen und Einsteiger gestaltet sich der Umgang mit dem CMS jedoch nicht immer ganz einfach. Aus diesem Grund gibt es diverse Angebote, die den Einstieg in Roxen erleichtern sollen – zum Beispiel eine Reihe von Videoanleitungen.

Diese Roxen-Videoanleitungen wurden in den vergangenen Wochen aktualisiert und neu produziert, und können ab sofort auf dem Portal „Internet Services“ angeschaut werden. In den Videos werden sowohl die ersten Schritte in Roxen beschrieben, als auch spezielle Funktionen erklärt – etwa zur Mehrsprachigkeit oder zum Lösen von Konflikten bei der gleichzeitigen Bearbeitung einer Seite. Die Videoanleitungen richten sich daher sowohl an Benutzerinnen und Benutzer ohne Vorkenntnisse, als auch an solche, die bereits mit dem CMS vertraut sind.

Wollen Sie sich einen Überblick über die Funktionen von Roxen verschaffen? Die neuen Videoanleitungen finden Sie hier.

Wie man den Seitenautor im Footer verbergen kann

2017-11-15T11:31:54+01:00

Standardmäßig wird im Footer neben dem Aktualisierungsdatum der Seitenautor angezeigt.
Als Seitenautor wird derjenige bezeichnet, der die Roxen-Seite erstellt hat. Da oftmals der Seitenersteller ein anderer ist als derjenige, der die Seite hinterher inhaltlich pflegt, ist es manchmal sinnvoll den Seitenersteller im Footer zu verbergen. Wenn beispielsweise Betrachter einer Seite inhaltliche oder grammatikalische Fehler entdecken, tendieren er dazu sich an die Person zu wenden, die im Footer als Seitenautor angegeben ist.

Im 2017er-Template haben Sie nun verschiedene Möglichkeiten Einfluss auf die Anzeige des Seitenautors im Footer zu nehmen:

1.) Den Autor für das gesamte Portal überschreiben oder ausblenden

Um den Seitenautoren im Footer für das gesamte Portal zu verändern, fügen Sie folgende Variable in Ihre Config-Datei ein (sofern sie nicht bereits vorhanden ist):

 <xsl:variable name="autor" select="'yes'" />

Diese Variable kann folgende Werte annehmen:
'yes' = Standardwert - der Seitenersteller wird angezeigt
'no' = Der Seitenersteller wird komplett ausgeblendet
'Individueller Name' = Der Seitenersteller wird auf allen Portal-Seiten mit diesem Namen überschrieben.

→ Weitere Informationen zur Config-Datei

2.) Den Autor für eine einzelne Seite ändern oder ausblenden

Um den Seitenautor auf einer einzelnen Seite zu ändern oder auszublenen, müssen Sie die Metadaten der entsprechenden Datei bearbeiten.

Über das Roxen-Menü "Edit" > "Edit Metadata..." können Sie ganz unten beim Punkt "Author" entweder eine andere Person oder "(No author)" auswählen.

→ Siehe auch: Insider-Tipps

Piktogramm statt Portal-Titel

2017-11-08T10:41:40+01:00

Im aktuellen Portal-Template ist es im Design Nr.2 (für Einrichtungen und Verwaltung) möglich, links oben auf dem farbigen Balken ein Piktogramm einzubinden statt des Portal-Titels.

Um einen schnellen Wiedererkennungseffekt zu erreichen, kann ein Piktogramm statt des Titels eingesetzt werden. Ein Piktogramm ist ein Logo, das als Symbol oder Schriftbild für eine Einrichtung steht. In diesem Fall zum Beispiel das vom Career Service.

Um es einzubinden, muss eine Zeile in der Config-Datei geändert werden und das Piktogramm als Bilddatei in den Image-Ordner mit dem Dateinamen "piktogramm.gif" oder "piktogramm.png" abgelegt sein.

Wichtig für die Bilddatei:
Sie sollte in ausreichender Größe und Auflösung mit transparentem Hintergrund angelegt sein. Die maximale Piktogramm-Fläche (siehe Abbildung) kann nicht überschritten werden.

Die detaillierten Anleitungen sind hier zu finden:
→ Zeile in Config-Datei anpassen
→ Piktogramm-Bild hochladen

Was ist der Unterschied zwischen und ?

2017-10-05T13:49:49+02:00

 und sorgen beide dafür, dass der Text fett dargestellt wird. Dennoch unterscheiden sich die beiden Elemente - mit wichtigen Folgen für Suchmaschinenoptimierung und Barrierefreiheit.

Bei HTML gibt es zwei Möglichkeiten, um Text fett darzustellen. Ein Beispiel:
Am Dienstag findet keine Sprechstunde statt.
Am Dienstag findet keine Sprechstunde statt.
Am Dienstag findet keine Sprechstunde statt.
Am Dienstag findet keine Sprechstunde statt.

Das Ergebnis von und ist augenscheinlich das gleiche – beide sorgen dafür, dass der Text fett dargestellt wird. Aber gibt es wirklich keinen Unterschied zwischen diesen Elementen? Weshalb gibt es in HTML Tags, die scheinbar dieselbe Funktion erfüllen?
Tatsächlich unterscheiden sich und grundlegend. Sie werden lediglich von Web-Browsern in der gleichen Weise dargestellt.
 bezieht sich ausschließlich auf die Darstellung des Textes. Wenn Sie die Wörter „keine Sprechstunde“ mit -Tags umschließen, weiß Ihr Browser also: Diesen Textabschnitt muss ich durch fette Schrift darstellen.

Das Element hat dagegen eine inhaltliche, semantische Bedeutung. Die -Tags um „keine Sprechstunde“ signalisieren, dass dieser Inhalt besonders wichtig ist – daher auch die Bezeichnung strong (etwa: stark, kräftig, gewichtig). Wichtige Inhalte müssen natürlich als solche erkennbar sein. Im Schriftbild werden sie daher mittels fetter Buchstaben dargestellt.

Diese Unterscheidung klingt erst einmal sehr theoretisch. Sie ist allerdings auch für die Praxis relevant.
Zum Beispiel können HTML-Dokumente nicht nur visuell dargestellt werden. Für Blinde und Sehbehinderte gibt es beispielsweise Screenreader, die Texte als gesprochene Sprache ausgeben. Für einen Screenreader ist zum Beispiel egal, ob „keine Sprechstunde“ durch fett dargestellt wird oder nicht. Verwenden Sie dagegen -Tags, kann „keine Sprechstunde“ besonders betont werden, etwa durch Tonhöhe und Lautstärke.

Auch für die Suchmaschinenoptimierung ist der Unterschied zwischen und wichtig. Ihre Texte werden nicht nur von Menschen, sondern auch von Suchmaschinen-Bots, so genannten Crawlern gelesen. Die Textformatierung ist dabei unerheblich. Inhalte, die Sie durch als wichtig markieren, werden dagegen auch von Suchmaschinen interpretiert. Das kann sich schlussendlich im Suchmaschinen-Ranking niederschlagen.
Mit Blick auf die Barrierefreiheit und die Suchmaschinenoptimierung empfiehlt es sich daher -Tags zu verwenden, wenn Sie dadurch wichtige Inhalte kennzeichnen wollen. Geht es Ihnen ausschließlich um die Darstellung, ist die richtige Wahl.

Auch, wenn sie scheinbar dasselbe bewirken: Es gibt wichtige Unterschiede zwischen und