Responsivität ist die Funktion einer modernen Website, ihr Layout automatisch und dynamisch an die Breite des Bildschirms anzupassen, mit der sie aufgerufen wird
Egal ob man die Website auf einem großen PC Bildschirm ("Desktop") anschaut oder mit dem Tablet oder dem Smartphone ("Mobile") - bei einer gut aufgebauten responsiven Homepage sieht diese in allen Bildschirmbreiten harmonisch und professionell aus, sie ist einfach zu bedienen, Texte sind gut zu lesen
Webseiten mit guter Responsivität werden nachweislich häufiger frequentiert, länger besucht und von Suchmaschinen höher eingestuft als nicht-responsive Webseiten
Die Ortsvereins-Website ist von Grund an responsiv angelegt und im Elementor Editor haben Sie umfassende Möglichkeiten, das Layout Ihrer Website auf die jew. Bildschirmbreiten anzupassen
Grundwissen Responsivität
Responsives Design bedeutet ein fließendes, dynamisches Layout einer Website mit Layout-Wechsel bzw. -Erweiterung ab dem jew. nächst-kleineren Schwellwert.
Die 3 gängigen Schwellwerte heißen "Desktop", "Tablet" und "Mobile"
Bei Ihrer Ortsvereins-Website entspricht "Desktop" allen Bildschirmbreiten größer als 1200px, "Tablet" allen Bildschirmbreiten zwischen 1200px und 768px und "Mobile" allen Bildschirmbreiten von 767px und kleiner
Die Grund-Einstellungen von mit Elementor gebauten Seiten werden immer in der Desktop-Ansicht vorgenommen.
Werden für Tablet oder Mobile keine explizit anderen Einstellungen vorgenommen, gibt der Desktop-Modus automatisch alle Einstellungen an die nächst-kleineren Bildschirmformate weiter
Elementor braucht ggf. etwas Zeit, um den Editor vollständig zu laden
2
Widget / Spalte / Abschnitt anwählen
Wählen Sie per Mausklick das Element an, welches Sie für den Responsiven Modus optimieren möchten
3
Schwellwert-Ansicht auswählen
Per Klick auf die jeweiligen 3 Schwellwert-Symbole "Desktop" , "Tablet" und "Smartphone", aktivieren Sie jeweils eine Simulation, wie Ihre Seite / Ihr Abschnitt / Ihr Widget / Ihre Spalte ind dieser Bildschirmbreite aussehen könnte
4
Eigenschaften mit Responsiv-Option
In Elementor sind immer DIE Eigenschaften eines Widgets / einer Spalte / eines Abschnitts für die Responsiv-Anpassungen freigegeben, die neben dem Eingabe-Feld ein kleines Desktop-Symbol (/ Tablet-Symbol /Smartphone-Symbol) aufweisen
5
Einstellungen vornehmen
Geben Sie jeweils für 1 Eigenschaft die gewünschten, vom "Desktop"-Modus abweichenden, Einstellungen im "Tablet"-Modus ein.
Geben Sie jeweils für 1 Eigenschaft die gewünschten, vom "Tablet"-Modus abweichenden, Einstellungen im "Mobile"-Modus ein.
6
Speichern / Veröffentlichen
Klicken Sie abschließend oben rechts in der horizontalen Editor-Leiste auf den pinken Veröffentlichen-Button, um die vorgenommenen Responsiv-Einstellungen zu speichern
Bitte beachten Sie, dass die vorgegebenen Schwellwerte lediglich die gängigsten aktuellen Maße sind und einfach als Orientierung dienen, Ihre Seite auf allen Geräten und Bildschirmbreiten professionell zu gestalten.
