Fake frames

[kurtsfar]

Hi, I use a so called fake frame layout on a site of mine. I always felt navigation on sites using frames are very easy. However, since there are so many drawbacks using real frames I have implemented a frame layout with css. Here is what it looks like: Internet ProgrammingI would like to hear some opinions on this kind of layout:Is it safe? I.e. does the design hold for all clients, or does it break in some. Should one use real frames, or should one skip the frames all together?

[Chocolate570]

looks great in firefox. I like the design, you have more control over the look and fel of the frames your way. Good job.

[Skemcin]

Nice idea. loads good in FF, IE, and NN. Sorry, I haven't downloaded the lastest version of Opera here at home.The only thing I don't like is how the left nave gets a scroll bar too, when it gets too big:

• Click Internet Programming 2
• Click Output

When I use my mouse wheel to scroll - both divs go at it. I'm not a big fan of frames (real or fake) because they are realestate hogs. If the header's height was trimmed 25px or so and maxed the site from 860 to 1000 then I think the frame look can work. I'm assuming that with a width of 860, you're not designing for 800x600 screens, so why not use more space so people scroll less?Very nice CSS though.

[kurtsfar]

Nice idea. loads good in FF, IE, and NN.  Sorry, I haven't downloaded the lastest version of Opera here at home.

Actually I have a problem with Opera 8, the right coloumn ads comes on top of the header when I scroll. This is probably because the ads are contained in a iframe(hope google drop the iframe soon). As far as I can tell this is a Opera bug. It seem like Opera act as if the iframe was a page by itself, i.e. z-index won't work in relation to the rest of the page.Sure, I can detect Opera users with javascript for example, and simply not show the right coloumn ads, but that woudn't be a solution.(e.g. display:none).Besides using display:none could be a problem when it comes to SEO issues.

The only thing I don't like is how the left nave gets a scroll bar too, when it gets too big:

• Click Internet Programming 2
• Click Output

When I use my mouse wheel to scroll - both divs go at it.

You right, I could try and make the link text shorter to prevent horizontal scrolling.The simultanous scrolling of both the page and the overflowed navigation problem I havent been able to work out. Since it is not real frames there is only one page. Any suggestions how to solve this double scrolling problem?Also, I could make the navigation menu higher to prevent scrolling, however the links at the bottom of the tree then would become inaccessible at smaller window sizes like 640*480. Sure, I could use a client-side script to detect the window hight, but I wan't something as important as the navigation accessible even to client's without active scripting turned on.

I'm not a big fan of frames (real or fake) because they are realestate hogs.  If the header's height was trimmed 25px or so and maxed the site from 860 to 1000 then I think the frame look can work.  I'm assuming that with a width of 860, you're not designing for 800x600 screens, so why not use more space so people scroll less?Very nice CSS though.

<{POST_SNAPBACK}>

I do design for clients with 800*600 and smaller screens.I use a mix of fixed and fluid width. Elastic maybe:)I have a maxwidth of 860 and a minwidth of 725. Sizes inbetween are fluid. If the client do not allow active scripting the design will be 100% fluid in IE, i.e. it will fill out the hole screen in Internet Explorer.(this is because IE doesn't support max- min- width properties). In Firefox and other good browsers these properties work as intended.This is what it used in i6.css to implement maxwidth and minwidth:

/*max-width*/#headerwrap {      width:expression(document.body.clientWidth > 860? "860px" : "auto");}/*max-width*/#mainwrap {       width:expression(document.body.clientWidth > 860? "860px" : "auto");    }/*min-width*/#main {    width:expression(document.body.clientWidth < 725? "490px" : "auto");}

Since this is a IE shortcoming I thought using their own expressions was better than javascript.My point is to prevent horizontal scrolling for clients with screen sizes bigger than 725, and at the same time not allowing the text area to get too wide since that would make it less readable.(keeping it to around 55-65 characters for readability)Yes you right, maybe I should make the header hight less. This could help some with the vertical scrolling problem.Thanks very much for the responses, both of you! They will be very useful.However, even more opinions would be useful. Anyone have some?