How to avoid framesets

[Des]

I am trying to set up a page using a table instead of a frameset. I can
not force the table to the domentions required.
http://www.des-otoole.co.uk/ybc/Template.html

P.S. does anyone know the size of the content area of a 600x500
browser. (Minus the boarders around it)

Desmond.

 

[Des]

Sorry cancel that post too earlt in the morning for me, but what is the
usable are of a 800x600 browser/

 

[Paul Watt]

Sorry cancel that post too earlt in the morning for me, but what is the
usable are of a 800x600 browser/

I usually stick to 770px if i'm making a fixed page width.

Paul

 

[Alan J. Flavell]

I usually stick to 770px if i'm making a fixed page width.

Don't do that. My choice of a comfortable window width on this laptop
is around 700px, for example, and a right/left scroll is annoying to
anyone, not just to me. I can hit you with a user stylesheet if I
care to, but it's still annoying. And many users wouldn't know how to
do that anyway.

The trend is towards increasingly diverse viewing situations. Flexible
design is the only way to go.

 

[cwdjrxyz]

I usually stick to 770px if i'm making a fixed page width.

I don't know where you are located. However, in the US, there are still
a few of the old type MSNTV set top boxes still in use(perhaps now down
to under one million). These are designed to display on a TV screen,
reformat text size if too small for good viewing, etc. The screen for
these is under 600 px(I forget the exact value) wide. Moreover, these
boxes can not scroll to view more on the right, so if you use a fixed
screen width greater than the boxes can view, information on the right
of the screen can not be viewed. These boxes now are mostly used by old
people, many of whom have not used a computer before. There may also be
a problem with some cell phones that can view the web, but I am not up
to date on this subject. I do know that one of the phone companies in
the US has a web site that allows reformating of web pages so that they
can be viewed on cell phones properly and that some of the MSNTV box
owners have used this site when they must view an important web page
that is cut off on the right by fixed width design.

 

[dorayme]

Don't do that. My choice of a comfortable window width on this laptop
is around 700px, for example, and a right/left scroll is annoying to
anyone, not just to me. I can hit you with a user stylesheet if I
care to, but it's still annoying. And many users wouldn't know how to
do that anyway.

The trend is towards increasingly diverse viewing situations. Flexible
design is the only way to go.

What are your or anyone's favourite examples of serious
commercial (with much product and complexity, need for photos)
webpages that enable some folk to enjoy the benefits of their big
screens (normal landscape/approx.4:3) while avoiding irritating
those with a 700px limit? Yes, all is a trade off. But be nice to
ground this in examples.

 

[cwdjrxyz]

What are your or anyone's favourite examples of serious
commercial (with much product and complexity, need for photos)
webpages that enable some folk to enjoy the benefits of their big
screens (normal landscape/approx.4:3) while avoiding irritating
those with a 700px limit? Yes, all is a trade off. But be nice to
ground this in examples.

One can vary the size of the image if one wishes to use javascript. You
detect the browser screen width and height and adjust the image screen
width or screen height so that it is some percentage of the total
screen width or height. Then you use a document.write to write a
division including the image using the calculated desired width/height.
Of course if script is turned off, you get no image. But there is a way
around this using CSS. You first write a division containing the image
with some image width/height that will fit in the minimum browser
window size in which you are interested. This division should have an
id. If script is not on, you get only this image. If script is working,
you in addition write script code to switch the small image to hidden
and then the division for the larger image size is written as described
above. I can not recall a commercial page that does this, but then I
have not searched for it. I have used this technique on a few pages in
the past. However if you are going to use a near screen-filling image
that takes advantage of the resolution of a very large screen size, the
byte size of the image must be quite large compared to what often is
used on the web. This is no problem for viewers on broadband, but it
could cause rather slow page loading on slower dialup connections.

 

[cwdjrxyz]

What are your or anyone's favourite examples of serious
commercial (with much product and complexity, need for photos)
webpages that enable some folk to enjoy the benefits of their big
screens (normal landscape/approx.4:3) while avoiding irritating
those with a 700px limit? Yes, all is a trade off. But be nice to
ground this in examples.

Here is a quite complex set of commercial set of pages for you. This
company sells good, and sometimes expensive, painting reproductions.
Thus the images are very important. Since they have many paintings to
sell, they have many pages of small thumbnail images. But even here
some run up to 20 KB size. If you like one, you can click to learn more
and be taken to a description and somewhat larger picture that may be
100 KB or more in some cases. If you are more interested you can select
to view close up. This takes you to a considerably larger image that
can be zoomed greatly to examine details of the painting close up. The
zoom feature is done with flash.

The code on the pages is not perfect, but better than what I see on
many commercial sites. The W3C validator only finds 3 errors on the
main page, and these do not seem to cause problems. I know of many
commercial sites that have over 50 errors on the main page. The code is
somewhat old fashioned and uses an elaborate table structure. The page
will not work at all without script being turned on. I am not sure how
much of a problem this might be, if any. My impression is that so many
major commercial and financial sites in North America, that handle
credit transactions on line, require javascript that most people expect
to have it turned on when they visit such sites. I am not suggesting
that this site is a good example of how to write modern code. I am just
pointing out how they handle images that are very important for their
sales.

 

[cwdjrxyz]

Here is a quite complex set of commercial set of pages for you.

A URL might help

http://www.brushstrokesdirect.com

I believe this company works out of Canada but is also quite active in
the US.

 

[dorayme]

Here is a quite complex set of commercial set of pages for you. This
company sells good, and sometimes expensive, painting reproductions.
Thus the images are very important. Since they have many paintings to
sell, they have many pages of small t....

I am not suggesting
that this site is a good example of how to write modern code. I am just
pointing out how they handle images that are very important for their
sales.

Yes, thanks for this cw. Nice colours and much else. It was not
quite what I was expecting. Apart from the tables and stuff, I
was expecting a candidate that is very good at being flexible
enough to be easy at 700px wide but take advantage of much bigger
(is 1600 too much to ask? Perhaps a bit!). Up to a point it does
this when one is tired and needs to ramp up the text fonts to a
degree that teenagers would giggle at. But it is not a good
example of what Mr Flavell was talking about. Try looking at it
at 700px wide at a not wildly unreasonable biggish font size. And
when on my big screen it does not exactly take up the landscape
area in a hurry.

I like the colour scheme though! Anyway, I am still interested in
seeing the best of good flexible design, as I am sure everyone
else here is.

 

[cwdjrxyz]

Yes, thanks for this cw. Nice colours and much else. It was not
quite what I was expecting. Apart from the tables and stuff, I
was expecting a candidate that is very good at being flexible
enough to be easy at 700px wide but take advantage of much bigger
(is 1600 too much to ask? Perhaps a bit!).

No problem. I just wrote a demo page myself rather than wasting a lot
of time searching the web. See http://www.cwdjr.net/picsnap/parrot.html
.. If script is turned on, you get a 1600 x 1200 px jpg of over 500 KB
size, and it is scaled using script to fit 90% of whatever screen width
is detected for your browser. If someone has their script turned off,
they get the same image at 400 x 300 px at about 32 KB so that it will
fit most browsers without scrolling with the possible exception of
cellphones and other very small devices. Of course those who have a
very slow dialup connection might not like to wait for a 500 KB image
to download. The large image was obtained by the computer from my
digital camera. The smaller image was obtained from the large one using
PaintShop to reduce the size.

 

[dorayme]

No problem. I just wrote a demo page myself rather than wasting a lot
of time searching the web. See http://www.cwdjr.net/picsnap/parrot.html
. If script is turned on, you get a 1600 x 1200 px jpg of over 500 KB
size, and it is scaled using script to fit 90% of whatever screen width
is detected for your browser. If someone has their script turned off,
they get the same image at 400 x 300 px at about 32 KB so that it will
fit most browsers without scrolling with the possible exception of
cellphones and other very small devices. Of course those who have a
very slow dialup connection might not like to wait for a 500 KB image
to download. The large image was obtained by the computer from my
digital camera. The smaller image was obtained from the large one using
PaintShop to reduce the size.

I think you have largely misunderstood my request. Your example
is just one pic? My question was about whole web design rather
than just some pics. But it is a very nice parrot. In any case,
your script does not work on my main browser Safari (that handles
javascript fine otherwise)?

It is interesting to ask my question and see the answers that
actually come, the websites that are flexible and use not js and
what the compromises have to be to satisfy the idea of being
usefully flexible rather than paying some sort of lip service to
the concept. Even a 700px fixed width site is usefully seen on a
bigger monitor at enlarged fonts. Let us call this type of
usefulness, EELBM "Everything is easier to look at on a big
monitor". I am asking to see interesting evidence of the idea of
really useful flexible designs that go beyond EELBM.

Just in case anyone should suppose I am defending fixed, I almost
never make fixed width pages... But, true, I am thinking maybe I
should to keep life simple, to see what it feels like! And it
will be nice for the under 800px crowd and EELBM will be the bone
thrown to the 1600px crowd.

It is just a lip-service thing to flexible design for things to
spread out on a big screen, just for the sake of spreading out.
There needs to be a point in the spread, a use for it, a benefit.
After paras get too wide, it is counterproductive and this
discussion could go on and on... but it would be instructive to
see what folk regard as really usefully flexible and why...

 

[cwdjrxyz]

I think you have largely misunderstood my request. Your example
is just one pic? My question was about whole web design rather
than just some pics.

I am sorry that I did not make a whole site, but if you want a lot of
large images used, it should be quite easy to make as many of the
images large using what I did for the one image. However you had best
have good broadband or be willing to add a longish preload page for
those on slow speed dialup, if that is of interest. There is little
point of spreading out a low KB image over a huge screen as you only
see the flaws in the low resolution image better.

your script does not work on my main browser Safari (that handles
javascript fine otherwise)?

This is a real puzzle. What version of Safari did you use and is there
any chance at all that someone had script turned off by accident. If
the script actually is not working on recent Safaris it could be a
script problem or a css problem, because the script is doing css
operations, such as changing visibility, among other things.

I have checked my page on Mozilla 1.7.11, Netscape 8.0.4, Firefox
1.5.90.3, Opera 8.54, and SBC Yahoo DSL Version 6.00-XCXS;sp2(slightly
modified IE-6) browsers, all the most recent version, and the page
works the same as it should on all of them with either script on or off
and at different screen resolutions. On the W3Cs Amaya 8.1b browser,
the smaller image only shows as expected, since the Amaya does not
support script. I also viewed on the MSNTV Viewer 2.8[build 20} wich
simulates an old MSNTV set top box. First this showed the small image
which was not removed, since this box did not support
document.getElementById. However it wrote the large image as the
correct size over the small one, so there was no problem once the page
was finally loaded on this slow responding relic. Unfortunately, I do
not think you can download a Safari browser to a Windows XP2 OS
computer, and I do not know the version of Safari anyway. Anyway, for
whatever the reason, your Safari seems to be doing something quite
different from the bulk of the most current browsers. It could be
either a script or a CSS difference.

 

[dorayme]

I am sorry that I did not make a whole site, but if you want a lot of
large images used,

I don't know what else I can do to explain what I am talking
about. I don't particulary want large images no matter how many?
I don't know why you have focussed just on this?

I will raise it again one day in a separate thread with its own
title when i have more time. In the meantime, perhaps you would
kindly take a look at the very start of this thread. Since
Flavell does not answer, what do you think he exactly meant by
flexible design that is not just something that will fit into
700px and via EELBM be useful but not that much more?

No need to say more about pictures, I understand your point about
pictures and am sure what you have done is clever (and trust it
works for others if not me)

 

[Alan J. Flavell]

What are your or anyone's favourite examples of serious
commercial

Well, aside from Google (whose HTML is dreadful, even though it does
the job), I don't off-hand have a commercial example to offer, but, of
the various pages that I use professionally, I must say the ones based
on Mediawiki behave very nicely, in terms of calmly adjusting
themselves across a fairly wide range of viewing situations - this can
be seen, for example, with the wikipedia itself. There's a few little
things that I'd like to improve, but by and large it behaves much
better than the typical over-designed "commercial" pages that I need
to deal with.

(with much product and complexity, need for photos)

Excuse me, but cramming-in the maximum amount of stuff per page is
*not* the sign of a designer who understands the web. It confuses the
would-be customer, quite apart from annoying experienced webnauts.
When a company has (let's say) several thousands of products in their
repertoire, then cramming as many of them as possible onto the front
page ought not to be their first priority. Devising good ways to
navigate, and help the customer find the right product, *should* be.

Having to deal with various commercial sites, there seem to be
basically two kinds:

* those where the site is better navigated using google

* those which contrive to prevent google from indexing them

You can probably work out what I think about that, hmmm?

webpages that enable some folk to enjoy the benefits of their big
screens (normal landscape/approx.4:3) while avoiding irritating
those with a 700px limit?

"limit" wouldn't be accurate. When the content - in and of itself -
calls for a big screen, then I'll use it. Such as 1024 on the laptop,
or 2 x 1280 on the desk. But when I'm merely browsing around, then
I'll have other things going on elsewhere on the screen, and I don't
want the browser window hogging all the width. The browser window
usually gets given around 700px on the laptop, *unless and until*
there's something that in my opinion needs more. And the mere fact
that an author tried to stick too many things side by side is not the
kind of thing that persuades me that it "needs" more - it should
damned-well adjust itself to *my* browser window (and of course to
anyone else's), and not the other way around.

Yes, all is a trade off.

No disagreement there.

 

[dorayme]

Well, aside from Google (whose HTML is dreadful, even though it does
the job), I don't off-hand have a commercial example to offer, but, of
the various pages that I use professionally, I must say the ones based
on Mediawiki behave very nicely,

Yes, http://en.wikipedia.org/wiki/Main_Page behaves nicely enough
at well under 800px considering the amount of stuff on it ... And
does take advantage of bigger screens for more than the simple
reason that you can see things bigger. The source indicates a lot
of inline styles, tables and... well, not sure I would like to
maintain it!

Excuse me, but cramming-in the maximum amount of stuff per page is
*not* the sign of a designer who understands the web.

Well, hang on... you have jumped to an over pessimistic thought
from my "with much product and complexity, need for photos". You
will probably understand that there is a thing of trying to avoid
too many levels of directories, something that can also confuse
the punters. So the distribution of the material and photos needs
to avaoid both over crowding individual pages and confusing the
user with too many "easy to view" individual pages.

Again, be good to ground all this talk in concrete examples. I
was particularly interested in that subset that might not need
horiz scrolling at under 800px...

Having to deal with various commercial sites, there seem to be
basically two kinds:

* those where the site is better navigated using google

* those which contrive to prevent google from indexing them

You can probably work out what I think about that, hmmm?

er... yes, sort of... "not much"? It is easier to make academic
sites where there are not commercial pressures to more ideal
standards (generally). The former tend to involve more text and
less pics, the latter typically want folks to see what they want
to flog.

I say, easier, I don't say more than this. I do not think
commercial sites have to be hard to navigate, irritating to
scroll or lack a goodly many pics both big and small.

"limit" wouldn't be accurate. When the content - in and of itself -
calls for a big screen, then I'll use it. Such as 1024 on the laptop,
or 2 x 1280 on the desk. But when I'm merely browsing around, then
I'll have other things going on elsewhere on the screen, and I don't
want the browser window hogging all the width.

....

O! You are sensibly flexible. Pity, I had this funny image of you
schlepping your laptop around the campus, avoiding smoking
students, and grumpily looking at sites too big for your
screen... O well, images come and go. I will lose this one now.