Das CMS incca

Support-Bereich für Anwender
Fragen? 089 - 23 225 350 | EMF: Online-Redaktion@st-michaelsbund.de | PV&Pfarrei: service@smb-cc.de

Bilder und Bild-Beispiele

Hochladen von Bildern

Bilder oder andere Grafiken können über die Funktion "Medien-Archiv" hochgeladen und auf Webseiten oder anderen Anwendungen, wie Bild-Slider, verknüpft und angezeigt werden.
Das "Medien-Archiv" findet man ähnlich wie das "Site-Management" in der linken Menüleiste des incca-CMS Systems.
Position und Übersicht des Medien-Archiv im Incca CMS.
Übersicht des Medien-Archiv.
Rechts-Klick-Menü des Medien-Archiv
Mit einem "Rechts-Klick" im rechten Feld des neu erschienen Fensters, kann man mittels "Neu" Bilder und Dateien hochladen.
Das Feld zum Hochladen von Medien im Medien-Archiv.
In dem daraufhin folgenden Feld hat man zwei Möglichkeiten eine Datei auszuwählen, um diese automatisch hochzuladen.
  • Man zieht die Datei per gedrückter linker Maus-Taste in das Feld. (Drag-and-Drop)
  • Man klickt mit der linken Maus-Taste in das Feld. Dabei öffnet sich der System Explorer bzw. der System Dateiverwaltungsmanager, bei welchem man die Datei auf seinem Computer auswählen kann.
Im darauf folgenden Menü muss man einen Namen und eine Bildbeschreibung festlegen. Ab dem 30. April 2020 ist auch das Feld "Copyright" für Bilddateien (z.B. JPG und PNG) ein Pflichtfeld. Weitere Informationen dazu finden Sie im nächsten Abschnitt.

Nachdem alle Pflichtfelder ausgefüllt sind, wird der bisher ausgegraute "Speichern-Button" anklickbar. Die Datei sollte nach dem Speichern erfolgreich hochgeladen worden sein.
Das Eigenschaftsmenü zur Verwaltung von hochgeladenen Medien

Copyright bei Bildmedien

Ab dem 30. April 2020 wird das zuvor genannte Copyright-Feld bei den Dateieigenschaften von Bildmedien zu einem Pflichtfeld und das hochgeladene Medium kann nur bei Angabe des Copyrights hochgeladen werden. Dennoch sollten Sie, auch wenn das Feld bisher noch kein Pflichtfeld sein sollte, das Copyright ordnungsgemäß eintragen. Das Copyright, oder auch Urheberrecht bzw. das Recht auf Nutzung, ist laut gesetzlicher Rechtssprechung gut auf der Webseite ersichtlich zu hinterlegen. Wir bitten Sie deshalb bei alten Bildern, bei denen noch kein Copyright eingetragen wurde, dies nachzuholen.

Ab Mai 2020 wird ein Medienverzeichnis am unteren Ende der Webseite angezeigt, welches alle vorhandenen Bilder mit deren Copyright bzw. Nutzungserlaubnis der jeweiligen Webseite aufzeigt.
Sie müssen also keine zusätzlichen Bildunterschriften zum Thema Copyright anfertigen, sofern dieses korrekt im Eigenschaften-Menü des jeweiligen Bildmediums hinterlegt ist.
Weitere Informationen hierzu finden Sie unter den nachfolgenden Links:
Urheberrecht und Bild-Plattformen


Bild mit Verlinkung versehen

Sie können ein Bild auch anklickbar machen, indem Sie das Bild mit einer Verlinkung versehen. Dabei können Sie zwischen einer externen und internen Verlinkung wählen. Die externe Verlinkung wählen, wenn Sie auf eine Webseite verweisen wollen, die nicht im incca-CMS zu finden ist. Sollten Sie auf eine Seite innerhalb des CMS verweisen wollen, nehmen Sie bitte die interne Verlinkung.
Um die Verlinkung einzufügen, öffnen Sie mit Doppel-links-Klick das Fließtext-Modul über welches das Bild auf der Webseite eingebunden ist. Scrollen Sie hier nach unten dort gibt es die Felder "ext. Link für Bild" und "int. Link für Bild".
Gezeigt wird das Fließtext-Modul im incca-CMS. Hervorgehoben sind die Felder um Links für Bilder einzufügen.

Größe der Bilder auf der Webseite

Bilder haben je nach Displaygröße verschiedene Größen.
Im Contentbereich wird ein Bild mit einer maximalen Breite von 830 Pixel angezeigt.

Unser Tipp: Stellen Sie die automatische Größenreduktion im Medienarchiv auf 900 Pixel ein. Dann können sie alle Bilder direkt von der Kamera in voller Größe hochladen, das Medienarchiv reduziert alle auf 900 Pixel.
Diese Bilder passen überall in die Website und werden in der passenden Größe angezeigt.
Bilder die eine bestimmte Größe haben sollen, z.B. ein Portrait mit 120 Pixel müssen von Ihnen auf diese Größe zugeschnitten werden.
Die Bilder verhalten sich responsiv, d.h. je nach benutztem Gerät (PC, Smartphone, Tablet) kann sich die Größe der Bilder verändern.  
Aus diesem Grund ist es nicht möglich Text und Bild genau auf einer Höhe einzubauen, bzw. diese Abstimmung würde nur auf einem Gerät schön ausschauen. Auf jedem anderen Gerät entstünden viele Leerbereiche.

Durch das Feld "Bildausrichtung" sind folgende Bildgrößen festgelegt:
rechts / links = das Bild wird auf 50% der Seite verkleinert
zentriert / unten / nichts = das Bild wird zu 100% der Größe angezeigt

Das Verhältnis von Text zu Bild ist festgelegt durch::
rechts oder links = Text neben dem Bild
zentriert = Text unter dem Bild
unten = Text über dem Bild
nichts = Text unter dem Bild
Position der möglichen Bildausrichtungen.
Weitere Informationen zum Thema Bildergrößen, finden Sie auch hier:
Bildergrößen

Beispiele:


Seiten eines aufgeschlagenen Buches in Nahaufnahme
Bildunterschrift

Bild links

Text zum Bild

Seiten eines aufgeschlagenen Buches in Nahaufnahme
Bildunterschrift

Bild rechts

Text zum Bild

Seiten eines aufgeschlagenen Buches in Nahaufnahme
Bildunterschrift

Bild zentriert

Text zum Bild

Bild unten

Text zum Bild
Seiten eines aufgeschlagenen Buches in Nahaufnahme
Bildunterschrift

Seiten eines aufgeschlagenen Buches in Nahaufnahme
Bildunterschrift

Bild nichts

Text zum Bild

Responsives Verhalten der Bilder

Wikipedia sagt da folgendes dazu:
Beim Responsive Webdesign (im Deutschen auch responsives Webdesign genannt oder kurz RWD, englisch responsive ‚reagierend‘) handelt es sich um ein gestalterisches und technisches Paradigma zur Erstellung von Websites, so dass diese auf Eigenschaften des jeweils benutzten Endgeräts, vor allem Smartphones und Tabletcomputer, reagieren können. Der grafische Aufbau einer „responsiven“ Website erfolgt anhand der Anforderungen des jeweiligen Gerätes, mit dem die Site betrachtet wird. Dies betrifft insbesondere die Anordnung und Darstellung einzelner Elemente, wie Navigationen, Seitenspalten und Texte, aber auch die Nutzung unterschiedlicher Eingabemethoden von Maus (klicken, überfahren) oder Touchscreen (tippen, wischen). Quelle: https://de.wikipedia.org/wiki/Responsive_Webdesign