<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Pleasanton Web Design &#187; 1024&#215;768</title>
	<atom:link href="http://pleasantonwebdesignblog.com/category/1024x768/feed" rel="self" type="application/rss+xml" />
	<link>http://pleasantonwebdesignblog.com</link>
	<description>Information on Web design, technology, and culture from my vantage point here in Pleasanton, California.</description>
	<lastBuildDate>Fri, 04 May 2012 18:22:44 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
		<item>
		<title>Designing Websites for 1024&#215;768 Screen Resolution</title>
		<link>http://pleasantonwebdesignblog.com/2007/01/designing-websites-for-1024x768-screen-resolution.html?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=designing-websites-for-1024x768-screen-resolution</link>
		<comments>http://pleasantonwebdesignblog.com/2007/01/designing-websites-for-1024x768-screen-resolution.html#comments</comments>
		<pubDate>Sun, 28 Jan 2007 01:29:00 +0000</pubDate>
		<dc:creator>Troy Philis</dc:creator>
				<category><![CDATA[1024x768]]></category>
		<category><![CDATA[screen resolution]]></category>
		<category><![CDATA[usability]]></category>
		<category><![CDATA[user-centered web design]]></category>
		<category><![CDATA[user-centered website design]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://pleasantonwebdesign.tpdevspace.com/?p=110</guid>
		<description><![CDATA[The very first thing you need to do when beginning the graphic design of a Website is to make two related decisions: Will the Website be a fixed size, or will it stretch (or shrink) to fit the visitor&#8217;s screen resolution and What screen resolution will you optimize for? For a while, 800 x 600 [...]]]></description>
			<content:encoded><![CDATA[<div class="none"><div class="g-plusone" data-href="http://pleasantonwebdesignblog.com/2007/01/designing-websites-for-1024x768-screen-resolution.html" size="small" count="true"></div></div><p>The very first thing you need to do when beginning the graphic design of a Website is to make two related decisions:        </p>
<ul>
<li>Will the Website be a fixed size, or will it stretch (or shrink) to fit the visitor&#8217;s screen resolution and</li>
<p> 
<li>What screen resolution will you optimize for? </li>
</ul>
<p>
<p>
<!-- Begin Google Adsense code -->
<script type="text/javascript"><!--
google_ad_client = "pub-8315023803230274";
/* 468x60, created 1/7/09 */
google_ad_slot = "2170958206";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
<!-- End Google Adsense code -->
</p>
<p>For a while, 800 x 600 at fixed resolution has been very  popular. And for a while, 1024 x 768 has been the most common screen resolution used by Web surfers &#8217;round these parts. Take a look at my stats from last week:</p>
<p style="line-height: 16.5pt;"><span style=";font-family:Verdana;font-size:9;"  >  <span style="">                </span></span><span style="font-size:100%;"><strong><span style=";font-family:Arial;" >Screen Resolution</span></strong></span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">                </span></span><span style="font-size:100%;"><strong><span style=";font-family:Arial;" >Percent</span></strong></span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p style="line-height: 16.5pt;"><span style=";font-family:Arial;font-size:100%;"  >1)</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">                </span></span><span style=";font-family:Arial;font-size:100%;"  >1024&#215;768:</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">                </span></span><span style=";font-family:Arial;font-size:100%;"  >63.81%</span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p style="line-height: 16.5pt;"><span style=";font-family:Arial;font-size:100%;"  >2</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">) </span></span><span style=";font-family:Arial;font-size:100%;"  >800&#215;600</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">: </span></span><span style=";font-family:Arial;font-size:100%;"  >10.81%</span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p style="line-height: 16.5pt;"><span style=";font-family:Arial;font-size:100%;"  >3</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">)                </span></span><span style=";font-family:Arial;font-size:100%;"  >1280&#215;1024</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">: </span></span><span style=";font-family:Arial;font-size:100%;"  >10.30%</span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p style="line-height: 16.5pt;"><span style=";font-family:Arial;font-size:100%;"  >4</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">               ) </span></span><span style=";font-family:Arial;font-size:100%;"  >1280&#215;800</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">:                </span></span><span style=";font-family:Arial;font-size:100%;"  >2.70%</span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p style="line-height: 16.5pt;"><span style=";font-family:Arial;font-size:100%;"  >5</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">) </span></span><span style=";font-family:Arial;font-size:100%;"  >1152&#215;864</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">:                </span></span><span style=";font-family:Arial;font-size:100%;"  >2.67%</span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p style="line-height: 16.5pt;"><span style=";font-family:Arial;font-size:100%;"  >6</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">)                </span></span><span style=";font-family:Arial;font-size:100%;"  >1440&#215;900</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">: </span></span><span style=";font-family:Arial;font-size:100%;"  >1.57%</span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p style="line-height: 16.5pt;"><span style=";font-family:Arial;font-size:100%;"  >7</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">) </span></span><span style=";font-family:Arial;font-size:100%;"  >1680&#215;1050:</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">                </span></span><span style=";font-family:Arial;font-size:100%;"  >1.17%</span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p style="line-height: 16.5pt;"><span style=";font-family:Arial;font-size:100%;"  >8</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">)                </span></span><span style=";font-family:Arial;font-size:100%;"  >1280&#215;768</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">: </span></span><span style=";font-family:Arial;font-size:100%;"  >1.17%</span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p style="line-height: 16.5pt;"><span style=";font-family:Arial;font-size:100%;"  >9</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">) </span></span><span style=";font-family:Arial;font-size:100%;"  >1600&#215;1200</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">:                </span></span><span style=";font-family:Arial;font-size:100%;"  >1.06%</span><span style=";font-family:Verdana;font-size:100%;"  ><o:p></o:p></span></p>
<p>  <span style=";font-family:Arial;font-size:100%;"  >10)</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">            </span></span><span style=";font-family:Arial;font-size:100%;"  >1280&#215;960</span><span style=";font-family:Verdana;font-size:100%;"  ><span style="">:         </span></span><span style=";font-family:Arial;font-size:100%;"  >0.95%</span></p>
<p>So, if that is anywhere near typical, most of the visitors  to those 800&#215;600 fixed width Websites are seeing a lot of unused real estate on their screen. That probably accounts for the recent comeback of fancy page background patterns I&#8217;ve noticed over the past couple of years. </p>
<p>
<!-- Begin Google Adsense code -->
<script type="text/javascript"><!--
google_ad_client = "pub-8315023803230274";
/* 468x60, created 1/7/09 */
google_ad_slot = "2170958206";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
<!-- End Google Adsense code -->
</p>
<p>Just as 640&#215;480 bit the dust, it looks like 800&#215;600 could  be nearing it&#8217;s demise in the next couple of years. Not yet  though. Ten percent of potential customers is a lot of people  to give the finger to by placing crucial content outside of their 800&#215;600 comfort zone. Here are my recommendations:</p>
<ol>
<li> Use a page design that fills the screen at 1024&#215;768, but has no crucial content outside of the 800&#215;600 box.</li>
<p> 
<li> Look at the page design at the different screen resolutions listed above that have a visitor percentage of 2.5 or more.        </li>
<p> 
<li> Optimize the page for 1024&#215;768, but make sure it still  looks good, and displays crucial content at 800&#215;600 and  1280&#215;1024.</li>
<p> 
<li> Make sure the page design doesn&#8217;t fall apart at 1280&#215;800   or 1152&#215;864.</li>
<p>      </ol>
<p>I expect that all those people surfing with <span style=";font-family:Arial;font-size:100%;"  >1024&#215;768</span> screen resolution are getting pretty bored of seeing that 800&#215;600 stripe down the middle of their screen, no matter how pretty the background pattern is. Designing for 1024&#215;768 will make your Websites stand out, and give at least the appearance of better use of screen real estate.</p>
<p>
<!-- Begin Google Adsense code -->
<script type="text/javascript"><!--
google_ad_client = "pub-8315023803230274";
/* 468x60, created 1/7/09 */
google_ad_slot = "2170958206";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
<!-- End Google Adsense code -->
</p>
<div class="tag_list">Tags: <span class="tags"><a href="http://technorati.com/tag/screen+resolution" rel="tag">screen resolution</a>, <a href="http://technorati.com/tag/1024x768" rel="tag">1024&#215;768</a>, <a href="http://technorati.com/tag/user-centered+web+design" rel="tag">user-centered web design</a>, <a href="http://technorati.com/tag/web+design" rel="tag">web design</a>, <a href="http://technorati.com/tag/user-centered+website+design" rel="tag">user-centered website design</a>, <a href="http://technorati.com/tag/usability" rel="tag">usability</a></span></div>
]]></content:encoded>
			<wfw:commentRss>http://pleasantonwebdesignblog.com/2007/01/designing-websites-for-1024x768-screen-resolution.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

