Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    Jul 2007
    Posts
    571
    Thanks
    25
    Thanked 28 Times in 28 Posts

    My 1st & Second Design!

    Hey,

    As the title says these are my first 2 designs, I'm still learning but please tell me your opinion on:

    -Which design you think has more potential
    -And any improvements u would make to either.

    Design 1: http://webperfect.50webs.com/ (Just went for a basic 2 column layout)

    Design 2: http://webperfect2.50webs.com/ (tried to be a bit more adventuris)

    PS: my images in design2 are not well defined... anyone know why they look so bad? i used photoshops vector menu to make them.
    Last edited by srule_; 07-08-2007 at 04:24 AM.

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    I like the first one better. It has that web 2.0 feel. The second one is okay but I think the graphics could be better. I see the jagged edges on the diagonal lines. I shouldn't be seeing those. I do like the header though with the check mark.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    Regular Coder
    Join Date
    Jul 2007
    Posts
    571
    Thanks
    25
    Thanked 28 Times in 28 Posts
    Thanks man,
    Do you know how i can fix those ugly lines? i guess i should just search for a good photoshop tutorial on optimizing images?

  • #4
    Regular Coder croatiankid's Avatar
    Join Date
    Jan 2006
    Posts
    665
    Thanks
    1
    Thanked 12 Times in 12 Posts
    The first one is definitely better. I'm sorry, but the second one just doesn't appeal to me at all, so I'll comment the first one.

    About the top link rollovers: I think the blue text (that comes on the mouse hover) doesn't have enough contrast against the gray background, so I think you should either darken it or lighten the blue (I'm not sure which would help, try a few shades darker and a few shades lighter and see which is easier to read/has more contrast).

    I like the gray background on the left link rollovers, but I don't really like the sudden change from the dark red/black image to white. It's just a bit of a shock, even though the image is relatively small. I would probably change the image that you get when you hover over it, maybe with a shade of red, or even a light shade of grey (along with the arrow thingy).

    Finally, I think your footer's top border is too thick. It just seems to obstruct the design too much (being a thick, dark red line in the middle of a white background).

    Overall, I think you pretty much nailed "web 2.0 design" (as I call it) on the first layout.

  • #5
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Location
    Lancaster, UK
    Posts
    1,134
    Thanks
    1
    Thanked 57 Times in 55 Posts
    ^ and to add to that I think, regarding the first design (I also preferred this) I think you should preload your images. I'm using a shared connection at work, so that left link in particular went from having a red square to nothing at first, which didn't look right. When the arrows did load it still wasn't quite there. Consider keeping the same small icons and just changing the background colour... or something similar
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools

  • #6
    Regular Coder
    Join Date
    Jun 2007
    Location
    N. Ireland
    Posts
    351
    Thanks
    16
    Thanked 4 Times in 4 Posts
    Would you consider changing the navigation links to block level:
    Code:
    a {
     display: block;
     background-color: grey;
    color: white;
    }
    Then you can set the hover:
    Code:
    a:hover {
     background-color: red;
    }
    That way the rollovers will have the same background colours as the pages they link to. You can extend this to images as well.

    Please note that i used the names of colours to identify them and do recommend using colour names.

    Hope this makes sense.
    Daemonkin.
    If this was helpful, please add to my reputation
    Thousand Sons - Freelance Web Developer - ninetyonedegrees.com


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •