5 Jahre ist Foundation für Rapidweaver nun alt. Die Stacks von Joe Workman basierten auf Version 5 vom Zurb Framework. Nun ist die neue Version erschienen.
Wer mit Rapidweaver und diversen Frameworks Webseiten erstellte, kannte ein Hauptproblem: Die Dauer der Vorschau verlängerte sich mit der Anzahl an verwendeten Stacks. Das lag daran, dass jeder Stack eine Vielzahl an Einstellungsmöglichkeiten mitbrachte und diese auch in den Code der Seite eingebunden werden mussten.
Das hat sich nun geändert. Durch ein neues Konzept mit dem Namen Swatches, ist jeder Foundation Stack nun sehr viel schlanker und bringt überraschend wenig Einstellungsmöglichkeiten mit. Die Konfiguration der Einstellungen erfolgt nun in den Swatches, welche sich nun im generalüberholten SiteStyle Stack befinden.
Wenn wir uns ein Swatch wie eine Klasse im CSS vorstellen, dann übertragen wir die Einstellung einfach auf einen gewünschten Stack, indem wir den Namen des Swatches nun einfach in die Klasse des gewünschten Stacks eintragen. Wer sich mit CSS und die Programmierung von Webseiten auskennt, wird das Konzept kennen. Auf diese Weise werden Einstellungen zentral und global in der SiteStyle-Palette eingerichtet und können so ganz einfach auf andere Stacks angewendet werden. Einfach und sehr effektiv. Änderungen sind nun ein Kinderspiel, denn man ändert nicht mehr jeden Stack einzeln in den Einstellungen, sondern an einer Stelle.
Am Anfang benötigt man für das Konzept ein wenig Eingewöhnungszeit, aber schon nach den ersten erfolgreichen Änderungen merkt man die Möglichkeiten und den Geschwindigkeitsvorteil.
Durch dieses Konzept ist der Code schlank und schnell und ist fast nicht von handprogrammiertem Framework-Code zu unterscheiden. Eine Vorschau dauert nur einen kurzen Augenblick. Google Page Speed Insights liebt schnellere Webseiten und belohnt diese mit einem besseren SEO-Ranking.
Es sind durch das neue Konzept Dinge möglich, die vorher nicht so einfach umzusetzen waren. Als Beispiel stellen wir uns einen Button vor, der mit einem Bild versehen werden soll. Wir legen einfach einen Swatch an, wählen ein Hintergrundbild und vergeben dem Swatch den Namen "buttonBild". Fügen wir nun einen Button in die Seite ein (es gibt nun für jeden Anwendungszweck verschiedene Button in Foundation 6), dann brauchen wir nur in die Klasse des Buttons den Namen "buttonBild" hineinschreiben - voila: der Button hat ein Hintergrundbild.
Der Programmierer Joe Workman bietet auf seiner Webseite eine vielzahl an Stacks an. Einige bekommen nun eine Unterstützung von Foundation 6. Hat man z.B. den Stack "Page Safe" in seiner Sammlung, dann zeigt sich in der Style-Palette nun ein Punkt zum Hinzufügen eines Swatches für Page Safe. Einstellungen können nun zentral hier getätigt werden und wenn man ein Partial aus der Style-Palette erstellt, ist alles an seinem Platz.
Weitere Stacks mit diesen Möglichkeiten sind bisher:
Es sind wirklich unglaublich viele Unterschiede und man könnte sie hier jetzt nicht alle aufzählen. Aber hier einige wichtige Unterscheidungen:
Die Vorteile sind vor allem der schlankere Code, die schnellere Vorschau und das erheblich schnellere Ändern und Aufbauen der Webseite.
Es gibt auch eine Set an Utility-Klassen. So kann man z.B. ganz einfach den Abstand eines Objekts ändern, in dem man in das Feld für die Klasse p:64 hineinschreibt. Das ist das kurze Kommando von Padding:64 Pixel. Der Kurzbefefehl pb:12 ist dann Padding-Bottom:12 Pixel. So braucht man dafür kein neues Swatch anlegen, hat aber wieder einen Bereich, den man lokal und nicht mehr global ändern muss. Mehrere Klassen können mit einem Leerzeichen getrennt hineingeschrieben werden.
Foundation 6 ist auf dem ersten Blick nicht ganz so intuitiv wie die erste Version. Anfangs sucht man die Stacks-Einstellungen wie gewohnt in der Seitenleiste und findet dort nur minimale Möglichkeiten. Hat man aber das Konzept verstanden, möchte man keine Sekunde zurück.
Einige Dinge fehlen noch und werden mit den nächsten Updates kommen. Darunter ist die Unterstützung von FontAwesome 5. Auch sind bisher nicht alle Animationen vorhanden und ein animiertes Hamburger-Menü ist noch nicht möglich, soll aber ebenfalls kommen.
Meiner Meinung nach ist Foundation 6 das wichtigste Tool für meine Arbeit als Webdesigner für die nächsten Jahre. Es gibt mittlerweile diverse Frameworks für Rapidweaver, welche die Arbeit erleichtern. Foundation 6 jedoch geht einen großen Schritt voraus, indem es auf ein neues, schlankes und effektives Bedienungskonzept setzt. Für meine Arbeit ist es wichtig, dass man nicht verschiedene Tools ankratzt, sondern sich tief in eine Lösung einarbeitet. Nur so kann man effektiv, schnell und sauber Webseiten in sehr guter Qualität umsetzen. Foundation 6 ist hier in vielerlei Hinsicht führend und wird meine Arbeit für die nächsten Jahre maßgebend beeinflussen.
Ich kann es nur jedem wärmstens empfehlen, der moderne Webseiten erstellt und ein flexibles Werkzeug sucht – ganz gleich privat und beruflich. Foundation 6 ist in jedem Fall ein Gewinner.
Webdesigner und Fotograf
Der Beitrag „Foundation 6 für Rapidweaver“ wurde von Jochen Abitz verfasst. Er arbeitet selbstständig als Webdesigner und Fotograf bei Hannover und fotografiert in seiner Freizeit am liebsten analog auf Film.
Mail Archiver X ist eine großartige Softwarelösung für alle, die ihre E-Mails sicher und einfach archivieren möchten. Diese Anwendung ist sowohl für Privatanwender als auch für Unternehmen geeignet und bietet eine Fülle von Funktionen, die es Ihnen ermöglichen, Ihre E-Mails auf Ihrem Mac einfach und effektiv zu organisieren.
Webdesign hat in den letzten Jahren eine Menge Veränderungen durchgemacht und das wird auch im Jahr 2023 nicht anders sein. Eines der wichtigsten Trends, auf die man achten sollte, ist die Verwendung von KI-Technologie im Webdesign.
Was wäre ein Internetauftritt ohne Inhalt? Richtig, nicht viel. Da kann die Webseite technisch noch so sauber umgesetzt und noch so schön sein. Wenn der Besucher keinen Inhalt findet, weiß er nicht, wieso die Seite überhaupt existiert.
Kennen Sie das? Sie arbeiten an einem Webprojekt – Ihrer eigenen Website etwa oder als Designer oder Entwickler an der Ihrer Kunden – und Sie haben schon so viele E-Mails mit Anmerkungen, Fragen und Feedbacks geschrieben und erhalten, dass Sie den Überblick verloren haben?
Es gibt kaum noch Online-Shops, in denen keine Bewertungen zu finden sind. Käufer bewerten Produkte und den Service von Unternehmen nach eigenen Maßstäben.
Bloggen macht Spaß. Wenn die Beiträge aber nur zufällig im Internet gefunden werden, kann man das auf einfache Weise verbessern.
Webseiten müssen heute auf mobilen Geräten wie Smartphone oder Tablet gut funktionieren, damit der Besucher möglichst lange auf der Website verweilt.
Viele Betriebe wundern sich, wie schwer es geworden ist gute Leute zu finden und bieten gute Bedingungen. Dabei wird ein wichtiger Teil oftmals übersehen.
Vor nicht ganz einem Jahr startete die Reisemanufaktur feingereist eine eigene Webseite für eine besondere Reise: Die Lavendelreise-Provence.
Sie haben eine Webseite und benutzen eine E-Mail Adresse mit t-online, GMX oder ähnliches? Das sollten Sie ändern, denn sie verschenken Potential.
Die DSGVO verunsichert mehr denn je. Welche Punkte muss mann auf Webseiten berücksichtigen und einbinden, damit man nicht in eine Abmahnfalle tappt.
Warum Sie nicht mit Ihrer aktuellen Webseite zufrieden sein sollten und über eine Neugestaltung nachdenken sollten. Gewinnen Sie langfristig neue Kunden.
Ich freue mich über ihren Anruf oder eine E-Mail.