960 Grid System – Raster fürs Web

960gridsystem

960 Grid System ist ein kostenloses Raster Framework für Web-Layouts.

Raster werden im Printbereich schon seit Jahren benutzt, im Internet ist diese Technik noch nicht so verbreitet. 960 Grid System dient da als kleiner Helfer und macht das Designen mit einem Raster etwas einfacher (jedenfalls spart man sich das erstellen einer Rastervorlage).

Warum 960?
Mittlerweile ist die Monitorauflösung von 1024×768 Pixeln zum Standard geworden. Da man Scrollbalken und Fensterränder dazu rechnen muss, und evtl noch ein bisschen Platz links und rechts vom Design haben möchte wurde die Breite von 960 Pixeln gewählt. Aber nicht nur deshalb, 960 lässt sich perfekt durch folgende Werte teilen: 2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320 und 480. Das hat folgenden Grund, möchte man z.B. ein 3 Spaltiges Layout haben, so teilt man die 960 durch 3 und bekommt jeweils eine Spaltenbreite von 320 Pixeln.

Das verwenden von Rastern dient in erster Linie zur Übersichtlichkeit. Websiten mit einem Goldenen Schnitt lassen sich oft wesentlich besser betrachten und machen ein für das Auge schöneres Design.

Im Packet von 960 Grid System sind verschiedene 960 Pixel Vorlagen enthalten, Photoshop, Visio, OmniGraffle, Fireworks und CSS/HTML.

Beim nächsten Design einfach die 960 Grid System Vorlage in Photoshop laden und das Layout an die Spalten anpassen, ihr werdet den Effekt mit Sicherheit feststellen! :)

Informationen über den Autor:

Name: Aleks Maksimow
Homepage/Blog: http://www.aleksmaksimow.de
Archiv: Alle Beiträge von Aleks anzeigen »
Über Aleks:
Mein Name ist Aleks Maksimow und ich habe Anfang 2008 dieses Blog gestartet. Beruflich bin ich als Webentwickler / Programmierer tätig. Im Jahre 2005 habe ich zusammen mit einem Freund das Social-Network Morphex.eu gegründet.


Kategorie: Free Stuff

4 Kommentare »

  1. Pixel-Monster.de schreibt: :

    Das Raster fürs Web – 960Grid System…

    Moin,
    gestern schon entdeckt aber erst jetzt gepostet. Durch DesignPicks sind wir auf das 960Grid System gestoßen. Das ganze stellt ein Raster-Framework für Webseiten dar. Viele Webdesigner werden Ihr ganz eigenes System entwickelt haben, so auch wir…

  2. » Emastic - schlankes CSS Framework - im Designpicks Blog schreibt: :

    [...] 4 KB (compressed) große CSS Framework bietet so einiges für seine größe. Ähnlich wie bei dem 960 Grid System lassen sich rasterbasierte Layouts schnell und einfach erstellen. Mit dem Framework lassen sich [...]

  3. Malte schreibt: :

    Ich arbeite auch sehr gern mit dem 960Grid … spart ne Menge arbeit und man hat schnell einen guten Workflow organisiert.

  4. Piktogramme basieren auf Rastern « SRH-Gestaltung schreibt: :

    [...] mehr zu Rastersystemen>> [...]


Kommentar schreiben:


Weitere Beiträge über dieses Thema: