Die gestiefelte Website

Mobile Websites mit Bootstrap und Less

Wissen | Know-how

Ohne großen Aufwand eine Homepage bauen, die auf dem Smartphone ebenso gut aussieht wie auf dem PC: Bootstrap machts möglich. Damit die Site nicht wie von der Stange aussieht, modifizieren Sie das Frontend-Framework mit der flexiblen CSS-Metasprache Less – das geht ganz einfach.

Soll eine große Website auch auf kleinen Bildschirmen gut aussehen, wird die Umsetzung schnell kompliziert. Texte, Bilder und Videos müssen auf dem Smartphone mit wenig Platz auskommen – und der Besucher muss trotzdem noch was erkennen können. Es geht aber einfacher: Mark Otto und Jacob Thornton haben die Arbeit bereits erledigt und ihre Lösung unter dem Namen Bootstrap veröffentlicht. Mit dem CSS-Framework bauen Sie Websites, die sowohl auf Smartphones als auch auf Tablets und 27-Zoll-Bildschirmen gut aussehen.

Ursprünglich entstand Bootstrap zur internen Nutzung bei Twitter, erschien aber 2011 als Open-Source-Projekt. Dank MIT-Lizenz dürfen es Webdesigner ohne Einschränkungen nutzen, anpassen und weiterentwickeln. Heute ist Bootstrap eines der erfolgreichsten Projekte auf GitHub, das die Community kontinuierlich weiterentwickelt. Für Version 3 haben die Beteiligten das Framework komplett erneuert und konsequent an den Mobile-First-Ansatz angepasst: Hierbei planen und entwickeln Webdesigner ihre Sites zuerst für Mobilgeräte und passen sie dann in weiteren Arbeitsschritten an größere Bildschirme an. Webdesigner gestalten also von klein nach groß – statt wie bisher in der Gegenrichtung. ...

Sie möchten wissen, wie es weitergeht?

Als c't-Plus-Abonnent gratis lesen

Anmelden als c't-Plus-Abonnent

weiterführende Links

Weitere Bilder

  • Baut man von Bootstrap einen „Custom-Build“, muss der nur die gebrauchten Komponenten enthalten. Auf diese Weise wird das Framework schlanker.

Anzeige
Anzeige