JADE 2020 wird seit Anfang 2019 für den Gutenberg-Editor weiter entwickelt. Webseiten mit JADE können dynamische Landing Pages mit Gruppen und Spalten darstellen. Der Gutenberg-Editor in JADE gibt einen guten Einblick, wie die Seite im Browser beim Besucher wirkt. Den persönlichen Stil bringen Bilder, Design-Elemente und eine eigene Farbpalette ein.
JADE! ist für eine schnelle Anzeige im Browser auf mobilen Geräten ausgerichtet. Die Pageload – die Menge der Daten und die Geschwindigkeit der Anzeige – sind auf die schnelle Darstellung der ersten Ansicht getrimmt: Over the fold.
Änderungen am Layout und Schriften
Kundenspezifische Änderungen sind nur möglich über sogen. „Child Themes“. Würden wir in das Theme beim Kunden eingreifen: „Können wir das nicht so und größer und links haben?“ bedeutet ansonsten, dass keine Updates von Sand durchgeführt werden können. Für das Anlegen eines Child-Themes wird eine Pauschale in Rechnung gestellt.
Kleine Änderungen
Manchmal sind Änderungen aber tatsächlich klein und lassen sich „mal eben“ über das Feld Custom CSS im Customizer einsetzen.
Responsive? Was sind Breakpoints?
Breakpoints sind die Stellen des Designs, an denen sich das Layout ändert, um sich besser an eine kleinere oder größere Monitorgröße anzupassen.
- Spalten brechen bei einer Monitorbreite von mind. 768px zu zwei Blöcken in einer Reihe
- bei einer Monitorbreite von mind. 920px zu 3 oder 4 Blöcken in einer Reihe
- maximale Breite des Inhalts (außer Header-Bild) ist 1440px.
Mit dem Gutenberg-Editor bietet SAND Autoren ein hohes Maß an Flexibilität beim Layout der Seiten, aber Autoren sollten immer prüfen, wie ihr Layout auf kleinen, mittleren und großen Monitoren wirkt und immer daran denken, dass ein großer – wenn nicht sogar der größte – Teil der Besucher die Seiten mit dem Handy besucht.
Insbesondere werden Webseiten über das Handy bei Freunden und Kollegen weitergegeben. Darum ist dem Erscheinungsbild auf dem Handy immer der Vorrang zu geben.
2100
Angemeldeten Autoren wird auf den Seiten ein grauer Kasten mit der Monitorbreite angezeigt, damit sie beim Layout der Seiten eine Orientierung bekommen, wie das Design bei verschiedenen Monitorgrößen wirkt und wie Blöcke umbrechen, wenn Sie auf einem Handy oder Tablett gesehen werden.
- Handys haben hochkant eine Breite von ca. 300 bis 360px
- Handys quer gehalten von ca. 480 bis 600px
- Tabletts hochkant von ca. 680 bis 800px
- Tabletts quer von ca. 900 bis 1100px
Ein Klick auf die dunkelgraue Anzeige oben links verbirgt den grauen Kasten auf der aktuellen Seite.
Besucher sehen die Anzeige der Monitorbreite nicht.