Slashdot Mirror
When will 1024x768 Replace 800x600 for Web Design?
Dr.X asks: "It seems as users get bigger and better monitors and video cards, the standard for web resolution is slowly approaching 1024. There is a fairly in depth answer over at Google stating that we are likely to be safe at 800x600 but when will we hit 1024 as the standard. What's Slashdot's opinion?"
Why do web designers still have to target a particular resolution? Back when image scaling sucked (well, it still does) and layout was done with a complex series of pixel-aligned tables, I can see why this was necessary. These days, CSS should allow web developers to scale their site to any resolution, or even any media! (Look at the w3c's CSS recommendations for screen and print media).
Web layou should no longer be done in pixels, period. This will even -look- a lot better, not to mention fit a lot more resolutions, once SVG or similar vector-rendering support is built into browsers. This shouldn't be far off for Mozilla, and IE will have to catch up.
Why does it matter? Just design your site so that it will scale nicely. Web pages don't have to be fixed rectangles like dialog boxes.
-- $G
One thing that should be considered in this debate is the rise of portable or handheld devices. While screens of 320x240 and smaller are a little too small to worry about,I suspect that VGA or 800x600 resolution devices will become more common. Since they are great as web pads it would be wise to consider them in any new web page design
At home I have 1280x960, at work I have everything from 800x600 to 1400x1050. However, I rarely have my browser window wider than 900 pixels. This browser window I'm using right now is 875 pixels wide. When I'm web surfing it is rarely the only thing I'm doing, don't make me use up the whole screen.
the question of whether the user's resolution is 800x600 or 1024x768 is irrelevant. i use 1920x1200 myself, but still keep my browser about the same size as if my monitor were set to 800x600. i just prefer it that way.
that said, what i want to see more of is that websites start to scale with my browser size. if more people used relative dimensions for sites, then i could set my browser to whatever size i want for viewing that site, and it would scale to fill my browser whatever its size may be. that's the onf the things i love about slashdot - it fits my screen be it 640x480 or higher.
however, on that same note, slashdot is still unusable on my PDA. why? because it only fits on 640x480 or bigger.
still, using percentages for widths and ems, exs, or percentages for heights is ideal if you want to maintain layout, because i've found that some users configure their UA to use miniature font sizes and small text areas need to adjust to fit them. so i've also started using relative units for my font size.
but in the case of a PDA, it's better to serve a simpler, smaller style sheet to make those users happy and keep the hits coming.
because, that's what it's all about isn't it? getting hits. nothing else really matters to the web designer.
grey wolf
LET FORTRAN DIE!
Our site was designed for 1024x768, this site is running since January; the stats are since the end of March. It's a webshop (computer hardware) in the Netherlands. Numbers were found using a hidden frame that posts a form with values filled in by a bit of javascript.
Of course, designing for a fixed resolution is bad, should always look good, yadda yadda... It'll work on lower resolutions but you may have to scroll sideways now and then.
I believe posters are recognized by their sig. So I made one.
I would personally escort the idiots who have splash pages to their own corner of hell. Numerous times I go to sites and get a blank page. It turns out they decide that there is *no* way I can possibly experience their site without having both Javascript and Flash turned on. You see they use the Javascript to run the Flash. (I have a proxy that kills nosey javascripts). Feel free to do that in the depths of your site where Flash may be appropriate but preventing entry to the very front page is idiotic.
The other thing I detest is sites that decide how many pixels everything should be. I run Mozilla maximized to 1600x1200 on a 21" monitor. Numerous sites think I can read text a few pixels high. I can't. I turned on the Mozilla preference that lets me enforce the minimum point size.
Even the Google Answers site linked to screws it up. Their horizontal ad bar at the top gets vertically truncated since they decided to allocate a fixed number of pixels to it. Other sites have borders around the article as a fixed length and so I get articles abruptly terminating and have to drag the mouse on the text to see what is below the end of the arbitrary bottom border.
As everyone else says in these comments, stop trying to control stuff to pixels and instead specify the big picture for the layout. If you have to ask the question about what the best viewed size is, then your design is badly broken.
Do not fix your web pages to a specific resolution. I hate those idiots, who think that world rotates around 1024x768 monitors. I'm surfing web with different kinds of devices and browsers (WAP browsers, text-only browsers, Avant Go etc.) and it pisses me off when I hit the page which can't scale correctly to my browser.
Content is what matters, not fixed-sized cool-looking layout (you know, it's possible to make nice looking, functional web sites with scalable layout).
I've noticed that the most notorious misusers of fixed layout are designers, who have used to design magazines. Apparently there is not enough education about web designing at art schools even nowadays.
I don't know about "the majority of users" but my screen resolution has increased quite a bit over the years (800x600 to 1024x768 to 1152x864 to 1280x1024) while the sizes of the windows (especially browser windows) I use have remained relatively constant. The size of the browser window I'm most comfortable with is around 1000x750. If it gets larger I have trouble following a line of text from one side of the window to the other.
My OS has this very advanced thing called a "windowing system" that allows me to have multiple windows visible on screen (partially) behind one another. And no window needs to be full screen! In fact, most are smaller! So why on earth should designers relate the design of their website to the resolution of the entire monitor? Make something that scales to fit the window size your visitors use and leave it at that.
[rant]
Slightly related to the "what size should you design for" discussion are the abominations that are webpages that try to fit the window size to the size of their design. I'd like to see webdesigners that include such offensive resizing in their sites to be strapped to a rack that resizes them to every room they enter.
[/rant]
Having standardized sizes matters to develop a universally usable site. It's not just a marketing ploy; in many cases, it's a legal requirement. Before you complain about how little it matters and demand that people be flexible, consider the following:
First, a site must be attractive. You may be a purist who still thinks that pretty pictures and good design isn't necessary if you present enough information, but you'd be wrong. Unfortunately, people still judge things by their looks. Even if you've presented your information in such a way as to make it extraordinarily easy to use and navigate, many people will never know that. Often, they'll see that your site looks like crap and figure your business is run the same way. Imagine yourself in the lobby of a company you're considering doing business with. Sure, the walls are sound and the furniture doesn't have holes in it. But if everything is cheap white plastic and particleboard, you're going to wonder if this company isn't just some fly-by-night operation. Thus, having an attractive site is important.
Second, the World Wide Web Consortium has very specific requirements for a page to be "usable". What happens if you don't do it there way? Well, you can be sued, for one thing. Also, your company will not be allowed to do business with the government, as you are most likely not in compliance with section 508, the same series of regulations that require wheelchair access, braille, and other accessibility assists for those with disabilities.
Third, you've got to make your site usable. Usability is not the same as accessibility. A 100% accessible site can be 99% unusable if it isn't clear what a user should do, how they should navigate, etc. Just because you've got braille on all of your stairways doesn't mean your users will know what floor to hit if you don't have a building directory somewhere, easy to find and easy to read. As such, it's important to make sure any idiot can navigate your site with ease. Do user testing. Record the sessions. Don't focus so much on what your users say, so much as what they do. I once had a user try to click on something that wasn't a link (but that could have been), then tell me he "should've known better"... but he didn't. (Naturally, it was a link an hour later.) ;-)
Once you've established that your site has to be cleanly and professionally designed, accessible and usable, you now have to make sure none of these elements breaks as you move from machine to machine, browser to browser, and platform to platform. You'll quickly notice that suddenly, you can't make your site scale as much as you want. You see that smoothly-flowing text on a 800x600 screen looks hopelessly cluttered on a 640x480 screen and ridiculously wide, yet short on a 1024x768 screen. You begin to develop visual guides that will work with lower monitor resolutions, yet still look professional on the larger screens. Your designers produce a style guide that begins to define specific column widths and template sizes. And you notice... that the web really isn't as scalable as you thought it was.
What the standard is matters because, if you want to be taken seriously or treated professionally, you had damn well make sure that your site is attractive, accessible, and usable. If not, you'll watch all of your competition march on by, taking your audience with it, regardless of whether you're out to make money or not. If your audience sees that someone else offers the same thing you do, but it's nicer and easier to use, they're going to go see that someone else, and that will be that. You had better take into account what resolutions your users have at their disposal, or your sites will cease to exist.
As more cell phones become web enabled there will be a push for web developers to design pages that cater to those consumers. how we will do that is any body's guess however I think that a lot of browser detection with a dynamic back end will be popular. Opera has a great cell browser that does a wonderful job of making most pages that I visit small screen compatible. but I think that users will push for more as the technology develops.
thats MHO.
What most people refer to as a 'minimum' resolution is really a fixed resolution.
There are valid and reasonable cases for choosing a 'minimum' resolution, expecially when you are designing web apps or intranet apps that would be too awkward to use efficiently if you didn't have the on screen real estate.
However, the reason most people use a 'minimum' resolution is that they do not have the skills to make sites that can scale easily so they choose a size that they can work with. Because they don't scale, then they stay the same size no matter what the window size is. How many sites have you been to where, when you maximise the window, the content is only on the left 2/3 of the screen??
These are 'Fixed' resolution sites, not 'minimum'. And we will be stuck with them until these alleged developers actually learn how and why they should use the available technologies (CSS, JavaScript, etc). Stop accepting their 'excuses' for not using them, check if they are making these decisions because they aren't qualified enough to make the call.
There's no css for scale to 1200 and fix it at wider screens.
The standard answer to CSS complaints: actually, there is, it just isn't implemented in Internet Explorer. The following CSS
div.main-content { max-width: 1200px; }
does exactly what it says on the tin (constrain width to 1200 pixels).
As far as I can see, 90% of the problems with the way Web pages are designed comes from the code generated by the common tools.
The <a href="#" javascript="bla...."> stupidity, the "<table width=600" and suchlike fixed width items, all seem to be commonplace in code from things like Dreamweaver and such. Perhaps those programs can generate proper code, but it would seem the default settings don't (IANAWebDesigner).
If the companies that made the tools would just design the tools to generate proper HTML, that works on different resolutions and font sizes, that degrades gracefully when Javascript is turned off, and MAKE THAT THE DEFAULT SETTING, then a great deal of the problems would go away.
You should see my userContent.css file - it is full of overrides to prevent stupid web sites from using 400 pixel wide tables on my 1600 wide web browser.
I've worked with many UI designers - most of whom have the idea that they want to control everything to the pixel level. Then I take the mouse and attempt to resize their window. Either the window won't resize (they've blocked the message) or the window looks like crap. Designing ANY UI that will resize is HARD - you the designer have to convey to the program, somehow, that *this* item should grow, but *that* item should not. That is extra information that many lazy UI designers don't pass along - be they designing UIs for programs or for web sites.
www.eFax.com are spammers
is due to their requirements to support multiple platforms and browsers and many legacy browsers. They still generate a text version of the homepage. They even support OS/2 to this day.
How do I know? I used to work for them as their lead HTML developer back in the day, and worked extensive for their website standards.
ah, so this is why game websites suck. i was wondering.
US Citizen living abroad? Register to vote!
A: Hopefully, never. Actually, optimistically speaking, web designers will realize that they shouldn't even be aiming for or requiring a graphical resolution as not everyone uses a graphical browser.
Helpful links:
People who say "best viewed at/with" obviously don't get the web.
Nathan's blog
You obviously have never designed any sort of commercial website. Sure, it's nice to be a preachy, didactic Slashdotter and complain about lack of standards, but a true commercial venture knows that you can't always rely on customers to know what they're doing, you can't rely on any consistency in the technology they use, and you can't rely on smart design to catch the user's eye.
Javascript is not a bad thing at all, but clearly is often used in bad ways. But you don't advocate taking guns away from the police just because they can be bad. It's useful for taking the strain off the server by doing client side validation.
Frames aren't always evil either. In fact, I use Squirrelmail most of the time - a very common PHP based IMAP webmail system, and the whole damn thing is in frames by default. I love it.
Many Slashdotters use Gmail now, and I'd like to point out that it's about 99% javascript based. Doesn't automatically make it bad, does it?
Opening a second window is OFTEN the preferred behavior. Sites that bring up massive search results - like an ebay type site, or an e-commerce site, or even a personals site like match.com, might prefer opening individual windows.
I can agree with some of what you say: no site should be fully plugin based, and that Flash, while cool, is contributing to the deterioration of the internet, and that horizontal scrolling is the work of the devil. But the rest of your points make you sound too much like a propagandized Slashdot standards fanboy who is hip to the latest trends of XML.