Jump to content

Archived

This topic is now archived and is closed to further replies.

jcombs_31

possible re-design

Recommended Posts

I want to create a new design for the school I work at.  They want to incorporate more student pictures and a wider layout.

The current site is http://www.coralgladeshigh.com

The drawing I was working on is http://multimedia-technologies.com/misc/CGHS.jpg

I've had one person at work say yes, and another say no, what do you think?

Share this post


Link to post
Share on other sites
my vote is a conditional yes.  it's definitely more colourful, the photos add nicely.  my only beefs lie with the following nitpicks:

1)  i can't stand the opaque white glow behind the school name's letters.  i assume you put it in there for contrast and to separate the shield, but i'd suggest making the glow around the letters a solid rectangle.  the current glow's bulby nature doesn't mix nicely with the straight lines and rectangle geometry of the rest of the site in my opinion.  i'd have to see it to know whether a rectangle cutout is any better though.

2)  probably one you'll fix before actually ripping it up into site-layout, but the shield isn't aligned horizontally.  the top half lies to the right of where it should.  really bothered me since the footer lends closure, but my eyes just can't get around the incongruence.

either way, i'm just being picky.  excellent incorporation of the width and photo requirements, and definitely feels warmer on my eyes than the old one.

Share this post


Link to post
Share on other sites
I would definitely vote for the new design over the first. There are a few nitpicking things I would have to say about the new design as well, but I'll wait for the full critique request to post those ;)

Share this post


Link to post
Share on other sites
http://multimedia-technologies.com/misc/CGHS2.jpg

possible different header

edit:  Also, the site would be center and possibly fluid.  Not sure yet.  I'm not sure splitting the crest works, but I think the crest is a big too tall, and looks stupid when I shrink it too much.  I would like to keep the header center, but it is a little empty that way.

Share this post


Link to post
Share on other sites
centering looks like it'd work for this.  also i think it looks much better now.  the footer feels sparse, but i imagine you'll be tossing some links in there soon enough.  as for the crest, i think it looks alright where it is as long as you push the nav down just a smidgen.

if you want to keep the header centered, could you maybe push the crest in towards the right a little, and start the school name and principal's name from the left of the center column keeping it left-aligned?  could give the illusion of centering while maintaining the rule.  although i don't know how clumsy that would make the crest look, and how much it would infringe on content.

Share this post


Link to post
Share on other sites
Yea, I'm having some trouble with the header.  Another option http://multimedia-technologies.com/misc/CGHS3.jpg

That basically just increases the size of the font and crest head, but eliminates the body of the crest, which I did not split to the footer.

Share this post


Link to post
Share on other sites
looks cleaner, but the principal's name seems a little arbitrarily placed and it doesn't really feel as academic without that crest.  if you can get the crest in there somehow, would probably complete the look - if not, this is a good sans-crest design.  i like.

Share this post


Link to post
Share on other sites
most definitely the second design, or some form of it. i had a problem with the crest chopped in half, and also the lack of crest in the 3rd, as has already been mentioned - it's almost standard for a school website to have its crest, and in full display.

nice job though

Share this post


Link to post
Share on other sites
I would stick with header #2 but i would cut that stroke/glow down a lot, try it (if it is stroke) to 1px or 2px, I don't think I would go over 2 though.

I def like the new design though. Once you get the footer filled in it will look a little better too. I also like the icons you used, did you make those or find them somewhere?

Can't wait to see the live version.

-Chris

Share this post


Link to post
Share on other sites
hmm, how about this one http://multimedia-technologies.com/misc/CGHS4.jpg

edit:  I've also considered moving the login up to the header, but not sure.

Share this post


Link to post
Share on other sites
I like that one better. I also like that you moved that lower nave over to the right. I would keep the login where it is.

Try cutting the footer down a little (half) and see how it looks. Right now it looks a little too big.

-Chris

Share this post


Link to post
Share on other sites
http://www.coralgladeshigh.com/v2/  That may help to see it as it may look. Login temporarily removed. I may just add a link and have its own page

Share this post


Link to post
Share on other sites
The layout is a lot better in the new design. It looks good, and I think it would score high on usabilty if reviewed.

The old site looks a lot more "finished", though.

[*]I think you should really re-introduce the white on green for the header and headertext. The footer would then look better in grey.
[*]The jaguar in the old footer is a nice touch. Maybe get a different image if you don't want to reuse this one.
[*]Reuse those vertical diagonal lines a bit more. I loved those in the original design. It fits really well with the jaguar emblem, and generally just adds to the "trusty" look, as in "I want to send my children to school here".
[*]The new design doesn't look too well on 1280x1024 or higher. Way too much empty space on the sides. Maybe you should consider limiting the content area horizontally, similar to your original design. I noticed this on your own site too, but now I realize you're probably only viewing it at 1024x768, and then it looks great.

One more thing, in IE the height of the footer is too big. This is probably what cmgmyr was talking about. It doesn't look that way in FF.

I made a screenshot for you, showing how it looks on 1980x1024 in IE:

[img]http://home.orange.nl/lekkage/img/coralscreen.png[/img]

I doubt that is how you intended it to look.

Share this post


Link to post
Share on other sites
thanks for the feedback, but what vertical diagonal lines are you talking about?

Share this post


Link to post
Share on other sites
[quote author=jcombs_31 link=topic=112926.msg459717#msg459717 date=1162164090]
thanks for the feedback, but what vertical diagonal lines are you talking about?
[/quote]

LOL, I said "vertical diagonal"... I just meant diagonal. You know, those thin lines you used on the green header of the old site.

Share this post


Link to post
Share on other sites
ok, I made some changes and started coding the markup.  I decided to go with a fluid 100% layout.  The base is started here http://www.coralgladeshigh.com/v2/  The only problem is what I wanted to implement with the main caption picture. I want to stretch the image to fill the width on the center content, but this presents some problems.  I'm thinking about the best way to do it.

Share this post


Link to post
Share on other sites
Good call on the fluid width.

Maybe zooming the image is possible with CSS, I've never tried anything like that. I doubt it will be easy.

I still stand by my suggestion on switching the header and footer colors. I really really really think it would look better.

Anyway, if you find out how to accomplish fluid image size, please share.

Share this post


Link to post
Share on other sites
I'll change up the top and bottom for the hell of it to see how it looks, but I think the darker color on the bottom will be better.  I'll post again with another version. 

As far as the top image, the only way I can think to do it is to make a container that is fluid and set the large image as the background in the container.  This will allow more of the image to show as the screen gets wider.  BUT, they want to make it like a slideshow at the top that will cycle through images, so I think that option is gone.  I have to come up with a way to make teh content area like I wanted

Share this post


Link to post
Share on other sites
I've made more progress and decided against changing the top and bottom colors, I just didn't like it. http://www.coralgladeshigh.com/v2/ 

Share this post


Link to post
Share on other sites
Too bad. I still like it though. Nice touch with the image viewer!  :)

It has an overlapping issue at 800x600 though:

[img]http://home.orange.nl/lekkage/img/cgh800600.gif[/img]

Might seem like nagging, but w3c schools claim still almost 1 out of 5 surfers use it.

Besides, your designs are always pretty good looking, so I am forced to nag about details..  :P

Share this post


Link to post
Share on other sites
I know about the 800x600, just think I decided not the care this time.  I may reconsider but it will require me to shink the menu down and not sure I want to. I'm also having slight problem with the slideshow, which is strange because it works perfect on my local box, but acts strange with a couple photos when I uploaded it.  Can't figure out why.

Share this post


Link to post
Share on other sites
Looks good. You have an eye for detail.
The sub Nav menu - very nice - and has a very nice a:hover.

I didnt think you would be one for a FLASH photo album! Maybe times are changing! But as you mentioned - not all the photos were willing to come up.

The calender needs some dressing up IMO. It just looks a little unstyled compared to the rest of the site.

I think your left Nav area is too wide. The width of the left column is more than the right - well by a few mill. Like if there is going to be a title longer than Clubs and Organisations - it should cleanly wrap around. This will save the overlap at 800x600.
And from my experience of computers in schools - they are all at 800X600 to have big text and icons for the kids.

Rgds,
Steve

Share this post


Link to post
Share on other sites
I slimmed the nav a little and styled the calendar container some. Still not making the 800x600 cut. As far as the school comps, all are a minimum of 1024x768, we have a lot of widescreen imacs too.

Share this post


Link to post
Share on other sites

×

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.