Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

One-Page-Webseiten mit Bootstrap, LESS und Sass

LESS und/oder Sass – ein Überblick

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Egal ob Sie LESS oder Sass verwenden – für beide gibt es Bootstrap auch in nicht-kompilierter Form. Sehen Sie, worin die Unterschiede liegen.
03:38

Transkript

Wenn Sie in ausgesprochen klassischer Weise mit "Bootstrap" arbeiten wollen, haben Sie es wahrscheinlich mit diesen drei Ordnern zu tun. Das ist einerseits der CSS-Ordner, wo all diese "Bootstrap"-eigenen CSS-Dateien entweder minimiert oder auch nicht minimiert hinverlegt sind, den "fonts"-Ordner, in dem die Glyphicons drinliegen und mit den JavaScript-Dateien, beziehungsweise mit der JavaScript-Datei, einmal nicht komprimiert und einmal komprimiert. Mit diesen drei Ordnern und nachher noch vielleicht einem Bilder-Ordner und den HTML-Dateien kann man sehr schnell Webseiten bauen, die auch eben responsive sind -- ist aber nur quasi die halbe Miete, denn es gibt "Bootstrap" nicht nur in dieser schönen fertigkompilierten Form, sondern Sie können sich "Bootstrap" auch noch nicht kompiliert herunterladen, und dann haben Sie es einerseits mit dieser Menge an Dateien zu tun, wobei die meisten davon hauptsächlich für die Entwickler notwendig sind, aber Sie können dann mit Präprozessoren arbeiten. Das heißt, in diesem Falle mit einem Präprozessor namens "LESS", und da sind die Dateien dann aufbereitet für den Umgang mit "LESS" und können später erst kompiliert werden. "LESS" ist nämlich als Präprozessor dafür zuständig, den Umfang von CSS zu erweitern. Und "LESS" ist der Präprozessor, mit dem "Bootstrap" ureigens arbeitet. Es gibt zwei Möglichkeiten, dann mit den "LESS"-Dateien zu verfahren: Entweder man legt die Arbeit bei den Klienten ab, das heißt, "Client"-seitig wird statt CSS direkt die "LESS"-Datei ausgegeben, noch erweitert durch diese "less.js"-Datei und die Browser des Klienten müssen dann mit diesen "LESS"-Dateien umgehen können, was allerdings nur die neuesten können, oder es gibt auch einen zweiten Präprozessor namens "Sass", und es gibt "Bootstrap" auch vorkompiliert, beziehungsweise noch nicht kompiliert für "Sass". Da ist dann die interne Struktur nochmal ein Stück anders, und dann liegen die für uns spannenden Dateien alle in den "assets". "Sass" ist ebenfalls ein Präprozessor, allerdings etwas älter schon als "LESS" und mit etwas mehr Renommee, wenn ich das so sagen darf. "Sass" wird vor allem auch im Linux-Bereich sehr häufig verwendet, und falls Sie sowieso schon mit "Sass" arbeiten, liegt es natürlich nur nahe, dass Sie sich diese an "Sass" angepasste Version nehmen und holen werden. Egal, mit welchem von beiden Sie dann arbeiten: Der Vorteil von diesen Präprozessoren besteht eben darin, dass sie die Möglichkeiten von CSS erweitern. Einerseits, indem Sie Funktionen setzen können, indem Sie Variablen einsetzen können, indem Sie fertige Versatzstücke nehmen können und wieder als Klassen einsetzen. Und am Ende haben Sie es dann mit einer Seite zu tun, die eben den Ansprüchen genügt, die heute an eine Webseite gestellt werden, die auf mehreren Ausgabegeräten gut aussehen muss. Das heißt, Sie bekommen eine responsiv arbeitende Webseite, die eben auf die unterschiedlichen Displaygrößen gut reagieren kann.

One-Page-Webseiten mit Bootstrap, LESS und Sass

Erstellen Sie eine moderne Website im One-Page-Design, die mit wenigen Dateien auskommt und mit Effekten wie Parallax Scrolling aufwartet.

2 Std. 1 min (28 Videos)
Derzeit sind keine Feedbacks vorhanden...
 

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!