Printable View
In the past week I have seen quite a few sites posted to the Showcase & in the reviews section that are just plain huge. While bigger monitors are becoming the norm, I don't believe that you should limit your viewers with smaller monitors or those that choose not to view in a full size window.
You might want to check out this article by Jakob Nielsen - http://www.useit.com/alertbox/screen_resolution.html
Enjoy!
I have also found that there are differences between widescreen laptop and regular desktop monitors. (Ask me how I know!)
Not only should a person check out their site in multiple browsers, but use different screen resolutions as well. As an extra safety measure, it doesn't hurt to check them out on a different type of monitor to be on the safe side. A site I thought looked great on my laptop looked horrible on a normal desktop with a standard CRT monitor.
It's quite simple.
Design for 750px wide (or thereabouts), and know how your site will look to all users, or use a fluid layout.
I prefer the former.
Don't forget we are talking e-commerce here. People want easy navigation, speed, good images, security and confidence that you'll deliver the goods.
Zencart sites don't have to be works of art. Amazon isn't, or Play.com, or plenty of others.
Nothing annoys punters more than horizontal scrolling, and in my opinion, a site that needs it is a bad site.
Thanks for the great link... and the author is credible... beats some of the wanna bee's who are in-credi-BULL.Quote:
Originally Posted by Kim
I sent this link to lots of folks and sincerely appreciate you sharing it with the rest of us.
jund
I agree with BudFox more than the Jakob Nielson article. It still makes sense to design for 800px width screens. There are still PCs being made that use 800x600 or 800x480 screens (like the popular Asus EEE and other UMPCs), and that is generally adequate real estate for a store.
Well, I spent the last 20 years as a graphic designer... I'm modding the classic template (again...). Lost the right column, made the left one a little wider, and I've got the thing at 90% of window width... I like a clean look, not a lot of "who let the color fairy out?" stuff, and large pictures, so people can see what they're doing. Probably do some mild colors next.
Yeah screen size is important ... especially on how you want to display the site. I have been developing websites for over 12 years now and I have always...well since 2000 been using this freeware utility called Sizer.
Sizer resizes any window to a preset or customized resolution size through a menu when you right click the title bar of a window. No need to change your computer's resolution anymore.
I hope this doesn't break tos ... but I want to share the link with you guys as this really helped me with resolution and how you want to present the pages to this day.
Link: brianapps.net/sizer.html
Hope this helps as much as it helped me out in the past
Nightfyre ( Ray )
Finding a happy medium is important.
Through using analytics we have determined only 6% of our visitors use 800x600 or less. Therefore we have optimised for 1024x768+ to cater for the remaining 94% of users optimally.
There is no way i would design a website at a width of 700px with 22" widescreens being the norm for any new computer these days where they nearly all run 1680x1050px. Doing so would leave you with more than 50% of un-used space for the majority of viewers.
Stats can tell you what screens people are buying, but can they tell you what width their browser windows are?
I have a 1680 x 1050 pixel screen, but my browser is never more than 1000 px wide. And when I run into a site that forces me to widen it, or to scroll horizontally, I leave -- unless I have a very strong reason to stay.
Rob
Hello!
Good advice form all! I try to stay with the 1024x768 rule. It is a "Middle of the road" approach. You can please some of the people some of the time, but you can't please all of the people all of the time.:no:
I use two monitors running in multiple display mode. My 22" is running at 1680 x 1050 and my 17" is running at 1024x768. I do my design work on the 22" monitor and check pages on the 17" monitor. Most inexpensive add on graphics cards support this feature. It sure is a handy time saver.
P.S. Funny I sholud be listed as a new "Zenner", that is my last name...hahaha...That makes me a 52 year old Zenner...lol
There is an excellent site that I often refer my clients to which keeps up-to-date metrics of most any kind of information you are seeking - http://www.w3schools.com/default.asp
It is important (when you go to this site) to review all the links and it is also kind of fun to 'take the tour' - so to speak.
What I really like about it, is one of the things about our ZENCART forum. Both sites are loaded with good information, lots of detail, and all the 'opinions' are carefully monitored, so that we all receive the best information. Thank you ZENCART forums.
By the way - GEEK420 - I think I am the oldest GEEK here (not sure), but like you, I still find this stuff to be "brain fertilizer." I will be 69 next Sunday - July 5 - and please keep on keepin' on.
regards
jund
Forgot to give you more exact navigation info -
Once you are on the home page click on Web Building > Web Browsers. The Web Browsers page has links to Browser statistics...
Those are all great suggestion. Here is my rule of thumb. I use google analytics and after months of data I reviewed the results and then choose the most optimal resolutions for user that use my site.
Here is an example of my results for the week:
1024x768 30.05%
1280x1024 15.54%
1280x800 15.05%
1440x900 9.64%
1680x1050 8.57%
1920x1200 3.62%
1152x864 2.94%
800x600 2.47%
1280x768 1.94%
1600x1200 1.27%
So I use 1024x768 for my site. By using this size I am well within exceptable screen size for 97% of my cutomers. I also use a tool that is a firefox addon that is just like the tool NightFrye suggests but you can use right in your browser..
Here's the link Firesizer.. Hope this is useful information..
Thanks for the post!! This is really helpful for miss newbie (me!) as I'm helping to design a few websites for friends/family..
Cheers!:clap:
What file would I change to edit the resolution of the page, to make it bigger, extend it out more?
No PHP files; most styling is done in your stylesheet (/includes/templates/your_template/css/stylesheet.css).
#mainWrapper is the element that encloses all the rest and sets the page width (for most templates).
It would be nice to have a script which detected size and made browser zoom adjustments or some such effect, accordingly.
I've also designed my site for the more popular 1024x768, but it looks better if you zoom in one notch - I didn't want to get greedy with the borders. ;)
There probably is some javascript script that does that, somewhere...
A very dangerous idea.Quote:
Originally Posted by thedjphat
Different browsers zoom differently. Some zoom everything, some just the text, some both. And they zoom at different rates, and there's no guarantee those rates will remain consistent across browsers.
This would also cut across the philosophy under which browser standards are developed and browsers are built, which says that features like zooming should be under user control. If they've set their zoom to a particular settings that works for them, the site shouldn't override their preference (or for partially sighted people, their need).
Here is a crude list from my shop ... Sample is from the past few months with around 50000 visitors.
The list represents visitors in % that could browse the site without horizontal scroll at a given layout width...
Eg. 97,2% of my visitors could view my shop without horizontal scrolling if the sites layout had a width of 750px.
750 97,2%
800 96,3%
900 95,9%
1000 95,8%
1100 86,3%
1200 85,0%
1300 57,6%
1400 46,0%
1500 35,9%
1600 35,6%
1700 16,4%
1800 16,2%
As you can see... the "huge" drop happens at about 1200px, but currently I'd suggest a width of 1000px or 980 or so which seems to be popular atm without making the site too narrow.
A valid point noting is that many people have all sorts of "bars" etc on their screen takin up screen estate ... for example ubuntu linux uses unity as GUI now which has a ~100px bar on the left side of the screen, which many people do not make autohide.
Also please note the post dates when looking up these statistics. Do not build your site around outdated information.