Grow your CSS skills. Land your dream job.

Design critique – all input welcome

  • # December 23, 2011 at 5:33 am

    Hey all

    I just finished designing a website for on organization on campus. It can be viewed at http://oregonstate.edu/dept/rha/. Could you please take a look at it and let me know what you think?

    It a responsive design that works well for browsers of all sizes.

    Note:
    I am designing and developing locally so this is the theme with minimal pages/posts. Some links may not work.

    Any feedback would be great.

    Thanks

    # December 23, 2011 at 7:18 am

    Sorry, I hate the principal font you are using…at least the one I’m seeing on my PC.

    Perhaps something a little more readable?

    Also, it looks like you are doing something with image scaling in the ‘Partners’ section. Some of them really don’t work on big wide monitors…they get fuzzy.

    # December 23, 2011 at 7:49 am

    Yeah, the image width of 80% on my 1920px monitor looks very off. I’d suggest setting it to a fixed or not at all :)

    # January 8, 2012 at 4:09 am

    Hello again. I have made some changes and made the site live. Could you please check it out and let me know what you think. This is my first complete site design. Thank you.

    http://oregonstate.edu/dept/rha/

    # January 8, 2012 at 4:28 am

    The fonts really aren’t that nice, and the pictures in the partners are really blurry (1280 * 800) apart from the bottom one.
    I also find that they’re’s too much on the page, making a sort of mess.
    I like the menus and the header though.

    # January 8, 2012 at 2:29 pm

    Thanks. I will look at getting higher quality images and try to get a different font.

    any other ideas?

    # January 8, 2012 at 11:38 pm

    I think the problem that quite annoying is only the proportion of the margin between the elements that made me difficult in focussing.

    Just make sure that every heading element has a larger margin-top than the margin-bottom. That’s it.

    Sorry, I can’t speak English weeeelllll T_T

    # January 9, 2012 at 12:03 am

    I would suggest you look into “box-sizing: border-box;” for your menu. It has fairly good browser support and will allow you to use 50% instead of 49.7%. You can always work around the lteIE7 people.

    # January 9, 2012 at 1:45 pm

    Here we go.

    The header. I like it. Menu is good. Dislike the how there is little breathing room at the right though (Home, About Us, etc). Perhaps the color needs to change and that gradient is a bit too strong.

    The left bar: Dislike. The fonts, color variation, color selection, pretty much all of it. Try to clearly identify headers, from dates, to locations. They are ALL the same color, just a variant. Also the line selection that divides them is poorly executed (Facebook divisions from for example Sat Jan 28). I would make a clear distinction from the events compared to social networks. The Google white background, dislike. It blends poorly with the background.

    The partners. Again, the logos look stretched out. Bad. Try to de-saturate them on Photoshop so they look subtle. Make them blend in. You are forcing many colors of different logos within your design.

    The content. The first section is alright (New Website). I dislike the use of social media icons. Why one for EVERY article? It’s overkill. Include them in the actual article, same thing with the RSVP for Facebook (not fond of the harsh shadow). Also to the left, there is white that overlaps the side bar, about 15 pixels.

    I know it may seem like a lot and I hope I don’t come off as bitching to bitch. It needs a bit of work.

    # January 9, 2012 at 3:35 pm

    @OniLinkCR Thanks for all the great tips. I will add these to my list of things to work on.

    Google white background: I agree with you that it doesn’t work but unfortunately I couldn’t figure out how to change it since Google specifies the background color in the iframe. If anyone has any ideas on how to fix this I would appreciate it.

    Social media icons: Since people will be RSVP (most of the time) for events, I may remove them from events but keep them on regular articles. This should clear up the page.

    # January 9, 2012 at 7:23 pm

    Correct, the same thing with the social media icons. If I (visitor) am interested, I would click on the article. This gives you the benefit of a higher pages per visit ratio because really, why would I visit the site further if all the buttons are there.

    I would get rid of the Google thing if you can’t change the background. It breaks or makes it (to me).

    # January 10, 2012 at 2:40 am

    Alright so I changed the home/about/contact bar size and removed the social buttons. As a replacement for the buttons I added a share link under the headline which is just a link to the individual page.

    More changes to come.

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".