Question

I am looking for the Windows Look and Feel Design Guidelines (but not the one for Windows Vista!) that details the ideal gap between elements, etc. I found the document originally a few years back on MSDN but now I can’t find it.

I’ve started a new job the same thing is occuring here as before: A program written and added to over the years by several different people with differing ideas about UI. While I’ve got a chance on a Friday afternoon I’d thought I’d tidy up the layout

Answer 1

Its new home is:

• MSDN Library
  • Windows Development
    • Windows Application UI Development
      • Windows User Experience Interaction Guidelines
        • Guidelines
          • Visuals
            • Layout → Recommended Sizing and Spacing

e.g.:

Control sizing

The following table lists the recommended sizes (width x height, or height if a single number) for common UI elements (for 9 pt. Segoe UI at 96 dpi). The widths based on the longest item in English add 30 percent for localization (up to 200 percent for shorter text) for any text (but not numbers) that will be localized.

Command Buttons

_{(source: microsoft.com)}

Dialog Units: 50 x 14
Relative Pixels: 75 x 23

Spacing

The following table lists the recommended spacing between common UI elements (for 9 pt. Segoe UI at 96 dpi).

Dialog box margins

_{(source: microsoft.com)}

Dialog Units: 7 on all sides
Relative Pixels: 11 on all sides

Text label beside a control

_{(source: microsoft.com)}

Dialog Units: 3 down from the top of the control
Relative Pixels: 5 down from the top of the control

---

There’s also the page that explains what Dialog Units are: Layout, Device Independent Layout: