Jump to content

Throwing myself out there...


KevinM1

Recommended Posts

I figured I should get some critique on a website I've built.  First, though, let me say that I'm a newbie at both using Photoshop and in graphic design in general.  Also, I know my code can be streamlined a bit -- I'm planning on removing the inline styles I've placed in the span tags I used.  I also think that showing what the site looked like before I took hold of it is fair, so you can all see what it looked like in different stages of its lifespan.

The site is for a non-profit cultural/historical center in Manchester, NH.  The Franco-American Centre is basically a place where people who are interested in French-American ancestry can go to view art exhibits, take French classes, watch French movies...that sort of thing.

Example of the old layout (before I became webmaster): [url=http://www.francoamericancentrenh.com/index.htm]http://www.francoamericancentrenh.com/index.htm[/url]

What it looks like now: [url=http://www.francoamericancentrenh.com/]http://www.francoamericancentrenh.com/[/url]

Any ideas on how I can take it to the next level[/cliche]?

Thanks! :)
Link to comment
Share on other sites

Viewed with Firefox.

Something's amiss with the way the menu renders. As I roll my mouse down it, the right side content leaps around whenever I reach an option with a second level.  Whatever causes that needs to be stopped dead.

Having the content in a scrollable div inside a page that needs scrolling is something you should avoid.  The links page is an example of this odd behaviour.

I found the bright blue rather overpowering, but I suppose that's the right blue to go with the fleur-de-lys you're using.

Otherwise, it all appears fine although a [i]bit[/i] of graphic embellishment wouldn't do any harm and neither would a link from the page bottom back to the top of the page.
Link to comment
Share on other sites

Yeah, I think the FF thing is due to the JavaScript used to power the menu.  I was debating with whether or not to go to a pure CSS option (cssplay has pure CSS flyout menus), but they use tables to render levels 2+, and I hate tables.  Looks like I will have to go that route, though.  Maybe I can retrofit them to use divs.

I chose a scrollable div to basically make every page the same size.  I dislike pages that change height drastically depending on the content within them.  An example would be the difference between the index page and the bookstore or links page.  I couldn't come up with anything other than to limit the height of the page and have the overflow scroll.  I'm actually worried about how the site looks in lower resolutions, though, as I don't want to have double scrollbars (one for the div, one for the page if it's too tall for a lower resolution).  Any ideas on how to achieve a balance between height and function?

Thanks! :)
Link to comment
Share on other sites

a couple personal preference things you may want to consider:

1) the blue is a bit over-saturated for me... i just don't care for [b]that[/b] much brightness all at once on the page. i think the color works, but maybe a bit de-saturated? or maybe having the nav as a complimentary neutral color to the bright blue in the banner?

2) i don't like the idea of having the exact same banner with different text subset as your welcome message. i would definitely recommend you design a separate banner or stick with text only for that welcome message.

3) when you have images (especially light ones) floating over white space, i like to see borders on them. even a really light border (maybe a #aaaaaa) would help set them off a little better and emphasize them a tad.

otherwise, looks like you're off to a great start. it's very clean, and you've done a good job of incorporating all the areas of the site into the menu there. also, i'm extremely pleased to see that you've taken the time to validate. it appears the the validator is down at the moment, so i can't double check it myself, but i'll try it again later ;)
Link to comment
Share on other sites

Is the blue really that bright?  It doesn't seem so bad on my monitor.  Howabout the menu's hover color?

I agree with you on the subheader, but I'm not sure what I could do there.  I'm not exactly the most creative guy when it comes to art.  An all text 'banner' might work, but I'm not sure how to make it visually appealing outside of 3-d effects, which I want to avoid as the rest of the site is in 2-d.
Link to comment
Share on other sites

[quote author=Nightslyr link=topic=110158.msg445312#msg445312 date=1159803652]
Is the blue really that bright?  It doesn't seem so bad on my monitor.  Howabout the menu's hover color?[/quote]

i actually really like the hover color... however, against the darker blue, it doesn't really seem to stand out as much as it could. maybe "bright" was the wrong word... i don't suggest you make it darker, just maybe less saturated. or, maybe a complimentary color like a beige or gray would work?

[quote author=Nightslyr link=topic=110158.msg445312#msg445312 date=1159803652]
I agree with you on the subheader, but I'm not sure what I could do there.  I'm not exactly the most creative guy when it comes to art.  An all text 'banner' might work, but I'm not sure how to make it visually appealing outside of 3-d effects, which I want to avoid as the rest of the site is in 2-d.
[/quote]

an all text banner could have a lot of options, especially if you have some nice fonts to work with. i'm not the greatest designer, either, so i may be off, but a very slight gradient on a nice font with possibly some very subtile border effect may look nice. as for the 3D, i totally understand about wanting to avoid it as it really has been overused. do you consider a drop shadow part of your 3D no-nos, or would you consider looking at that possibility (at the risk of something else that's overused  :D)
Link to comment
Share on other sites

What's with the validity icons? A lot a lot of webmasters starting out put those on their websites, but my advice is: DON'T.

Your target audience could care less. Unless validity is relevant in some way for the visitors of the site, why distract them with unrelevant information?

[quote]This Website Compatable With The Latest Versions of Internet Explorer, Firefox, and Opera[/quote]

Again, your audience doesn't care, as long as it works for them. This type of stuff is between you and your client.

[quote]Please Have JavaScript Enabled[/quote]

I am a visitor and have javacript disabled, please provide me with an alternative method of navigation. How's that?

Link to comment
Share on other sites

If you're looking for CSS alternatives for your menus, you can try www.twinhelix.com. They've got some really powerful and visually pleasing menu systems there, and for completely free. The only stipulation for your purpose would be that you have to a) donate, or b)  put a link to them in the footer.
Link to comment
Share on other sites

[quote author=448191 link=topic=110158.msg446891#msg446891 date=1159996469]
What's with the validity icons? A lot a lot of webmasters starting out put those on their websites, but my advice is: DON'T.

Your target audience could care less. Unless validity is relevant in some way for the visitors of the site, why distract them with unrelevant information?

[quote]This Website Compatable With The Latest Versions of Internet Explorer, Firefox, and Opera[/quote]

Again, your audience doesn't care, as long as it works for them. This type of stuff is between you and your client.

[quote]Please Have JavaScript Enabled[/quote]

I am a visitor and have javacript disabled, please provide me with an alternative method of navigation. How's that?
[/quote]

Blunt.  I like that. :)

Thanks for the advice.

And neylitalo, all I could find for menus on the site you linked to was one that, from reading the description, requires JavaScript to handle the hiding/unhiding of the 2nd+ levels, which is what I'm trying to avoid.  Are there any pure CSS ones on there that I didn't find?
Link to comment
Share on other sites

[quote author=Nightslyr link=topic=110158.msg447199#msg447199 date=1160060846]all I could find for menus on the site you linked to was one that, from reading the description, requires JavaScript to handle the hiding/unhiding of the 2nd+ levels, which is what I'm trying to avoid.  Are there any pure CSS ones on there that I didn't find?
[/quote]

only that work for firefox. with IE, there is [b]always[/b] a tad of javascript that's going to be required to help with some of the pseudo-classes that IE can't handle as of version 6 (i think 7 does better). check out [url=http://www.htmldog.com/articles/suckerfish/dropdowns/]the son of suckerfish[/url] dropdown menus to get one of the best ideas.
Link to comment
Share on other sites

[quote author=redbullmarky link=topic=110158.msg447225#msg447225 date=1160062995]
http://www.cssplay.co.uk/menus/

100% pure CSS menus. some of these have several levels and some you'd never have thought you could do without javascript. definitely worth a look, although some can be a little confusing to create at first.
[/quote]

I've visited that site before, and that's what I was thinking about when discussing the menu above.  I just really hate hiding the sublevels in tables in order to get them to work in IE, which is why I hesitated in using them.  It looks like that's the only way, though.
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.