Grid Calculatur: Seitenraster leichter berechnen

G

Raster- oder Gridbasiertes Webdesign setzt sich zunehmen durch. Auch das neue Design des Agenturblogs (das hoffentlich in den nächsten 10 Tagen das Licht der Welt erblicken wird und dieses „Übergangssituation“ ablöst) setzt auf Grids. Einer der ersten Aufgaben die man sich als Gestalter dabei zu stellen hat, ist ziemlich mathematisch: Die Wahl der Seitenbreite, die Anzahl der gewünschten Spalten, deren Breite und den Abstand dazwischen gilt es errechnen. Und genau hier hilft der praktische Grid Calculator. Die fünf Schieberegler lassen diese Rechenaufgaben deutlich schneller von der Hand gehen, das direkte visuelle Feedback lädt darüberhinaus zum experimentieren ein. Danke dafür Matthew Pennell!

7 Kommentare

  • Schön, dass sich dieses momentane Design verändert. Es war echt ein Schritt rückwärts ;-)

    Gruß Marc

  • Praktisch, da muss man sich nicht mehr mit dem Taschenrechner hinsetzten ;-)

    Falls die Seite mal down ist, die Formel von Khoi Vinh und Mark Boulton: (Seitenbreite – ((Anzahl der Spalten – 1) * Gutter )) / Anzahl der Spalten

  • Ich habe ein WordPress-Plugin entwickelt, dass einem nicht nur die Berechnung abnimmt, sondern auch noch eine Hintergrundgrafik zimmert und automatische CSS-Klassen als Template-Funktionen aufährt. Es ist noch nicht ganz fertig. Aber hier kann man schon was sehen:
    http://spqr.ws/?grid=displa...
    Die Breiten und die abstände vom linken Rand sind automatisch generiert.

  • […] tutorialblog.org/grid-systems-in-web-design/ agenturblog.de/2007-05/grid-calculatur-seitenraster-leichter-berechnen/ smashingmagazine.com/2007/04/14/designing-with-grid-based-approach/ […]

Instagram