So optimieren Sie eine Website für die Anzeige auf mobilen Geräten

Einrichten der Seitenansicht auf verschiedenen Geräten im sichtbaren Bereich
Sichtbarer Bereich ist eine Einstellung, die bestimmt, welche Blöcke auf bestimmten Gerätetypen angezeigt werden können oder nicht. Sie können diesen Parameter im Einstellungsfenster eines beliebigen Blocks anpassen.
Warum Sie es brauchen und wie es funktioniert

Wenn ein Block auf dem Desktop gut aussieht, aber auf Mobilgeräten nicht so gut, sollten Sie die Blocksichtbarkeit auf 980px oder mehr einstellen. Auf diese Weise wird der Block Desktop-orientiert und erscheint nicht auf mobilen Geräten.

Kopieren Sie danach den Block und optimieren Sie ihn für die Anzeige auf Mobilgeräten, indem Sie seine Einstellungen anpassen (was eine Änderung des Bildes, der Schriftart usw. beinhalten kann). Stellen Sie die Blocksichtbarkeit auf "0-980px" ein. Als Ergebnis erhalten Sie eine mobile Version des Blocks.

Am Ende sehen diejenigen, die von einem PC aus auf Ihre Website zugreifen, die Desktop-Version und mobile Benutzer die mobile Version.

Die Blocksichtbarkeit ist ein Parameter, den Sie im Einstellungsbereich eines Blocks finden und anpassen können, damit der Block auf Geräten mit einer bestimmten Bildschirmauflösung angezeigt oder nicht angezeigt wird. Zum Beispiel sehen einige Blöcke auf Tablets und andere auf Mobiltelefonen nicht gut aus.
Beispiel
Wir haben ein Cover, das auf dem Desktop großartig aussieht, der Text ist links ausgerichtet und das Hauptobjekt rechts. Passen wir es jetzt so an, dass es auch auf Mobilgeräten gut aussieht.
Wie wir sehen, wird das Cover auf dem Handy beschnitten und sieht nicht sehr gut aus.
Um zu verhindern, dass es auf mobilen Geräten angezeigt wird, gehen Sie zum Einstellungsbereich des Coverblocks und stellen Sie die Blocksichtbarkeit auf "> 980px" ein. Jetzt werden mobile Benutzer es nicht mehr sehen.
Kopieren Sie den Block.
Passen Sie den Block für die mobile Version an – ändern Sie die Ausrichtung von Foto und Text.
Nachdem wir die Sichtbarkeit des Blocks auf "≤ 980px" eingestellt haben, wird er nicht auf Geräten mit Bildschirmen angezeigt, die breiter als 980px sind.
Fertig! Nun wird das Cover je nach Bildschirmbreite unterschiedlich dargestellt.
Beispiele für Bildschirmbreiten für verschiedene Geräte:
iPhone5: 320px
iPhone6: 375px
iPhone6+: 414px
iPad: 1024px
Samsung Galaxy: 360px
Nokia Lumia: 320px
Hergestellt auf
Tilda