4

Is there a general rule to calculate padding/margin values to make web page layout more err... beautiful? (Spacing between elements on a page, between elements and page borders, etc.)

1
  • 3
    No, there is no general rule.
    – DA01
    Mar 25, 2015 at 16:30

2 Answers 2

3

This seems to be more of a graphic design question than UX question. But there's something called "vertical rhythm" that might help in laying out the flow of elements on a page.

Here's some references to get started if you're dealing with webpages:

It treats typography as king when it comes to spacing. Using your base font size, determine the line height required for comfortable reading when you have paragraphs of text. Using that line height, lay out your vertical grid. Then adjust all typography as well as your elements according to that grid.

Try to always fit elements as a multiple (or halves or thirds) unit of your line height. Apply this first for your typographical elements, then extend it to your other elements: forms, containers etc...

Some examples: enter image description here

enter image description here

It's a bit of an art to make it look ecstatically pleasing, but there's lots of resources on this topic.

2

There is no general rule

However, here are some concepts and approaches that UX designers use. You may want to look up these terms to help you think through layout:

  • UI or UX layout
  • White space or breathing space.
  • Grid alignment
  • OS guidelines (look for layout metrics for iOS, Android, Windows, for example)

This set of terms should help you get started.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.