Template – Dashboard – Entwurf mit Bootstrap

Allgemein Schlagwörter: , 1 Kommentar
Template – Dashboard – Entwurf mit Bootstrap

Bootstrap 3 von Twitter bietet eine ausgezeichnete Grundlage für die Webentwicklung. Ich stelle euch einen Dashboard – Entwurf und Erweiterungen vor. Bootstrap ist ursprünglich aus dem Vorhaben entstanden, die internen Analyse- und Verwaltungswerkzeuge von Twitter weiterzuentwickeln. Zu diesem Zeitpunkt wurden in dem Unternehmen unterschiedlichste Bibliotheken für die Oberflächenentwicklung eingesetzt, was zu Inkonsistenz und hohem Wartungsaufwand führte. Um diesen Herausforderungen zu begegnen, wurde der Fokus des Projekts erweitert:

„[…] eine sehr kleine Gruppe von Entwicklern und ich haben sich zusammengesetzt, um ein neues internes Werkzeug zu gestalten und sahen dabei die Möglichkeit, mehr daraus zu machen. Während des Prozesses stellten wir fest, dass wir dabei waren, etwas zu erschaffen, was wesentlich weitreichender war als nur ein weiteres internes Werkzeug. Monate später hielten wir eine frühe Version von Bootstrap in den Händen, welche allgemeine Entwurfsmuster und Erkenntnisse innerhalb der Firma dokumentierte.“

– Mark Otto: In seinem persönlichen Blog zur Entwicklung von Bootstrap.

Bootstrap wurde mit Unterstützung für das damals noch relativ junge HTML5 und CSS 3 entwickelt. Da Bootstrap ab Version 3 weder Firefox 3.6 noch den Internet Explorer 7 unterstützt, wird in einem Übergangszeitraum weiterhin auch Version 2 aktualisiert. Der Gewährleistung der Browser-Kompatibilität dient das Konzept der progressiven Verbesserung. Das bedeutet, dass die grundlegenden Informationen der Webseite oder -anwendung für alle Geräte und Browser zugänglich sind, erweiterte Funktionalitäten jedoch nur den Geräten und Browsern zur Verfügung stehen, die diese unterstützen. Deutlich wird dies beispielsweise bei den in CSS 3 eingeführten Eigenschaften für abgerundete Ecken, Farbverläufe und Schatten. Diese werden von Bootstrap trotz der mangelnden Unterstützung durch ältere Webbrowser intensiv eingesetzt. Dabei gewährleistet der semantische Einsatz von HTML und die Implementierung von alternativen Stildefinitionen in den Stylesheets, dass die Informationen und Funktionen der Webseite trotz der fehlenden Funktionalitäten bei älteren Browsern zur Verfügung stehen. Gleiches gilt für die mitgelieferten JavaScript-Komponenten. Diese erweitern den Funktionsumfang des Toolkits, sind jedoch keine Voraussetzung für dessen Einsatz.

Entwurf

Template – Dashboard – Entwurf mit Bootstrap

 

Template – Dashboard – Entwurf mit Bootstrap

 

Template – Dashboard – Entwurf mit Bootstrap

 

Screenshots

 

Die Links

Calendar
Profile
Morris Charts
Flot Chart
Email Template
Dashboard

Trackbacks für diesen Beitrag

  1. Post von den Webmaster-Tools erhalten - Pop-Art Portraits und mehr von r23

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Business Shooting

Mit dem visuellen Erscheinungsbild beginnt alles. Egal ob Du Freelancer, langjähriger Unternehmer oder Verantwortlicher eines Start-ups bist – Du musst nach außen kommunizieren, für welche Kompetenzen und Botschaften Du stehst.
Imagefördernde Fotos unterstützen ein Unternehmen dabei, sich erfolgreich und attraktiv zu präsentieren und damit neue Kunden anzusprechen.
Bei meiner Arbeit geht es mir sowohl um die ausdrucksstarke und kompetente Darstellung der Führungskräfte und Mitarbeiter als auch um die repräsentative Abbildung der Produkte.

Aktuell

Blog via E-Mail abonnieren

Gib Deine E-Mail-Adresse an, um diesen Blog zu abonnieren und Benachrichtigungen über neue Beiträge via E-Mail zu erhalten.