Immer mehr Menschen besuchen Websites hauptsächlich mit ihrem Smartphone, weshalb eine Seite auch für Mobilgeräte angepasst werden sollte. Eine große Änderung von der Desktopansicht zu der Mobilansicht ist die Ausrichtung des Bildschirms vom Horizontalen zum Vertikalen.
CANVAYO ist zwar responsive, aber nicht jedes Bild oder jeder Bildausschnitt, bspw. im Aufmacher, wirkt automatisch mobil ebenso gut wie auf dem PC. Damit Bilder auch mobil optimal zur Geltung kommen, könnt ihr in CANVAYO ein alternatives Bild für die mobile Ansicht einfügen, das “Alternate mobile image”, das dann automatisch für die vertikale Ansicht mobil angezeigt wird.
Wo ihr das Mobilbild hinterlegt
Ein zusätzliches Bild für Mobilgeräte könnt ihr im Aufmacher und im Bild-Text-Block hochladen. Nehmt dafür ein hochkant ausgerichtetes Bild.
Im Aufmacher
Ruft die gewünschte Seite im WordPress-Dashboard auf, indem ihr in der Seitenleiste am linken Bildschirmrand auf Seiten klickt. Anschließend klickt ihr bei der gewünschten Seite auf Bearbeiten.
Wechselt im Aufmacher-Block in den Reiter „Hintergrund“. Hier seht ihr neben dem Bild rechts die Möglichkeit, ein alternatives Bild für Mobilgeräte hochzuladen.
Klickt auf den Button „Bild hinzufügen“ und ladet ein neues Bild hoch oder wählt ein bereits hochgeladenes Bild aus der Mediathek aus.
Das Mobilbild im Aufmacher wird bis zu einer Bildschirmbreite von 991 px gezeigt, also auch auf Tablets. Dort wird ein Hochkantbild oben und unten beschnitten: Setzt Schriftzüge und wichtige Motive deshalb in die Bildmitte.
Im Bild-Text-Block
Öffnet den Bild-Text-Block, den ihr bearbeiten möchtet, über das Stift-Symbol. Neben dem bereits gesetzten Bild seht ihr rechts ein Feld „Alternatives Bild für Mobilgeräte“.
Klickt auf den Button „Bild hinzufügen“. Jetzt könnt ihr ein neues Bild hochladen oder ein bereits hochgeladenes Bild aus der Mediathek auswählen.
Tipp: Setzt immer einen Fokuspunkt auf dem hochgeladenen Bild, um die responsive Darstellung noch besser beeinflussen zu können. Eine Anleitung zum Setzen des Fokuspunkts findet ihr hier.