Inhalte bearbeiten

    Um Texte und Inhalte zu bearbeiten stellt discoverize einen Editor zur Verfügung. Hier lassen sich Texte formatieren, Links setzen, Bilder hochladen und Html einfügen.

    Auf dieser Seite erklären wir die grundlegenden Funktionen.

    HTML Code editieren

    Über das „<>“-Symbol in der Toolbar kann der Html-Editor geöffnet werden. Darüber können dann z. B. Html-Vorlagen oder auch Skripte oder Styles eingefügt und editiert werden:

    Html editieren im tiny MCE Text-Editor

    Umfangreiche HTML-Vorlagen

    Für die Gestaltung von Content Blöcken und statischen Seiten gibt es ein großes Angebot an Layout und Design-Vorlagen, unter anderem für die Darstellung von Links, zum Positionieren von Bildern oder für die Präsentation von Inhalten in Tabs (Reitern). Außerdem enthält der Guide weitere Tipps für die Inhalte selbst, wie z. B. Tipps für die Suchmaschinenoptimierung.

    Den sog. Content Management Guide findet man auf jedem Branchenportal auf der Seite /content-management-guide, z. B. geht es hier zum Content Guide auf dem Demo-Portal.

    Content Management Guide im Demo Portal

    Um einen Link auf eine externe oder interne Seite zu setzen geht man wie folgt vor:

    Content editieren mit dem Tiny MCE Texteditor

    1. Text markieren
    2. Auf das „Ketten“-Symbol klicken
    3. Den gewünschten Link im Feld „Url“ hinterlegen
    4. optional: unter „Link öffnen in…“ kann man auswählen, ob der Link in einem neuen Browser-Fenster „Neues Fenster“ oder im Aktuellen Fenster geöffnet wird
    5. Speichern

    Bilder in Contentblöcken

    Auf dem Branchenportal werden Bilder für Suchseiten und Detailseiten normalerweise optimiert durch einen Image-Resizer, der Bilder je nach Umgebung (mobil / desktop) und Device bzw. Screensize optimiert. Das ist wichtig, da Suchmaschinen kleinere, performantere Seiten besser bewerten. Damit erhöht sich die Wahrscheinlichkeit für eine bessere Platzierung in Suchmaschinen.

    Wenn jedoch Bilder in Contentblöcken verwendet werden, kann es sein, dass hier sehr große Bilddateien hochgeladen werden. Das kann sich dann sehr negativ auf die Lade-Performance einer Seite auswirken. Häufig werden diese großen Bilder gar nicht benötigt oder auch gar nicht in voller Größe angezeigt. Leider weiß das Branchenportal serverseitig nicht, in welchem Kontext ein Bild angefordert wird und kann hier erstmal nichts optimieren.

    Wenn jedoch beim Einfügen von Bildern die Bildgrößen für Breite und Höhe gesetzt werden, dann können wir automatisiert entsprechend Bilder in dieser Größe ausliefern. Das Gesamtladevolumen kann dadurch teilweise drastisch gesenkt werden.

    Bildgröße setzen im Management

    Insbesondere auf der Startseite macht das einen großen Unterschied, da dort häufig viele kleine Bilder in Contentblöcken eingebettet sind. Für diese Contentblöcke reichen Bilder in einer kleinen Größe vollkommen aus.

    Wenn also Breite (width) und Höhe (height) im HTML gesetzt sind (was durch Einfügen wie oben im Screenshot automatisch passiert), werden die URLs der Bilder automatisch beim Aufruf der Seite angepasst, so dass der ImageResizer die Bildgrößen anpasst und das Bild normalerweise im Webp-Format ausliefert, ganz unabhängig davon, ob das Originalbild ein JPEG- oder PNG-Bild ist:

    Breite und Höhe automatisch für ImageResizer verwendet

    Die Höhe und Breite eines Bildes kann dann auch nachträglich jederzeit im Editor angepasst werden, die Bildoptimierungen passieren dann automatisiert beim Ausliefern des Contentblocks bzw. der Seite.

    Wichtig: Also immer beim Bilder-Einfügen Breite und Höhe setzen!