Photoshop Guides for widescreen web designs

Does anybody know what the guides should be set at get a basic viewport for the typical 13″ widscreen laptop?

Anybody know of a template of sorts that can assist in this matter?

Thanks in advance.


This will vary with the make and model of a specific laptop but at 13″ and widescreen: either 1366×768 or 1280×800 pixels is a pretty safe bet for the screen res. taking the smallest dimension of both gives a likely 1280×768

  • take approx 120-150px off the vertical height (browser/OS chrome)
  • take approx 20px off the horizontal width (scroll bar)

this leaves approx 1260×600 px for a maximised window.

you should make sure your webdesign works at a number of different resolutions though. It is common for a user to run their web browser at less than full screen, and your design should be fluid to accomodate this.

Source : Link , Question Author : Anriëtte Myburgh , Answer Author : Hemi

Leave a Comment