Hilfe-Center

Wie man eine Website für mobile Geräte optimiert

Einrichten der Ansicht der Seite auf verschiedenen Geräten im sichtbaren Bereich

Tilda-Gestaltete Website-Layouts werden automatisch für Tablets, Smartphones, Netbooks, Laptops und Desktop-Computer angepasst.

Zusätzlich können Sie die Größe der Paddings für Mobilgeräte ändern, die Sichtbarkeit der Blöcke für verschiedene Geräte anpassen, Ihr eigenes responsives Layout mit dem Editor von Tilda' Zero Block entwerfen oder den adaptiven Modus der Website für Mobilgeräte ausschalten.

Ссылки:

Sichtbarkeit von Blöcken anpassen
Wie man verschiedene Versionen für einen Block auf dem Handy und dem Desktop entwirft.
Mehr lesen

Anpassen der Paddings für Mobile
Wie man die Größe der Paddings für mobile Versionen ändert
Lesen Sie mehr

Ihre eigene responsive Website-Version
Wie Sie Ihre eigene mobile Version mit dem Zero Block Editor gestalten können
Lesen Sie mehr

Den adaptiven Modus der Website ausschalten
Wie man die adaptive Version der Website für verschiedene Bildschirmauflösungen ausschaltet
Lesen Sie mehr

Sichtbarkeit blockieren Ein Verschiedene Geräte

Sichtbarer Bereich/Blocksichtbarkeit ist eine Einstellung, die bestimmt, welche Blöcke auf bestimmten Gerätetypen angezeigt werden können und welche nicht. Sie können diesen Parameter im Einstellungsfenster eines jeden Blocks anpassen.

Warum Sie es vielleicht brauchen und wie es funktioniert

Wenn ein Block auf dem Desktop gut aussieht , aber auf dem Handy nicht so gut, sollten Sie die Sichtbarkeit des Blocks auf 980 Pixel oder mehr einstellen. Auf diese Weise wird der Block desktoporientiert und erscheint nicht auf mobilen Geräten. (русская версия отличается - Wenn ein bestimmter Block (z. B. ein Heldenabschnitt) gut aussieht)

Kopieren Sie anschließend den Block und optimieren Sie ihn für die Anzeige auf Mobiltelefonen, indem Sie die Einstellungen anpassen (was möglicherweise eine Änderung des Bildes erfordert), Schriftart, usw.). Setzen Sie die Sichtbarkeit des Blocks auf "0-980px". Als Ergebnis erhalten Sie eine mobile Version des Blocks. Schriftgröße?

Schließlich sehen diejenigen, die von einem PC aus auf Ihre Website zugreifen, die Desktop-Version und die mobilen Nutzer die mobile Version.

Die Sichtbarkeit von Blöcken ist ein Parameter, den Sie im Einstellungsbereich eines jeden Blocks finden und anpassen können, um den Block auf Geräten mit einer bestimmten Bildschirmauflösung anzuzeigen oder nicht anzuzeigen. Zum Beispiel sehen einige Blöcke auf Tablets nicht gut aus und andere auf Mobiltelefonen. (русская версия отличается - есть уточнение, что это именно Bereich, d.h. unterschiedliche Werte für Parameter - и дублируется)

Sie müssen die Blocksichtbarkeit nicht für alle Blöcke ändern. Sie können dies nur für die Blöcke tun, deren Foto falsch zugeschnitten ist, oder wenn der von Ihnen ausgewählte Block nicht für die mobile Version geeignet ist.

Beispiel

Wir haben ein Cover, das auf dem Desktop gut aussieht, mit dem Text auf der linken Seite und dem Hauptobjekt auf der rechten Seite. Jetzt wollen wir es so anpassen, dass es auch auf mobilen Geräten gut aussieht. (русская версия отличается)

Sehen Sie sich an, wie die Version der mobilen Website aussieht. Wie wir sehen, wird das Cover/Foto auf dem Handy beschnitten und sieht nicht sehr gut aus. (русская версия отличается)

Um zu verhindern, dass er auf mobilen Geräten angezeigt wird, gehen Sie zum Einstellungsbereich des Cover-Blocks und setzen Sie die Sichtbarkeit des Blocks auf "> 980px". Jetzt wird er für mobile Nutzer nicht mehr sichtbar sein.

Kopieren Sie den Block.

Passen Sie den Block für die mobile Version an - ändern Sie dieAusrichtung von Foto und Text. (неясная русская фраза)

Da wir nun die Sichtbarkeit des Blocks auf "≤ 980px" gesetzt haben, wird er auf Geräten mit Bildschirmen, die breiter als 980px sind, nicht angezeigt.

Erledigt! Jetzt wird der Bereich Cover/Held je nach Bildschirmbreite unterschiedlich angezeigt.

Beispiele für die Bildschirmbreite bei verschiedenen Geräten:

iPhone5: 320px
iPhone6: 375px
iPhone6+: 414px
iPad: 1024px
Samsung Galaxy: 360px
Nokia Lumia: 320px

(отличается порядок версий)

Anpassen der Paddings für Mobile

Öffnen Sie in einem beliebigen Block die Registerkarte "Einstellungen", klicken Sie auf das Symbol neben den Optionen "Obere Auffüllung" und "Untere Auffüllung" und legen Sie die Auffüllungen für ein mobiles Gerät fest.

Anpassen von Responsive Design in Zero Block

Sie können den Block so anpassen, dass er für verschiedene Geräte reaktionsfähig ist, indem Sie ihn mit einer Option auf der Registerkarte "Einstellungen" des Blocks in Zero Block konvertieren. Diese Option ist in den meisten Blöcken verfügbar jetzt/im Moment (уточняется, что это сейчас пока что в доступе или что уже есть???)

Sobald Sie den Block konvertiert haben, können Sie das Aussehen für fünf Bildschirmtypen je nach Breitenbereich manuell anpassen. Lesen Sie mehr darüber, wie Sie das responsive Design in Zero Block anpassen können, in der "Zero Block: Wie man einen benutzerdefinierten Block erstellt" und "Zero Block: Reaktionsfähiges Design" Artikel.

Ausschalten des adaptiven Modus der Website

Wenn Sie den adaptiven Modus ausschalten, wird die Seite auf dem Handy genauso angezeigt wie auf einem Desktop-Computer. Aktivieren Sie dazu das Kontrollkästchen "Mobile Ansicht deaktivieren" in den Seiteneinstellungen → Zusätzlich, und veröffentlichen Sie die Seite erneut.

Links ist die für Mobilgeräte angepasste Version der Website zu sehen, rechts die Website mit ausgeschaltetem adaptiven Modus.