Set up best practice

website-publishing
adaptive-views
#1

Just a curious question. For those who design exclusively for desktop; what is your initial document set up? Screen size, column and grid, etc.

#2

This has been an ongoing debate since forever… or at least since the dawn of the PC (Apple and older companies control all aspects of their products, so more of a known thing) …Google search for “screen sizes to design for”

For me, working on corporate projects, these seem to change project to project… Screen size can be based on various criteria, like

  • Developer and Quality Assurance/Testing standards and/or preferences. A lot of times QA will have an existing test bed (specific screen resolution and dimensions they use) and need to see designs that match that.
  • Most likely customer environment (mostly screen dimensions)
  • Smallest screen likelihood, and/or “worst case scenario”
  • Marketing preferences or dictates, like new computer/monitor products the company is offering and wanting to highlight
  • Etc.

I tend to use 1024x768 or 1280x720 most commonly, and a lot of that is driven by a global market and “semi-worst case” or “emerging market” scenarios, so its smaller than what is now the most common screen size of 1366x768, according to Britannica (see also general search results.)

Grids are usually specified for me by visual design specs. If I’m on my own projects or something new or small enough that I spec them, I tend to use 12 fluid columns with fixed margins and gutters. So, the gutter size (space between columns) drives the width for the column, and leftover space (divided by 2) give the left and right margins. In this fluid grid style, the same grid can be used for any screen width. For a 1280 px screen width, it would be

  • Gutter = 24 px
  • Column = 71 px
  • Left & Right Margins = 82 px
closed #3

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.