Please critique my new mac icon site

Discussion in 'Web Design and Development' started by iostream.h, Jun 5, 2008.

  1. iostream.h macrumors regular

    Joined:
    Mar 4, 2004
    Location:
    Albuquerque, NM
    #1
    In accordance with the need to have a website to put on a business card at WWDC, I have created a little personal site showing off some recent icon and app projects. It's been a while (like 4 years :eek:) since I've made a site for myself, and I'd love to get some feedback on this latest iteration.

    http://olliewagner.com

    I'll be posting more about CatScan 2 as it is developed :)
     
  2. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #2
    Sure thing, here's my .02

    Right off the bat, I really like the layout and the color palette you chose which is soft, complimentary with warm accents coordinating with cooler colors. The rounded corners is well done, with a classy bevel in the masthead where the background color there is also found in one of the content graphics down below. I like it when sites look properly coordinated, and I also really like the gradient background as opposed to the usual boring black or other solid color used. I give you 5 out of 5 stars on the overall feel and usage of space on the site.

    Noteworthy issue:

    Your site does not validate by W3C standards, although I notice you are using div's for layout, CSS and so on, bravo for that. The validator reports minor infractions mostly including tag open/close mismatches. Fix those before going public, someone surely will check just as I did.

    FYI:

    Using Firefox 2.0.0.14 under XP your site disables my scroll button on my mouse, which isn't a big deal but in my experience means you've got some JavaScript that is checking for a certain event trigger which corrupts how the browser is able to focus. If you are not finished coding yet, disregard, otherwise check it out - other browsers might behave more oddly. I saw in your HTML source references to onKeyUp that calls an alert function plus functions that deal with the graphics that popup when the smaller graphics are selected (which is cool, love it) but might be contributing to this issue.

    Time to get picky:

    • Masthead links should use color, maybe a warm yellow, on hover
    • Text link hover color should be darker (not enough contrast) but if you prefer that, at least underline the link on hover which makes it more clear to the user its a link (aside from the cursor change)
    • When clicking on one of the graphics on the right, after the larger version shows, make it so clicking on the large image closes it. Currently the user has to click on the small graphic for that to happen (or any other small graphic). And if a user clicks on a different small graphic while the larger one is displaying, make sure it not only closes (as it does now) but also opens it's associated large graphic. You might consider using the GreyBox library which adds a "X" to close, much more intuitive, and looks spectacular too.
    • Have you considered adding a 4px very transparent subtle shadow effect and possibly match the small bevel for the rounded boxes that hold your various content? Very minor, subtle graphical changes to match the effects in the masthead and keep the site consistent. Very classy.
    • As I tell everyone, the mailto should be replaced with a "contact us" form which also allows users to select a reason for contact in a pulldown menu. Yes, yes, I know you encoded the actual email address so spammers and bots can't steal your address from the source. Good job doing that, at least.
    Beyond that, the site isn't finished and the limited content is presented beautifully with a simple interface that does it justice. I see no need to add more columns, break up the flow in the layout as some might suggest - sometimes a simple layout IS the best. Just fix those validation errors, make some improvements in the logic and design regarding the small/large graphics and maybe a few minor cosmetic enhancements involving hovers (CSS) and image bevels and shadowing effects and you've got a real winner.

    This is my .02, everyone has an opinion, no need to address all issues to please me, maybe you have a reason you did what you did! Peace.

    -jim
     
  3. iostream.h thread starter macrumors regular

    Joined:
    Mar 4, 2004
    Location:
    Albuquerque, NM
    #3
    Thanks for taking the time to write all that out Jim!

    The site now validates, and I have put some darker colors on hover for the links. The images *should* close when you click on their zoomed states (This works on Firefox 2 & 3 and Safari on my Mac). I'll make it so clicking a different small one when another is already zoomed automatically zooms the newly clicked one.
     
  4. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
  5. AcesHigh macrumors newbie

    Joined:
    Jun 6, 2008
    #5
    On my browser (firefox 2.0.0.14 on Win Xp pro) there was mouse stuttering, and very delayed scrolling . Kind of like slow motion, or lagged scrolling. Other than that.......;)

    looks good!
     
  6. emorydunn macrumors 6502

    emorydunn

    Joined:
    Jun 5, 2006
    Location:
    Austin Texas
    #6
    I noticed that when you click the "aout me" link the whole things moves down and then back up. It looks like it could almost be a rollover type thing exept it happends after I release my mouse. Other than that cheers! It looks great!
     

Share This Page