Drücke die Tasten ◄ ► für weitere Artikel  

Responsive Webdesign: flexibles CSS-Framework Gumby bringt UI-Toolkit mit

Webdesigner können auf eine immer größere Auswahl an Tools und Frameworks für Responsive Webdesign zurückgreifen. Ein neuer kostenloser Vertreter ist Gumby: Dabei handelt es sich um ein CSS-Framework, das sich flexibel anpasst und zudem ein UI-Toolkit mitbringt. Praktisch: Webdesigner können auf eine Reihe von grafisch hübschen Buttons, Tabs und Navigationselemente zurückgreifen, ohne selbst Hand anlegen zu müssen.

Responsive Webdesign: flexibles CSS-Framework Gumby bringt UI-Toolkit mit
Responsive Webdesign: Gumby bringt ein UI-Toolkit mit
Responsive Webdesign: Gumby bringt ein UI-Toolkit mit

Responsive Webdesign: Grid-System, UI-Toolkit und Prototyping

Gumby ist responsive, reagiert also automatisch auf verschiedene Bildschirmauflösungen und passt die Website für die Anzeige auf Desktop-Rechnern, Smartphones und Tablets entsprechend an. Das Framework basiert dabei auf einem 960px-Grid-System. Anwender können eine Gumby-Version mit 12 Kolumnen, 16 Kolumnen, eine Hybrid-Fassung und ein All-in-one-Paket herunterladen. Teil des Download-Pakets sind zudem Photoshop-Dateien, die zwecks Gestaltung mit dem Grid-System nutzen können.

Großer Pluspunkt von Gumby: Es bringt ein UI-Toolkit mit – ganz ähnlich, wie man das von Bootstrap von Twitter kennt. So können Anwender auf eine Vielzahl von vorgefertigten Website-Elementen wie Buttons, Navigationselementen, Tabs und Formulare zurückgreifen – und müssen diese nicht selbst entwerfen. Die zusätzliche Einbindung von etwas JavaScript erzeugt zudem nette Effekte. Auch bringt das CSS-Framework die Möglichkeit des schnellen Prototypings mit, sprich: mit wenigen Klicks ist ein „interaktives Grundgerüst“ erstellt, das beispielsweise Kunden gezeigt werden kann.

Die sehr gute Dokumentation von Gumby erleichtert den Einstieg. Wer sich trotzdem nicht sicher ist, ob er das Framework nutzen möchte, kann sich etliche Demos des auf der Website des Projekts ansehen.

Weiterführende Links: 

Kostenloses CSS-Framework für Responsive Webdesign (t3n)
50 kostenlose Einsteigertools für Responsive Web Design (t3n)
5 kostenlose jQuery-Bildergalerien für Responsive Webdesign (t3n)

61 Shares bis jetzt – Dankeschön!

Bewerten
VN:F [1.9.22_1171]
4 Antworten
  1. von Anton Meier via facebook am 21.05.2012 (13:56Uhr)

    Prima.

  2. von Micha am 21.05.2012 (16:27Uhr)

    Danke für den guten Tipp. Wobei ich den Begriff Kolumnen nicht besonders schön gewählt finde. Spalten wäre wohl passender. :)

  3. von Dirk Jesse am 25.05.2012 (11:54Uhr)

    Schon im IE8 ist dieses Framework offensichtlich nicht mehr zu gebrauchen, so viele gravierende Darstellungsfehler, wie die Website+Doku (welche ja auf dem Framework basieren) aktuell zeigen. Schade, dass Ihr Euch um solche Probleme nicht sorgt.

  4. von Responsive Webdesign: flexibles CSS-Fram… am 27.05.2012 (09:31Uhr)

    [...] Responsive Webdesign: flexibles CSS-Framework Gumby bringt UI-Toolkit mit Praktisch: Webdesigner können auf eine Reihe von grafisch hübschen Buttons, Tabs und Navigationselemente zurückgreifen, ohne selbst Hand anlegen zu müssen. Gumby ist responsive, reagiert also automatisch auf verschiedene Bildschirmauflösungen und passt … Read more on t3n Magazin [...]

Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema Responsive Webdesign
t3n-Aktion: Jahresabo inklusive Fachbuch „Praxiswissen Responsive Webdesign“
t3n-Aktion: Jahresabo inklusive Fachbuch „Praxiswissen Responsive Webdesign“

Möchte man für unterschiedliche Geräte anpassungsfähige Websites erstellen, ist „Responsive Webdesign“ das Stichwort. Um sich damit vertraut zu machen, ist Designern und Entwicklern das Buch.. ... » weiterlesen

Pure: Minimalistische CSS Module für Responsive Webdesign
Pure: Minimalistische CSS Module für Responsive Webdesign

Für Responsive Webdesign gibt es verschiedenste Herangehensweisen. Viele Frameworks bieten mehr oder weniger unkompliziert nutzbare Komponenten für die Gestaltung responsiver Webseiten.... » weiterlesen

Responsive Webdesign, Teil 3: Darstellung von Galerien und Videos
Responsive Webdesign, Teil 3: Darstellung von Galerien und Videos

Mit der Serie „Responsive Webdesign“ wollen wir euch die Entwicklung flexibler Projekte erleichtern. In Teil 3 zeigen wir Möglichkeiten auf, Galerien, Videos, Bilder und Slider für die... » weiterlesen

Kennst Du schon unser t3n Magazin?

t3n 35 jetzt kostenfrei probelesen! Alle Inhalte des t3n Magazins Diesen Hinweis verbergen