Interessante Funktionen des Bild-Elementes in Weblication^®

Weblication^® CMS erzeugt Bilder automatisch im Kontext in der richtigen Größe. Originalbilder bleiben erhalten. Ändern Designer im CSS Spaltenbreiten, werden alle Bilder automatisch neu in der korrekten Größe generiert.

Bild hochladen, in Seite einbinden, fertig: Die Bildgrößen berechnet Weblication^® automatisch!

Sie benötigen keine zusätzliche Bildbearbeitungssoftware und veröffentlichen sowohl als Computer-Laie als auch als Web-Designer Bilder automatisch in der richtigen Größe.

Mit zahlreichen Einstellungen und CSS-Only Varianten können Sie ein Bild-Element in Weblication^® konfigurieren:

• Bildausschnitt wählen - getrennt für Desktops (maximal sichtbarer Bildausschnitt) und Mobilgeräte (mindestens sichtbarer Bildausschnitt)
• Link und Linkziel (Gleiches Fenster, Neues Fenster, Lightbox, Lightbox Visitenkarte, Layer)
• Darstellung: Standard, Individuell, Mit Rahmen, Quadratisch, SVG-Grafik, SVG-Grafik eingebettet und per CSS formatierbar, Rund, Elliptisch und Seitenverhältnis auswählbar, Abgerundete Ecken
  
• Größe: Automatisch, Klein Original, Original HD, Halbe Breite
  
• Position/Ausrichtung: Nicht ausrichten, Links ausrichten, Rechts ausrichten
• Seitenverhältnis: quadratisch: 1/1, querkant: 4/3, 2/1, 3/1, 4/1, hochkant 3/4, 1/3, 1/2, 1/4
• Rahmen: Ohne Rahmen, Eingerahmt, Bildkanten verstärken
• Bildunterschrift: Ohne, Mit Bildunterschrift, Mit Bildunterschrift zentriert, Mit Bildtitel weiß mittig auf dem Bild, Mit Bildtitel schwarz mittig auf dem Bild, Mit Bildunterschrift und Copyright, Mit Copyright auf dem Bild, Mit Bildunterschrift und Copyrifght auf dem Bild
  
• Bildqualität: Standard, Niedrigste / Kürzeste Ladezeiten, Erhöhte Qualität / längere Ladzeiten, Niedrigere Qualität / kürzere Ladezeiten, Höchste Qualität / längste Ladezeiten
  
• Titel / Alternativtext - Default als Pflichtfeld
• Den Titel können Sie auch automatisch aus den Dateiattributen ermitteln
• Mouseover-Bild, das erscheint, wenn Sie mit der Maus über das Bild fahren
• Sie können das Detailbild bestimmen, das beim Anklicken des Bildes groß gezeigt wird
• Sie können als Detailbild auch das Bild selbst mit einem Klick festlegen
• Sie können das Durchblättern der Bilder auf einer Seite per Klick ermöglichen
  

Darüber hinaus können Sie projektspezifisch und einzeln folgende Optionen auswählbar machen:

• Sie können Bilder Pixelgenau laden
  
• Lazy Load: Bilder werden erst geladen, sobald diese im sichtbaren Bereich erscheinen
• Bild in Graustufen anzeigen und beim Überfahren farbig
• Lupenfunktion: Lupe vergrößert wird beim Überfahren mit der Maus den berührten Teil
  
• Auf kleinen Bildschirmen ausblenden
• Bild nicht erst laden, wenn im Anzeigebereich
• Titel in der Lightbox nicht anzeigen
• Bild mit Zoom-Effekt anzeigen
  
• Bild in Graustufen anzeigen
  

Die Bildbreitenauswahl und die Bildbreitenberechnung wurden in der Mobile First BASE grundlegend überarbeitet. Dem Umstand geschuldet, dass es inzwischen sehr viele unterschiedliche Bildschirmgrößen gibt, setzt die Mobile First BASE konsequent auf Responsive Images, um eine optimale Bildqualität bei gleichzeitig minimaler Bildgröße auszuliefern.

Die Bildbreitenberechung geschieht in der Mobile First BASE über Client-Feedback. Das bedeutet, dass der Client dem System mitteilt, wie groß die Bilder für die jeweiligen Breakpoints gerendert werden. Dazu findet im Hintergrund eine breakpoint-basierte Breitensimulation statt. Der Redakteur bekommt davon allerdings nichts mit. Das Ergebnis der Breitenberechnungen lässt sich im Panel über Werkzeuge / Bildgrößen aufrufen. Bei Bedarf können dort die existierenden Bildgrößen auch gelöscht bzw. zurückgesetzt werden.

Beim Abruf von Seiten über Smartphones erzeugt Weblication^® jedes Bild entsprechend der möglichen Displaybreite und zeigt es an.

Liegt zusätzlich ein hochauflösendes Display vor, lädt Weblication^® im Anschluss ein hochauflösendes Bild nach und zeigt dies in HD-Qualität an.

Auch für das Responsive Design, bei dem Sie eine Webseite für alle Endgeräte bereitstellen, berechnet Weblication^® automatisch die richtige Bildgröße abhängig vom Endgerät (Smartphone, Tablet, Notebook, PC) und der Bildschirmbreite der jeweilige Geräte.

Die Weblication^® Technologie CSS-Picture-Rendering macht es möglich, dass Bilder automatisch jeweils im Kontext in die dafür erforderliche Größe berechnet werden.

Das ist keinesfalls selbstverständlich: Üblicherweise werden in Internet-Auftritten die Bilder in Grafikprogrammen auf die erforderliche Größe gerechnet und dann in den Internet-Auftritt geladen. Das Weblication^® CSS-Picture-Rendering erledigt die Umrechnung automatisch für Sie und Sie sparen viel Arbeitszeit.

Ändern Web-Designer z.B. über CSS die Spaltenbreiten, werden automatisch alle Bilder beim jeweils ersten Seitenaufruf nach jeder CSS-Änderung neu berechnet.

Über die Weblication^® Technologie High-Definition-Picture-Rendering werden Bilder auf HD-Displays mit hoher Pixeldichte (z.B. Apple Retina Displays) automatisch in HD-Qualität berechnet und ausgeliefert.

Artikel lesen

Nach einem Relaunch berechnet Weblication^® jedes Bild automatisch im Kontext neu. Kein aufwendiges Neu-Erstellen oder Umrechnen der Bilder ist erforderlich. Voraussetzung: Die Originalbilder wurden groß gespeichert.

Artikel lesen

In Weblication^® können Sie einstellen, dass Bilder erst nachgeladen werden, wenn diese im sichtbaren Bereich einer Seite erscheinen. Dies verkürzt die Ladezeit der Seiten insbesondere bei Seiten mit vielen Bildern und beim Abruf über Smartphones.

Weblication^® liefert Ihnen Werkzeuge dafür, um Bilder mit einem Wasserzeichen-Effekt bzw. Copyright-Hinweis zu versehen.

Es gibt unterschiedliche Wege und Mittel, um Bilder entsprechend zu manipulieren und mit einem Wasserzeichen-Effekt oder mit einem Copyright-Vermerk zu versehen. Nachfolgend finden Sie entsprechende Möglichkeiten aufgelistet.

1. Über ein Verzeichnisereignis beim Hochladen von Bildern
2. Über das Bild-Element mit Standardmitteln
3. Über das Bild-Element und Projekt-Funktionen
4. Über Bildergalerien
Hinweise und weitere Informationen

Gesamten Artikel lesen

In Weblication^® können Sie festlegen, in welche Bildgröße Bilder beim Hochladen auf den Server umgerechnet werden. So können Sie auf Wunsch z.B. Bilder von Digitalkameras mit einer Breite von 4.000 Pixel automatisch umrechnen lassen auf 1024 Pixel, damit weniger Speicher verbraucht wird. Die Einstellung nehmen Sie vor in der Projektkonfiguration oder in der Ereignissteuerung der jeweiligen Verzeichnisse.

Zusätzlich zu den automatischen Bildfunktionen bietet Weblication^® eine integrierte Bildbearbeitung mit zahlreichen Funktionen, für die Sie sonst ein zusätzliches Grafikprogramm benötigen würden:

• Filterfunktionen: Graustufen, Aufhellen, Abdunkeln, Weichzeichnen, Scharfzeichnen
• Bilder skalieren Sie im Ansichtsbereich einfach per Schieberegler
• Bildausschnitte erzeugen Sie in vielen auswählbaren Seitenverhältnissen: (beliebig, wie Original, 1:1, 4:3, 3:2, Goldener Schnitt, 16:9, 2:1, 3:1 und entsprechend hochkant)
• Vorige Bearbeitungsstände können Sie während der Bearbeitung zurückholen
• Datei-Informationen finden Sie nun direkt in der Bearbeitung

Ob Fancybox, Diashow, Teaser-Gallery, Fader-Gallery oder einfach nur Einzelbilder zum Blättern: Bildergalerien legen Sie einfach per Mausklick in Ihren Seiten an.

Dabei können Sie das Design der Galerien über die zahlreichen mitgelieferten CSS-Only Varianten per Mausklick verändern, und Designer können beliebige eigene Darstellungen erstellen.