[Screen_Resolution]        21/04/2012
===================

Screen resolution experiments
ŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻ
1024 x 768 does not translate into the browser-width ( or 'free canvas') because of 'browser chrome' (toolbars etc.)

1.   960 seems to be a very common pattern and I have now decided to standardise upon it.
    See F:\BackUpDriveH\MENUS\menus_mh_960.html which has become the template for my new home page
    (http://m-hart.com)

    The basic pattern of the website is described by clicking Layout on the footer.  This calls an .html holding
    program(css_box_mch.html) which holds a .gif captured by using the snapping tool (bottom toolbar) on the
    Print Preview of F:\BackUpDriveH\CSS\css_Box_mch.doc) and then saving it as a gif (css_box_mch.gif)

    See below for more details on diagram construction

2.   To make menubar space slightly larger, you can up the screenwidth to 980px (works on an iPad!) or even 1000px
    (does not work on an iPad without some truncation)
    Hence decided to stick with 960px as a 'safe' option

3.   Diagram construction
    ŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻ
    all in Object->New Drawing->rectangle part of TextMaker (see bullet points)
 
    * Object - New Drawing - rectangle {inserts a box}
    * New Text Frame                   {place holder for Text}
    * Manipulate using red handles... put Text Frame within rectangle
    * Colour in by selecting rectangle Object ->Properties ->Filling {select color}

Further thoughts on 960px screen resolution
ŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻ
I suspect that its now very popular because
  - slightly conservative
  - 960px is divisible by 2..64 and professional designers can use a pixel grid
  - basic screen model can be seen here [F:/BackUpDriveH/MENUS/css_box_mch.html]

Parameters in [F:/BackUpDriveH/MENUS/menus_mh_960.html]
  line 6        body      960px
  line 39       #inner    960px
  line 41       #main     830px
  line 52       #sidebar  127px (padding: 10px 3px 0 0) = 130px
  line 111      #footer   958px + 2 from border:1px solid black

Screen resolutions
ŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻ
Technical information on viewports is stitched into http://kesdon.net
and can be accessed here:
(i)   screen widths   (http://kesdon.info/toolkit/w_screen.html]
(ii)   screen widths2  (http://responsejs.com/labs/dimensions)

 

This page is created with TreePad