Bilder

Vorbereitung

• maximale Bildbreite: 1000px
• Auflösung: 96dpi
• jpg-Format für Fotos
• jpg-Komprimierung auf 80% bringt immer noch sehr gute Ergebnisse
• svg- oder png-Format für Grafiken mit wenigen Farben oder Farbverläufen z.B. Icons
• das Bild sollte keine großflächigen weißen Bereiche am Rand haben, also möglichst freigestellt sein
• das Bild sollte keinen Rahmen oder außen liegenden Schatten enthalten
• das Bild sollte keine längeren Textpassagen enthalten, lediglich notwendige Dinge wie z.B. Beschriftungen
• das Bild sollte kein Screenshot sein
• die Dateigröße sollte deutlich kleiner als 1MB sein - in der Regel sogar nur ca 250kb.

Dateiname

Das Bild muss einen aussagekräftigen Namen erhalten (bitte nicht Bildschirmfoto_22.12.2015.jpg oder Ähnliches).

Wir haben uns dazu auf folgende Konventionen geeinigt (wird vom Upload-Script automatisch angepasst):

• alles klein geschrieben
• keine Umlaute, Leerzeichen oder andere Sonderzeichen
• Worte werden mit Unterstrich [_] getrennt

Beispiele:

• piko_denkt
• piko_idee
• abbildung_wuerfelnetze

Hochladen

zuerst Klick auf [Bild]

dann klick auf "Server durchsuchen"

Als Speicherort sollte der korrekte Ordner ausgewählt werden. Dazu hat jedes Team eigene Vorgaben. Auf keinen Fall sollte das Bild in den Hauptordner geladen werden.

Konventionen Kompakt

Du musst den gewünschten Ordner links auswählen, danach kannst du dort beliebig viele Bilder hochladen.

Bildgröße

Die Bilder bekommen standardmäßig 50% Breite, werden zentriert und passen sich an die verschiedenen Displaygrößen an. Änderungen hier können leider nur im Quelltext vorgenommen werden, also bitte in diesem Fall eine Nachricht an die Programmierer.

Quelltext: <figure class='image w[25,50,75,100] center'

Bilder mit der Colorbox öffnen

Beispiel: (klick auf den Piko)

zum Öffnen eines Bildes in der Colorbox musst du das Bild mit der Maus markieren und einen Link setzen

in den Linkeigenschaften auf der Seite "Linkinfo" im Feld "URL" die Url des Bildes eingeben

und auf der Seite "Erweitert" im Feld "Formatvorlagenklasse" den Text "colorbox-load" eingeben