header

Torsten Curdt’s weblog

Webdesign is still so 80’s

Man, HTML+CSS authoring is so frustrating. You probably don’t just have to be pragmatic but just have to accept the many hacks that are still(!!) required to work around all the spec and browser limitations. So who is to blame? Funnily enough I found it not to be HTML but CSS.

Clean markup …is it?
Remember the uprise “No tables for layout!” Well, I totally agree using the “table” tag for layout purposes is semantically wrong. Don’t do it! On the other hand I don’t think replacing it with a dozen “div” tags helps the clean HTML authoring. IMO that feels just as wrong! (Just look into the various tutorials on how to implement rounded edges) Maybe it’s worth to do a really check on CSS.
How many web pages really have a floating design? How many use the fix width approach? Why does CSS not have support for a grid layout? Many of the “div” tags could just get dropped if it the multiple background images support would finally arrive. Well, we are getting there …will probably just take another 5 years. Things are moving so terribly slow in the space – it’s the pure pain.

Resolution independence
With displays and the range of displays sizes getting bigger and bigger resolution independence is becomming more and more important. There is this neat idea of using the ‘em’ instead of ‘px’ in your CSS file. This indeed helps to build more accessible …and “sort of” resolution independent (well, zoom-able) web sites. If you have ever looked at the same page on 15″ or 30″ display it’s becomes clear that this becomes more and more important. Unfortunately the lack of the background-size support in the browser rules out many designs if you want to go down the “em” route. (Essentially your background would stay the same size while everything else is scaling properly) Today Firefox 3 supports zooming also for px based layouts. So we probably will just have to wait for all browser to support that.

Floating layouts
I would argue it’s really hard to come up with a floating design that does not suck. Design really is about ratios. Not just about distances – but also about the “heaviness” of the different parts on the page. So isn’t the float layout maybe just more a geek thing? The idea to get more information into the available space is compelling for the mind …but is it for the eye?

Sometimes I am wishing the web would be just like PDF pages. You just write it out with your design program of choice and be done with it. Who cares about the markup as long as every program can easily read it – no matter what file format. But hell …I am just totally ranting here.

  • I am surely no expert in that field but AFAIK Mac OSX has been announced to support resolution independence. A requirement though is to use points not pixels. That said I have no clue whether the definition are exactly the same for CSS.
  • Actually px values are relative to the resolution of the canvas according to the CSS spec so once the OS supports resolution independance (which is the key missing component at the moment) all those sites that use px will scale quite well and display correctly.

    That's why you can print HTML pages and not have it come out tiny even though printers have much higher resolution than computer monitors.

    From http://www.w3.org/TR/CSS1/ section 6.1:
    Pixel units, as used in the last rule, are relative to the resolution of the canvas, i.e. most often a computer display. If the pixel density of the output device is very different from that of a typical computer display, the UA should rescale pixel values. The suggested reference pixel is the visual angle of one pixel on a device with a pixel density of 90dpi and a distance from the reader of an arm's length. For a nominal arm's length of 28 inches, the visual angle is about 0.0227 degrees.
  • @TheGuru: Unfortunately the shrinking part is only easy for very simple sites. You run into the CSS limitations all the time. For example you cannot specify background image sizes in "em".

    Frankly speaking I don't see the bandwidth issue as such a big deal. Of course: If the browser was sending the screen size you could easily do something like mod_negotiation does for i18n. But try to get all browser to send their screen size. Good luck.
  • Alves
    I think the web servers should be able to "suggest" the web browser the best fitting design (according to the messages sent by the browser) and deliver it, so that the browser doesn't have to decide and waste bandwidth/time.
  • TheGuru
    Me and this other bloke are the only two people left in the world that build entire websites using nothing but vi for the textual files like .html and .css. Its a skill to write pages that "streeetch" or "shrink" to the variable resolutions out there, but once you get the knack of it its easy (but still requires extra effort for even the most mundane things).

    Personally, its not the resolution that's bothering me, but the ever increasing standard bandwith which is forcing me to redo all my images into higher resolutions up to the next tolerable wait-to-load limit. I think this (and the resolution issue) should be handled by the web server not by the browser. Ideally we should be building web sites of the highest quality, and the serving browser should be dumbing it down to the limits of the user's browser and the bandwidth available to it.

    This would also work miracles on the small screen of mobile devices.
blog comments powered by Disqus