Another site review (hey, I had to do it some time)

[toicontien]

Just about everyone here has done it at some point, and now it's my turn. I'd like some feedback on the site listed below. Mainly, I'd like comments on:

1. Asthetics
2. Ease of use
3. If the design philosophy is effective
4. The markup and CSS used
5. Images used
6. Site setup (i.e. the folders used on the web server to group content together).
7. Browser compatibility issues
8. Anything you want.

http://www.cm-life.com/pages/mjw/

In a week or so it will be moved to:

http://mjw.cmich.edu/

There are a couple of problems:

1. The links to the print and online versions of the Diverse Voice do not work. The test site is not on the same server, rather it's set up as if it were on the correct server.

2. I don't have the MS Word application on hand, so links to this document won't work either.

Other than that, everything should be functional.

Thanks in advance :)

[Paul Jr]

Divitis.

[toicontien]

:confused: Sorry, I'm an annoying monolingual U.S. citizen. You'll have to translate. I did a google search on the word and I got a web site about a Franco-Flemish composer and one about a (German?) design company :)

[iniquity101]

Sorry, I'm an annoying monolingual U.S. citizen. You'll have to translate

Paul Jr is from NY...maybe its his slang? I guess he is refering to how many divs you have used

[Paul Jr]

Originally posted by iniquity101
Paul Jr is from NY...maybe its his slang? I guess he is refering to how many divs you have used
Lol, no, not my slang. :p

Yes, I was refering to the superfluous number of <div>'s you are using.

[pyro]

Yes, it's a Zeldman term, I believe. Either way, I'm assuming they (though I'm not sure that many should have been) were needed for all the drop shadows...

[pyro]

Also, I'm not too keen on the navigation links :hover color/style. I personally don't like the overline-underline combination or the color. Also, the darkred color seems to me to be a bit much.

[davidbrent]

i would put the date/time stamp within the top bar and colour it white so u can keep the template with the content inside!

[davidbrent]

wait! i was looking at this
http://mjw.cmich.edu/
i am at the wrong link!?

oops!:rolleyes:

[toicontien]

wait! i was looking at this
http://mjw.cmich.edu/
i am at the wrong link!?

Yup. You are looking at the publication made by the workshop. The workshop web site itself is what I'm working on. Right now it's at the cm-life.com address, but I'll be moving it to the mjw.cmich.edu address after I've got the site done.

The layout is sized in ems so that the layout will increase and decrease in size proportionately to users' browser text size settings.

I agree that there are too many DIVs, but I don't know how else to create background borders that can stretch horizontally and vertically. And I was going for a totally skinnable web site. I didn't plan on creating anymore skins, but this was practice for when I redesign my college newspaper's web site. I plan on having some holiday-dependant skins on that, but that's in the future and doesn't have anything to do with this :)

The color scheme for our college (Central Michigan University) is maroon and gold. So I was kind of playing off that with the dark red.

When choosing a color scheme, do you people go for lighter, subdued colors for the navigation and other elements, or for some bolder colors to set off things like the navigation, page headers and footers?

And thanks for the great feedback so far!

[Paul Jr]

I'm not really feelin' the small "window" in all the subpages for the content. It's a bit too small for my taste. More visible text without having to scroll.

[spufi]

I believe CMU's yellow is darker and a darker yellow would work better for the hover state. Don't have a bunch of text in a link. The one that points to the tour page should be shortened. Rewrite the text so it says something like Take the tour... and link just tour. Drop the mailto link and use a form. I would expect a site done by a university to use forms.

[toicontien]

I've done a little more work and taken some of your advice. I redesigned the main menu to make it look simpler and (hopefully) not so tacky and overwhelming. I did kind of agree with Pyro about the overline/underline thing. I wasn't too keen on it either, but didn't know what else to do with it at the time.

I've added a contact page that has an e-mail form on it, though it doesn't work. I'm hoping I can talk the college's IT department into installing PHP on the Mac OSX server they will be using to host this web site. If not, then I don't know. The problem is that the server does not have any scripting languages installed :(

I kept the tour pages the same. I also think they are too small in size, but that was unavoidable. I need a fixed size in order to center the box vertically and horizontally, and I can't have the box be wider or taller than a 640 X 480 screen because the negative margins I used will move the content too far up and too far to the left.

Any more suggestions/comments are more than welcome. Thanks again guys.

http://www.cm-life.com/pages/mjw/

Note: The above link will only work for another week or so.

[Sux0rZh@jc0rz]

i love your site now. only wish u could make those dang boxes bigger!

btw i love ur shading and shadow graphics... wish i was as talented as you in my design. i can think up tons of stuff for webpages... but i can never seem to make the graphics right!! *tears*

[PunkSktBrdr01]

I think it's fantastic! The layout is awesome, and it has a surprisingly low file size. Good work! :D

[Dudsmack]

When you play with the view text larger/smaller it messes up your layout a bit, but other than that it looks good!

[Paul Jr]

Originally posted by Dudsmack
When you play with the view text larger/smaller it messes up your layout a bit, but other than that it looks good!
Really? Not for me.

On the subpages I get a horizontal scrollbar on the third increase, and on the main page I get a horizontal scrollbar on the second increase, but the layout doesn't break at all.

[toicontien]

Dudsmack: Which browser are you using, including version number, and what operating system are you running?

Could you post a screenshot? Are you increasing or decreasing the text size? The layout should still work at the Smaller text size setting in IE. In fact, at 1024 X 768 and on the largest text setting, the layout of the front page and similar-looking pages should fit perfectly into IE's windows, but only running on M$ operating systems.

And thanks again to everyone and their comments.

A sort of related question

The background images in my menu links and the logo itself flashes in IE when you mouse over them. How do you keep background images from flashing or disappearing for a moment when you mouse over them in IE? Would placing style declarations for the BG image in the a:hover pseudo-class cure the problem?

[DaveSW]

I was just looking at the menu flash actually.

Looking at it, I don't see a difference before or after the flash in IE6/PC.

However, what I think you should try is applying the hover style to the li background, and putting a:hover as background:transparent.

PS the design is quite nice. How about centralising it on the page?

[toicontien]

The menu flash happens on IE6/win2k. It doesn't happen on my WinXP Pro computer at home. I think it's my video card and IE combined more than anything else. I'm running Win2k SP1.

I used to have the layout centered in the screen. I think I ditched that because of some obscure IE bugs (not the margin: auto; bug).

I have other problems with IE to. On my plain content pages, the ones styled like the Accessibility page, IE5/Mac does not create scroll bars when the content overflows the bounds of the viewport. Toggling the Favorites bar (Apple + T) and refreshing the page, and resizing the window seems to make the scroll bars appear. The main content area is positioned absolutely, and I've already had to hack the stylesheets for the tour pages to get them to work on IE5/Mac >:(

Anyway, that's my next little project. Getting things to work in IE5/Mac. I still haven't been able to solve the IE6 flash problem in the menu background yet.