Welcome to TalkGraphics.com
Results 1 to 7 of 7
  1. #1

    Default 12 column grid for layouts

    Hi all.

    I'm kind of starting fresh with my website. So reading up it seems recommended that you use a 12 column layout to keep boxes, text etc neat.

    My question is what do people use?

    I started with lines on a grid layer, then thought transparent block. Now I'm not sure. So my question is what do the experts hear recommend?

    BTW as always if you read this, thanks

    Tim

  2. #2
    Join Date
    Dec 2018
    Location
    Australia
    Posts
    1,121

    Default Re: 12 column grid for layouts

    Honestly? I basically wing it. I lay out the rough look I'm after given the clients wishes and photos. I only look at spacing and geometry at the end, after I'm as happy as I'm going to be with the overall look.

    I usually do the desktop version first (somewhere between 1080 to 1200 with Stretch To Fit Width). I then make the mobile variant (640).

    Going out on a limb and guessing that Acorn uses grids and things Pythagoras would be proud of; he has a mathematical mind. My mind is just marshmallow and tumble weed.

    Luke Mumby Music
    Lake Bolac Caravan Park
    index (auzlink.net.au)
    Bryon Williams Author (bryonsbooks.com.au)
    Wilson & Wilson Legal (wilsonandwilsonlegal.com.au)

  3. #3

    Default Re: 12 column grid for layouts

    Hi,

    I was winging it then it I could not make it consistent. I will follow your lead on doing the main first then the mobile

    This is my route so far

    I used this site work out the grid http://gridcalculator.dk to work out my spacings
    My settings were Width 1220 Gutter 40 Columns 6 Margin 30

    From that I set the grid in Xara to 40pxls

    And set up 6 columns at the right spacing and placed them at the back on there own layer that is locked.

    It's working well so far.

    Tim

  4. #4
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    13,291

    Default Re: 12 column grid for layouts

    Quote Originally Posted by Chris M View Post
    Going out on a limb and guessing that Acorn uses grids and things Pythagoras would be proud of; he has a mathematical mind. My mind is just marshmallow and tumble weed.
    I hate clutter.

    I always start with the index page.
    I create a vertical Guide down the middle.
    I add Guide outriggers - 32px in left & 32px back right.
    I set a horizontal Guide to be the base of the Menu Bar.

    I set a Footer Guide.

    I make most of my images and text areas have a push of 4px.

    I use rectangles of 2px thickness and never lines as a Xara Line is an image!

    Yes, I use maths - powers of 2 where possibly.
    Why. Scaling into a Variant then does not end up with fractions.

    I then break the mould with images larger or smaller to occasionally break the top to bottom flow.

    A grid approach is only really useful for a responsive site and with flex being more prevalent, even this has had its day.

    Acorn
    Acorn - installed and active Xara software: Cloud+/Pro+, XDPX, XWD Premium 15 & 12, XPGD10, X3D7, Xara Xtreme 5, back through time (to CC's Artworks).
    Raise software faults with MagiXara: http://support.magix.net/; if Cloud+/Pro+: https://xara.com/contact-us/

  5. #5
    Join Date
    Dec 2018
    Location
    Australia
    Posts
    1,121

    Default Re: 12 column grid for layouts

    I didn't know what to expect, but that seems rather straight forward for an Acorn response

  6. #6
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    13,291

    Default Re: 12 column grid for layouts

    Quote Originally Posted by Chris M View Post
    I didn't know what to expect, but that seems rather straight forward for an Acorn response
    Success, I am starting to make you think!

    Acorn
    Acorn - installed and active Xara software: Cloud+/Pro+, XDPX, XWD Premium 15 & 12, XPGD10, X3D7, Xara Xtreme 5, back through time (to CC's Artworks).
    Raise software faults with MagiXara: http://support.magix.net/; if Cloud+/Pro+: https://xara.com/contact-us/

  7. #7
    Join Date
    Mar 2018
    Location
    Morelos, Mexico
    Posts
    215

    Default Re: 12 column grid for layouts

    Hi, TimBox. I always use a column layout. With 12 columns for the desktop variant and with 4 columns for the mobile variant. If I include a tablet variant, it has 8 columns. I try to adjust the gutters and margins in a way that the column widths are identical (or at least close) across variants. It's never an exact science.

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •