To view each proof in more detail, click the image.  The first image scrolls in it's browser window.  

The desktop versions have a width of 1920 pixels, which is a common width of modern, high-definition desktop screens.  The width of the content area ( where most of the text and images are found ) have a width of 1200 pixels.  Most common laptops have a screen width of 1366 pixels, so there are about 83px right and left "gutters", which grow for larger screens.  At 1200 pixels, most of the pages will display a maximum number of characters of 50-75  per line, which is considered optimal for reading.   The "hero" image stretches the full width of the screen.

For the mobile pages we used 414 pixels, the width of an iPhone+, just for proofing purposes, as it will work on any phone size.  For the mobile views, the content "blocks" stack vertically, which is why the mobile views are taller.  When the site is viewed on larger screens, such as an iPad, more horizontal space is available, and the blocks shift to a more horizontal layout to take advantage of the additional space.

 

Add new comment

The content of this field is kept private and will not be shown publicly.
Indicate on which design you are commenting by entering the title.

Restricted HTML

  • Allowed HTML tags: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • Lines and paragraphs break automatically.
  • Web page addresses and email addresses turn into links automatically.

Title Design Proofs

Version 2.00

Vote

No votes have been submitted yet.

Additional Images