Dr.Web - Das Online Magazin für Seitenbetreiber

CSS Raster Generatoren / Grid Generators

Werbung

Das Raster als Gestaltungsgrundlage ist umstritten. Wer sich damit auseinandersetzen will, braucht nicht zwingend ein Framework, er könnte auch zum Grid-Generator greifen und erhält - mit Einschränkungen - einen WYSIWYG-Modus für den Ausbau seines Grids. Mit den Generatoren lässt sich ohne Installation herumspielen. Da bekommt man schnell ein Gefühl dafür, was man eventuell brauchen könnte. Schließlich gibt es auch diese hilfreichen Geister von komplex (YAML Builder) bis schlicht (Construct). Zum Teil ist Flash erforderlich.

Gritbuilder
Hier lassen sich erstellte Container schön mit der Maus hin und her schieben. Speichern kann man hier allerdings nichts, auch kein Quellcode ist verfügbar. Die Sache ist eher dazu gemacht, sich eine Vorlage für ein anderes Programm (zum Beispiel) zurechtzubasteln. Screenshotten ist natürlich kein Problem.

Screenshot
YAML Builder
So ziemlich das Umfangreichste, was man sich zu diesem Thema vorstellen kann. Die Abbildung deutet es schon an, hier ist eine Menge drin. Und auch seinen Quellcode kann man mitnehmen. Neben den zahlreichen Optionen gibt es auch Drag & Drop.

Screenshot

Blueprint Grid CSS Generator
Der Generator zum Blueprint Framework.

Screenshot

YUI CSS Grid Builder
Der Generator für das YUI Framework, welches wir Ihnen in diesem Artikel vorgestellt haben: Grids CSS: ein zeitsparendes System für das Layout.

Screenshot

GRIDmaker
Gespeichert werden die Raster als Grafik im PNG-Format.

Screenshot
Gridinator
Hier gibt es auch CSS- und HTLM-Dateien.

Screenshot

Grid Designer
Dieser Generator versteht sich auch auf die Typographie. So lassen sich die erzeugten Spalten einzeln gestalten, was praktischerweise mit direkten Werten oder über Buttons unternommen werden kann.

Screenshot

Grid Calc
Baut eine Seite live zusammen. Die Kontrollen können zur Seite geschoben werden.

Screenshot

Construct your CSS

Screenshot

Grid Calculator

Sei der Vollständigkeit halber auch noch erwähnt. (tm)

Über Sven Lennartz

GravatarSven ist der Erfinder des Dr. Web Magazins, Autor und Herausgeber verschiedener Fachbücher. Als Webdesigner und Texter früher freiberuflich für verschiedene Unternehmen und Verlage tätig. Jetzt Geschäftsführer der Smashing Media GmbH. Website. Weitere Beiträge für Dr. Web: 1231

Verwandte Artikel

Bookmarken! Diese Icons verlinken auf Bookmark Dienste bei denen Nutzer neue Inhalte finden und mit anderen teilen können.
  • MisterWong
  • del.icio.us
  • TwitThis
  • Hype
  • StumbleUpon
  • Facebook
  • Google Bookmarks
  • Linkarena
abstimmenabstimmenabstimmenabstimmenabstimmen (No Ratings Yet)

11 Kommentare zu “CSS Raster Generatoren / Grid Generators”

  1. 1
    22.01.2009 09:23

    Irgendwie konnte ich mit den guten Teilen noch nicht warm werden. ICh finde man ist da ein wenig zu gebunden, klar geht es schnell ein Layout zusammenzuklicken aber irgendwie bin ich dann zu sehr gebunden an gewisse Sachen.

    Schon allein das dieses YAML dann etliches CSS Dateien nutzt macht mich verrückt :)

    Vielleicht stell ich mich auch einfach zu blöd an,,,

    Antwort

  2. 2
    22.01.2009 10:30

    Gibt es eine Möglichkeit, einen Griddesigner mit einem Online-Text-Editor zu verknüpfen?

    Ich suche seit langem eine Plattform, über die man seine Webseiteninhalte in ein Magazin-Format kleiden kann, um es anschließend als PDF-Ausgabe zu nutzen (PDF-Buch, PDF-Magazin, PDF-Newsletter). So ein Grid-Designer wäre ideal, um schnell ein persönliches Magazin-Template zu erstellen, wenn ich auf der anderen Seite noch die (z.B. per RSS eingespielten) Inhalte editieren könnte, wäre alles perfekt...

    Antwort

  3. 3
    22.01.2009 13:07

    Das "960 Grid System" ist zwar kein Generator, aber ein wirklich brauchbar/schlankes CSS Framework. Der Screencast von Jeffrey Way erklärt das Ganze ziemlich anschaulich:

    http://kolos.blogger.de/storie

    Antwort

  4. 4
    30.01.2009 13:28

    Wie so alles im Leben helfen kleine Regeln etwas Ruhe in unseren Alltag zu bringen. so auch ein gutes Grid System ;)

    Ralph

    Antwort

  5. 5
    Philo Gensfleisch
    7.03.2009 17:22

    Ohne Raster keine Ordnung in der Gestaltung. Inwieweit Raster beim CSS-Schreiben sinnvoll ist vermag ich nicht einzuschätzen; IMHO kommt es an der Stelle zu spät. Vielmehr sollte es schon beim grafischen Entwurf zum Einsatz kommen.

    Antwort

  6. 6
    5.05.2009 13:42

    Es lohnt sich den "YAML Builder" genauer unter die Lupe zu nehmen!

    Gruss Miranda

    Antwort

  7. 7
    22.05.2009 10:04

    Hallo!

    Ich möchte an der Stelle meinen kleinen Grid-Rechner vorstellen, mit dem man auch einen Raster berechnen kann. Ich habe mich auch um eine Möglichkeit gekümmert, per Skript automatisch für Photoshop den Hilfslinien-Grid anlegen zu lassen.

    Hoffe, der Rechner wird für jemanden nützlich sein!

    http://gridcalc.leolezner.de/

    Antwort

Trackbacks

  1. Guru 2.0 » Raster mit CSS
  2. links for 2009-01-30 | svenkubiak.de
  3. freggeln » Blog Archive » Empfehlungen der Woche - Sunday, 1. February 2009
  4. CSS Raster Generatoren « Insomniaonline

Meine Meinung

Bitte beachten Sie: Werbung und Spam sind unerwünscht und können eine Rechnung zur Folge haben. Woher kommen die Bilder neben den Kommentaren?