A problem for "fluid design" experts.

I try to make my web site attractive for users who view the site over
a "reasonable" range of view ports. I have arbitrarily decided on a
minimum of 800x600 and a maximum of something over my own current
maximum of 1688x1024. Each page of the site uses a background image as
a heading to reflect the contents of the page and I created the image
<http://profectus.com.au/images/films/filmshdg.jpg> as the heading for
my latest page <http://films.profectus.com.au>.

I carefully created the full size image so that the actors looked
towards the centre of the page but as you can see when you reduce the
view port to 800x600 the effect is lost and all the actors look to the
right. How would you create something similar to my original page that
does not depend on the browser's view port?

Advertisements

On 2009-01-21, David Segall wrote:
> I try to make my web site attractive for users who view the site over
> a "reasonable" range of view ports. I have arbitrarily decided on a
> minimum of 800x600 and a maximum of something over my own current
> maximum of 1688x1024. Each page of the site uses a background image as
> a heading to reflect the contents of the page and I created the image
><http://profectus.com.au/images/films/filmshdg.jpg> as the heading for
> my latest page <http://films.profectus.com.au>.
>
> I carefully created the full size image so that the actors looked
> towards the centre of the page but as you can see when you reduce the
> view port to 800x600 the effect is lost and all the actors look to the
> right. How would you create something similar to my original page that
> does not depend on the browser's view port?

Advertisements

Chris F.A. Johnson wrote:
> On 2009-01-21, David Segall wrote:
>> <http://profectus.com.au/images/films/filmshdg.jpg> as the heading for
>> my latest page <http://films.profectus.com.au>.
>>
>> I carefully created the full size image so that the actors looked
>> towards the centre of the page but as you can see when you reduce the
>> view port to 800x600 the effect is lost and all the actors look to the
>> right. How would you create something similar to my original page that
>> does not depend on the browser's view port?
>
> background-position: center top;
> background-repeat: no-repeat;

"David Segall" <> wrote in message
news...
>I try to make my web site attractive for users who view the site over
> a "reasonable" range of view ports. I have arbitrarily decided on a
> minimum of 800x600 and a maximum of something over my own current
> maximum of 1688x1024. Each page of the site uses a background image as
> a heading to reflect the contents of the page and I created the image
> <http://profectus.com.au/images/films/filmshdg.jpg> as the heading for
> my latest page <http://films.profectus.com.au>.
>
> I carefully created the full size image so that the actors looked
> towards the centre of the page

I only saw the "effect" because you pointed it out and then I had to look
carefully at the actors to determine where they are looking.
> but as you can see when you reduce the
> view port to 800x600 the effect is lost and all the actors look to the
> right.

Didn't pick that at all, except as per the comment above. Just a bunch of
people I have seen in movies.

Are you sure you are not trying to inject something into your viewers
experience that you personally experience because that is what you were
thinking when you produced the collage? The important thing is that the
first few are looking to the right (as they should), except for Nicole who
is sort of furtively glancing over her shoulder.
> How would you create something similar to my original page that
> does not depend on the browser's view port?

I see nothing at all wrong with what you have, except that it repeats after
some 1500 pixels or so. That, IMHO, is far worse then where those blokes and
girls are looking

What I find far worse is this thumbnails that have been reduced in size
client side. The first one, 261x385 rescalsed to 100x140. Not only are you
downloading an image far bigger than it nees to be (21KB, thumbnails that
big should be about 5K) but you are destroying the aspect ration of the
image. 261/100*140 == 365, not 385.

On Jan 21, 9:37 am, David Segall <> wrote:
> I try to make my web site attractive for users who view the site over
> a "reasonable" range of view ports.

You have failed. The site looks amateurish at best. The color scheme
is horrendous. The layout completely sucks as you force me to adjust
the size of my browser window to make the page readable. (Flexible
width sucks for those that browse full screen). If I were looking for
movie sites and came across yours I would imediatally leave because I
would consider the quality of the content matched the quality of the
site. And the quality of your site does not come across as
"professional" It comes across as a personal website created by some
highschool kid.

Please note, your site may validate and work perfectly on every
browser in the world, but if I were looking for movie sites and came
across yours I would imediatally leave because it is sub par in my
opinion.

Travis Newbury <> wrote:
>On Jan 21, 9:37 am, David Segall <> wrote:
>> I try to make my web site attractive for users who view the site over
>> a "reasonable" range of view ports.
>
>You have failed. The site looks amateurish at best. The color scheme
>is horrendous. The layout completely sucks as you force me to adjust
>the size of my browser window to make the page readable. (Flexible
>width sucks for those that browse full screen). If I were looking for
>movie sites and came across yours I would imediatally leave because I
>would consider the quality of the content matched the quality of the
>site. And the quality of your site does not come across as
>"professional" It comes across as a personal website created by some
>highschool kid.
>
>Please note, your site may validate and work perfectly on every
>browser in the world, but if I were looking for movie sites and came
>across yours I would imediatally leave because it is sub par in my
>opinion.
>
>I am not trying to be mean. I am just stating my opinion that's all.

Travis Newbury <> wrote:
>On Jan 21, 9:37 am, David Segall <> wrote:
>> I try to make my web site attractive for users who view the site over
>> a "reasonable" range of view ports.
>
>You have failed. The site looks amateurish at best. The color scheme
>is horrendous. The layout completely sucks as you force me to adjust
>the size of my browser window to make the page readable. (Flexible
>width sucks for those that browse full screen). If I were looking for
>movie sites and came across yours I would imediatally leave because I
>would consider the quality of the content matched the quality of the
>site. And the quality of your site does not come across as
>"professional" It comes across as a personal website created by some
>highschool kid.
>
>Please note, your site may validate and work perfectly on every
>browser in the world, but if I were looking for movie sites and came
>across yours I would imediatally leave because it is sub par in my
>opinion.
>
>I am not trying to be mean. I am just stating my opinion that's all.
Why?

On 22 Jan 2009, Travis Newbury <> wrote:
> On Jan 21, 9:37 am, David Segall <> wrote:
>> I try to make my web site attractive for users who view the site over
>> a "reasonable" range of view ports.
>
> You have failed. The site looks amateurish at best. The color scheme
> is horrendous. The layout completely sucks as you force me to adjust
> the size of my browser window to make the page readable. (Flexible
> width sucks for those that browse full screen). If I were looking for
> movie sites and came across yours I would imediatally leave because I
> would consider the quality of the content matched the quality of the
> site. And the quality of your site does not come across as
> "professional" It comes across as a personal website created by some
> highschool kid.
>
> Please note, your site may validate and work perfectly on every
> browser in the world, but if I were looking for movie sites and came
> across yours I would imediatally leave because it is sub par in my
> opinion.
>
> I am not trying to be mean. I am just stating my opinion that's all.

Uh, yeah, but what kind of rubbish is "Flexible width sucks for those that
browse full screen"? In the first place, fullscreen is included in the
concept of flexible width, and in the second, your "fullscreen" may be my
merely 3/4-open browser.

On Jan 23, 12:35 am, Neredbojias <> wrote:
> > (Flexible
> > width sucks for those that browse full screen).
> Uh, yeah, but what kind of rubbish is "Flexible width sucks for those that
> browse full screen"? In the first place, fullscreen is included in the
> concept of flexible width, and in the second, your "fullscreen" may be my
> merely 3/4-open browser.

To me (hence the "opinion" part) flexible width designs are usually
impossible to read with my setup and the browser full screen. So if I
want to enjoy a flexible width site I usually have to re-size my
browser so the width of the text is easier to read.

Setting up a personal max width does not help as it can screw up the
non flex width sites if their width is greater than the max width I
choose.

So, I stand by my opinion that Flexible width looks like hell on my
browser when it is set up the way I want it set up.
> Good flexible-width design encompasses all widths.

Travis Newbury wrote:
>
> To me (hence the "opinion" part) flexible width designs are usually
> impossible to read with my setup and the browser full screen.

Flexible width does not have to mean full screen. Most sites I construct
use a flexible width combined with carefully chosen max-width values. If
it's primarily text content, max-width may be in ems. If it's more
heavily graphical content, it may be px. Sometimes a min-width is
desirable as well, but more often not.
> So if I
> want to enjoy a flexible width site I usually have to re-size my
> browser so the width of the text is easier to read.

You shouldn't have to do that and I'd blame the designer for going
overboard. I tend to have the reverse problem - fixed width sites that
are too wide for my preferred window size.
> Setting up a personal max width does not help as it can screw up the
> non flex width sites if their width is greater than the max width I
> choose.

On 23 Jan 2009, Travis Newbury <> wrote:
> On Jan 23, 12:35 am, Neredbojias <> wrote:
>> > (Flexible
>> > width sucks for those that browse full screen).
>> Uh, yeah, but what kind of rubbish is "Flexible width sucks for
>> those tha
> t
>> browse full screen"? In the first place, fullscreen is included in
>> the concept of flexible width, and in the second, your "fullscreen"
>> may be my merely 3/4-open browser.
>
> To me (hence the "opinion" part) flexible width designs are usually
> impossible to read with my setup and the browser full screen. So if
> I want to enjoy a flexible width site I usually have to re-size my
> browser so the width of the text is easier to read.
>
> Setting up a personal max width does not help as it can screw up the
> non flex width sites if their width is greater than the max width I
> choose.
>
> So, I stand by my opinion that Flexible width looks like hell on my
> browser when it is set up the way I want it set up.
>
>> Good flexible-width design encompasses all widths.
>
> Encompassing and being readable are two different things.

I agree that you shouldn't have to set a personal max-width, but even
if your browser is 10,000 px across at full screen, a decent
flexible-width design should be decently-appearing, either through the
use of a page-styled max-width (generally with less content) or other
design management. 200 thumbs should be easily "readable" on even the
widest screens. Text may be a different matter if extensive, but that
could be "maxed" separately as needed. Some of the newer all-Flash
movie sites, while inelegantly disconcerting in other respects, are
functionally very fluid and operable in that respect.

Ed Mullen <> wrote:
>David Segall wrote:
>> I try to make my web site attractive for users who view the site over
>> a "reasonable" range of view ports. I have arbitrarily decided on a
>> minimum of 800x600 and a maximum of something over my own current
>> maximum of 1688x1024. Each page of the site uses a background image as
>> a heading to reflect the contents of the page and I created the image
>> <http://profectus.com.au/images/films/filmshdg.jpg> as the heading for
>> my latest page <http://films.profectus.com.au>.
>>
>> I carefully created the full size image so that the actors looked
>> towards the centre of the page but as you can see when you reduce the
>> view port to 800x600 the effect is lost and all the actors look to the
>> right. How would you create something similar to my original page that
>> does not depend on the browser's view port?
>
>The top image exceeds my viewport width (1280 x 1024 res, browser
>maximized but with a sidebar) and there is no horizontal scroll bar. I
>didn't realize there were more pictures until I closed my sidebar. And
>it appears that there are still more photos I can't see.
You are correct but that is what I intended. I deliberately use a
background image to introduce the page because it will be truncated or
repeated to fill the user's view port. I think that displaying the
entire image would break the principles of fluid design. I agree that
some visitors might want to see and/or identify all the actors so I
provided a link on the page for the purpose.

What do you think I should have done given that I want a heading
image? Some time ago I asked for, and received, advice from this group
<http://groups.google.com.au/group/alt.html/browse_thread/thread/9a04999d23fd617a>.
Nik Coughlin produced a web page <http://nrkn.com/backgroundWidth/>
illustrating several other techniques. I decided on the technique I
used on the film page although I have not yet implemented it on all
pages.

"rf" <> wrote:
>I see nothing at all wrong with what you have,
I wanted to fix a problem that _I_ have with the image. Both our
visitor sample sizes are too small to judge whether the problem is
significant.
> except that it repeats after
>some 1500 pixels or so. That, IMHO, is far worse then where those blokes and
>girls are looking
Anybody that has the luxury of a monitor capable of a display around
2000 pixels wide deserves to suffer a little
>
>What I find far worse is this thumbnails that have been reduced in size
>client side. The first one, 261x385 rescalsed to 100x140. Not only are you
>downloading an image far bigger than it nees to be (21KB, thumbnails that
>big should be about 5K) but you are destroying the aspect ration of the
>image. 261/100*140 == 365, not 385.
Yes, I get the message and I promise I will fix it as soon as I have
completed my 2006-2007 tax return which is currently my most pressing
task!

Travis Newbury <> wrote:
>On Jan 22, 9:44 pm, David Segall <> wrote:
>> >> Travis Newbury <> wrote:
>> >>>I am not trying to be mean. I am just stating my opinion that's all.
>> >> Why?
>> >Seemingly, because you asked for opinions... :-/
>> No, I asked "fluid design experts" for help in solving a specific
>> problem. I was rewarded by a solution - thanks Chris and Bergamot.
>
>So now you have solved your flexible width problem, but the page still
>looks amateurish. Opinions flow free in usenet.
They do and I subscribe to some .politics groups where I am
unsurprised by posts that tell me that 911 was a "false flag" attack
by the Israelis. However, in groups like alt.html that is populated by
a number of experts in the field, I expect a more reasoned post than
"looks amateurish".

On Jan 24, 9:06 am, David Segall <> wrote:
> I expect a more reasoned post than
> "looks amateurish".

If you read my earlier post I detailed why it looked amateurish. It
was you layout and color scheme that did it for me. Keeping the
layout bland may have been your goal, and if it was then I
congratulate you as you did achieve bland.

Hey, your site is as good as most on the web. Probably better because
you try to validate. But IMHO bland design = bland content. You can
serve a piece of steak on a gold place or you can serve the same piece
of steak on a turd. Same steak, but the one on the turd is less
appealing.

Share This Page

Welcome to The Coding Forums!

Welcome to the Coding Forums, the place to chat about anything related to programming and coding languages.

Please join our friendly community by clicking the button below - it only takes a few seconds and is totally free. You'll be able to ask questions about coding or chat with the community and help others.
Sign up now!