Kreisförmige Bilder und neue Hintergrundoption

Tags: Tools | Kommentare: 3 | Views: 2978

Freitag 11.Dezember 2015

 

Eine runde Sache

 

Falls du einige deiner Bilder einfach mal anders präsentieren möchtest, dann wird dir unsere neue Funktion bestimmt gefallen.

 

 

 

Bisher musste man Bilder mit einem Bildbearbeitungsprogramm bearbeiten, wenn man seine Motive in einem Kreis anzeigen lassen wollte. Ab sofort geht das viel leichter. Wir haben das Inhaltselement Bild um die Funktion "Runde Ecken" erweitert. Du findest diese Funktion unter dem Bereich Rahmen:

 

 

1) Hier kannst du eine Rundung zwischen 0 px und 500 px einstellen.

2) In der Vorschau wird der Effekt natürlich sofort angezeigt.

 

Wenn du kreisrunde Bilder möchtest, muss die Rundung immer mindestens so groß sein, wie die halbe Breite oder Höhe deines Bildes. Du kannst auch einfach die Rundung auf 500 px einstellen und dann werden alle Bilder, sofern diese nicht größer als 1.000 Pixel in der Höhe und 1.000 Pixel in der Breite sind, in einem Kreis dargestellt. Dabei spielt es keine Rolle, ob das Bild 150 px oder 500 px breit ist. Natürlich kannst du die Funktion auch nutzen, um einfach leicht abgerundete Ecken zu erzeugen. 5 px bis 10 px Rundung erzeugen eine kleine Abrundung, die elegant aussieht. Einfach mal probieren.

 

Google Fonts für die Bildunterschrift

Außerdem haben wir auch im Bildabschnitt inzwischen die Möglichkeit geschaffen, Google-Fonts (3) zu verwenden. Wir werden diese Option nach und nach in allen Inhaltselementen einbauen, die eine Einstellung zum Auswählen einer Schrift haben.

 

 

Hintergrundbilder covern

 

 

Du findest diese Erweiterung, wenn du dein Design bearbeitest und dann den Hintergrund (1) bearbeiten willst. Dort hast du ja die Möglichkeit, zu bestimmen, wie die Größe des Hintergrundbildes eingestellt werden soll.

Die Bildgrößenanpassung (2) haben wir nun um den Punkt "Abdecken" erweitert, wie du unten im Dialog sehen kannst. Abdecken sagt aus, dass dein Hintergrundbild immer den gesamten Hintergrund abdeckt.

Das Element zum Anpassen der Bildgröße haben wir zusätzlich modifiziert. Wie du bei der Bildwiederholung siehst (3) steht dort immer die Funktion "Wiederholung", egal welche Art der Wiederholung du ausgewählt hast. Das macht auch nichts, da du vor diesem Eingabefeld eine Anzeige hast, die deutlich zeigt, wie die Wiederholung eingestellt ist. Bei unserem Screenshot siehst du einen einzelnen Punkt, was zeigt, das Bild soll nur einmal angezeigt werden. Die Wiederholung ist ausgeschaltet. Klickst du auf dieses Feld, schaltest du den Modus immer um einen Schritt weiter und siehst sofort anhand der Anzeige, was eingestellt wird.

Bei der Bildgrößenanpassung ist es aber sehr schwierig, anhand des vorangestellten Icons eindeutig zu erkennen, welcher Typ ausgewählt. Daher wird dieser jetzt immer direkt als Schrift angezeigt. In unserem Screen siehst du, dass die Anpassung auf "Original" steht, was bedeutet, dass Bild wird in der Originalgröße angezeigt, egal, wie klein der Browser ist.

 

Was genau ist Covern?

 

Covern ist die einfachste Art, ein Bild in den Hintergrund einzuladen. Viele Webbaukästen nutzen diese Funktion. Eine Besonderheit ist, dass Bilder mit dieser Funktion immer so groß dargestellt werden wie das vom Platz her möglich ist und wenn das Seitenverhältnis nicht mit der Anzeige harmoniert, dann wird einfach ein Ausschnitt angezeigt. Dieser Effekt führt dazu, dass man ein Hintergrundbild eigentlich immer fixieren sollte und auf keinen Fall mitscrollen läßt. In dem Moment, wo du auf "Mitscrollen" stellst, versucht dieser Befehl, dass Bild auf die Höhe der gesamten Webseite (auch auf den unsichtbaren Teil, der erst durch Scrollen sichtbar wird) auszudehnen. Je länger deine Webseite ist, umso größer wird das Bild dargestellt, was zu unerwünschten Ergebnissen führt. Aus diesem Grund haben Webbaukästen, die Cover als Funktion verwenden, normalerweise nur wenige oder keine Optionen, dass Bild anders zu platzieren.

Wenn du Covern verwendest, schalte daher immer das Mitscrollen aus. So kannst du Webseiten mit einem tollen Hintergrundbild versehen, das immer den gesamten Browser ausfüllt. Der einzige Nachteil ist, dass du nie wissen kannst, welcher Auschnitt angezeigt wird, weil das immer davon abhängt, ob das System die Bildhöhe oder Bildbreite anpasst.

 

 

Wir hoffen natürlich, dass diese kleinen, aber feinen Erweiterungen auch dir Spaß machen und dir dabei helfen, besonders schöne Webseiten mit page4 zu gestalten. Wir freuen uns wie immer über Kommentare und Anregungen.

 

Viel Spaß beim Ausprobieren und stellt uns gerne eure Webseiten vor, damit andere User sehen können, wie ihr diese Funktionen sinnvoll zum Gestalten eingesetzt habt.

 

Bis in Kürze

 

Manfred und das Team von page4

Neuer Kommentar



Kommentar veröffentlichen

Blogarchiv