7 replies [Last post]
wendy
wendy's picture
Offline
Enthusiast
Boston, MA
Last seen: 12 years 39 weeks ago
Boston, MA
Timezone: GMT-5
Joined: 2005-01-31
Posts: 174
Points: 0

http//www.horseink.com/workroom/dgj/index.html

This looks as it should in FF/mac, IE5.2/mac, and Opera (except for line-height problem w/ h3, which I just noticed) and looks 'orrible in Safari (but it's an old version).

It validates (html & css). This is a "first draft" so nothing works yet.

Could you let me know if it holds together in the Windows browsers?

I'm not feeling too sure about this one, as the "liquid" thing is new for me, so please don't fall on the ground laughing if it's a disaster )

I'd also appreciate thoughts on the look of the page. This is for a journalist who wants to look serious and proficient, but the page may be too, um, dull??

As always, thank you!

gleddy
gleddy's picture
Offline
Leader
sydney, australia
Last seen: 14 years 14 weeks ago
sydney, australia
Timezone: GMT+10
Joined: 2004-09-21
Posts: 596
Points: 0

new site check, esp PC folk, please

looking ok in FF and IE, everything seems to work ok, can't pick any glaring errors in the layout from browser to browser.

Code wise it's pretty tight, from first glance I think you might be overusing the <div> tag a bit, but still a good effort and you are keeping everything quite semantic which is most important.

breaks down logically with styles off.

design wise you may be right... I think it looks professional enough, but is lacking something... maybe a bit more subtle use of the dotted lines? not sure, but it's not that bad so I think you have a good base design to work from.

[edit - perhaps ditch the dotted borders on the right panel and footer and experiment with solid background greys? it could balance it a bit ]

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 15 years 50 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

new site check, esp PC folk, please

Hi, Wendy
Good application of fixed/fluid techniques.
Glad you noticed h2 line-height, permission to please?
Suggest neither h2 nor h3 need line-height anyway.

One issue is the navigation, in that there is no room in FF/Win to expand downwards on text increases because of the fixed heights on a:link/visited/hover. IE expands OK but that's just IE doing its own thing.

Some random thoughts on design:
I like the selective use of the Courier font, seems quite appropriate.
Subject and subject matter call for gravitas, but that could make the site a bit dry/uninteresting.
Consider picking some colours from the globe.
***** OR ******
Yer man is also a photojournalist, so you must have access to some stunning pics. Consider going for stark black and white, horizontal nav bar under the header - single words home, about, work, links, contact. Then use the left column for thumbnails (with captions, if appropriate) of the places where Doug has worked - linked to larger pic pop-up/new page/in-page or whatever.
Consider putting all pics with captions into a "feature" box, rather like the pic in the right column - caption text could be smaller and, possibly, centred.
See here for some ideas:
http://www.cssplay.co.uk/boxes/snazzy.html
http://www.cssplay.co.uk/boxes/krazy.html
http://www.cssplay.co.uk/opacity/picturemenu.html
http://www.cssplay.co.uk/menu/gallery.html
This is just a quick selection - frankly, the whole site is truly inspirational.

wendy
wendy's picture
Offline
Enthusiast
Boston, MA
Last seen: 12 years 39 weeks ago
Boston, MA
Timezone: GMT-5
Joined: 2005-01-31
Posts: 174
Points: 0

new site check, esp PC folk, please

Thanks, Gleddy and Lorraine (permission to fall on the floor laughing *not* granted! Wink )...

Thought about the excellent points you both mentioned, and came up with this
http//www.horseink.com/workroom/dgj/index_hmenu.html
which is a bit different (although I'm considering the time factor (mine), and the conservatism factor (client)), a little more assertive...and, I hope, still holds together on a PC!? I'm sure there will be a lot more photos; just want to get the bones down at this point.

Eager to hear your thoughts on this newer version! (and also eager to send to the client, once I know it "works")

Cheers!

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 15 years 50 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

new site check, esp PC folk, please

Wendy
That's more "war-zone like". I didn't know Palm Beach was as bad as that, though Wink
Bit of a problem with IE6/Win. The right column is being pushed down below the centre one. See attachment 1. Increasing the size of the window has no effect.

It looks like the#rightcol width of 175px is being a bit compromised in our "favourite" browser because of the way IE handles margins/padding/border. There is the Slayer picture with 145px width, within .rightcontent which has a left-margin of 10px, left and right padding of 10px plus a 1px border all the way around.

Eerily I don't get this locally: the only difference is that I have placed your styles within the <style> tags in the xhtml rather than used @import.

I've just noticed a bit of "squeeziness" going on in the left column. When the window is resized it underlaps the centre col, see attachment 2, but goes back into place when the screen is refreshed or the page is reloaded.

wendy
wendy's picture
Offline
Enthusiast
Boston, MA
Last seen: 12 years 39 weeks ago
Boston, MA
Timezone: GMT-5
Joined: 2005-01-31
Posts: 174
Points: 0

new site check, esp PC folk, please

Lorraine,

Darn it! I knew this was going to easily...well, I'll see what I can come up with.

Arrggh. ? Has anyone invented an emoticon for "deep discouragement" yet?

wendy
wendy's picture
Offline
Enthusiast
Boston, MA
Last seen: 12 years 39 weeks ago
Boston, MA
Timezone: GMT-5
Joined: 2005-01-31
Posts: 174
Points: 0

new site check, esp PC folk, please

Lorraine,

Is there any improvement now? I've decreased the width of the photos by 32px (well, actually 35px) -- does that eliminate that problem?

Seems like the page needs a min-width thing going on, but I gather that just doesn't work with IE...

It's hard to be working "blind" like this, as it all looks just peachy in my browsers. Is it kosher to specify "For Macs Only"?

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 15 years 50 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

new site check, esp PC folk, please

Wendy,

I'm still getting the dropped right column and the left column probs on resizing the window.
You could try this change
.rightcontent .caption {width: 145px;}
Tested in IE6/Win and Opera 7.11/Win. Unfortunately my Firefox (I'm at work at the moment) always refuses to open. I'll check when I get home this afternoon.

To find out how your pages look in other systems/browsers you could try:
http://www.browsercam.com
There is a free short trial period - don't know what the costs may be after that, though.
I don't know whether the next two have Mac versions and if they do, whether they will emulate IE on a Windows system, but,
Netscape seems to have made some changes. See under dual rendering engines.
http://browser.netscape.com/ns8/help/whats_new.jsp
There is a relatively new Firefox extension called IE view.
https://addons.mozilla.org/extensions/moreinfo.php?application=firefox&id=35

I don't think min-width is your problem here as the fixed-width right column thing was happening at 800x600, 1024x768 and up. Any screen size below around 800x600 is going to squeeze your fluid centre column too much, however, and Stu Nicholls (who else) seems to have a fix for min-width in IE:
http://www.cssplay.co.uk/boxes/minwidth.html
and has posted a tutorial here:
http://www.webreference.com/programming/min-width/

I'll get back to you later on the Firefox bit.