Page 1 of 4 123 ... Last
  • Jump to page:
    #1
  1. Eager to learn
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2009
    Location
    Maryland, USA
    Posts
    2,230
    Rep Power
    2179

    http://www.devwebsites.com


    Site is

    www.devwebsites.com

    Rep for useful critiques (I know its a toy)

    Nothing works on the site. It's just a basic layout for my pages
    "Quality of responses may vary. I reserve the right to change my mind for any reason what-so-ever without admitting I was wrong. I'd prefer to change your mind however, it's easier on my ego". - jwdonahue

    "so no-one has actually bothered to post an original quote ? what's wrong with making up your own?"
    - marnixR
  2. #2
  3. Eager to learn
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2009
    Location
    Maryland, USA
    Posts
    2,230
    Rep Power
    2179
    Just updated my design.
    "Quality of responses may vary. I reserve the right to change my mind for any reason what-so-ever without admitting I was wrong. I'd prefer to change your mind however, it's easier on my ego". - jwdonahue

    "so no-one has actually bothered to post an original quote ? what's wrong with making up your own?"
    - marnixR
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2006
    Location
    Germany
    Posts
    21
    Rep Power
    0
    With your current style, the first look goes to the header, then to the navigation and at last to the content. Isn't it better to get the first impressions on the content instead the navigation at left?

    Next, your head navigation have no hover effects. I think, it's better for all links on your site. The footer image have left a round corner, but at the top. It should be left at bottom to complete your layout.

    Comments on this post

    • Skipt agrees
  6. #4
  7. Cunning Linguist
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2003
    Location
    I used to live at home, now I stay at the house
    Posts
    10,180
    Rep Power
    2039
    I have a couple of issues with it...

    I looked at the page in FF3.0.7 and IE8RC1. If you're using other
    browsers YMMV.

    In no particular order:

    Design:
    • What's the point of the line in the background?
    • The gradient behind the top corner images doesn't line up with the
      background - either your padding/margins are wrong, or you just need
      to cut out the image(s) again.
    • Why does the footer have a top-left corner, but no others?
    • I think it looks like the grey boxes are supposed to have corners at
      the top and bottom, but your font-size or padding isn't sufficient -
      the bottom corners are only half visible.
    • The text in the second grey box and in the second blog post is
      misaligned - it should sit in the center vertically.
    • Same goes for the footer links/text.
    • Paragraphs of text that are center-aligned are generally harder
      to read than left-aligned. I would shift the the text in the grey boxes
      and the text in the "Featured Bug" box to the left and have it so
      that the heading was 10 or 15px from the edge and the paragraph
      lined up with it.
    • The blue in the post headings is too faded - I could hardly see it
      from certain angles on this monitor. Also, I don't see the need for the
      single rounded corner. Unless you're boxing the posts off with more
      than whitespace, I'd drop it. Whatever you do with the background
      to the heading, I'd shift the text to the left.
    • Why the fixed width in the menu? What happens if you have to add
      more items in? I'd just let the widths sort themselves out by putting a
      set amount of padding on the items - I think it'll look nicer if all the
      items were just the width of the text + 20px padding left and right.
    • I agree with laborix - that type of menu needs a rollover effect.
    • What's with the uneven padding on the left and right of the main
      section? It just looks like things are missing or that the page hasn't
      finished loading. I would shift the main content over to within 15px
      of the left sidebar, and either expand the width of the main section
      so it comes to 15px from the right edge, or shrink the width of the
      post headings so they fit the text and add in a 3rd column where
      you can list stuff like recent posts, categories, etc.
    • I'm not loving the turquoise rollovers on the already horrible
      turquoise background in the footer...


    Other stuff
    • I really don't understand the structure of your page. If I disable styles
      or just look at it text only, it doesn't make any sense. You have
      "mainHeader" followed by "rightHeader" followed by a list of article links
      folowed by the first blog post followed by "randomBug" followed by the
      second blog post...

      Is there a reason you did it that way? It seems to me like this should
      be a really simple structure with a .left and a .right div to put all the
      content in...
    • You must have some weird CSS in the header, because I had
      trouble actually clicking on the search box. If I click anywhere on the
      top half of either the box or the button, noting happens. I can only
      input text by clicking on the bottom. If I had to guess, it would be
      because of the relative position you give to all the header text. Why
      have you done that? Why not just use margins and padding to place
      the text?
    • Should the search box really be that prominent on the site? You're
      using a lot of space for something so small. I'd move it to a section
      in the sidebar and use the space in the header for something more
      interesting: headlines, news links, ads, quotes from your posts, etc.
    • Why does the heading say "Eric-Reese.com" and not "DevWebsites"?
      If I visit http://www.eric-reese.com/, I get a DNS error.


    There are a lot of things I'd have done differently with the CSS to
    achieve the same things, but I guess that's just down to personal
    perference. However, if the code you have is throwing bugs, it's
    usually a good sign that you should try to do it differently

    A little bit of attention to detail will go a long way if you're planning
    on a career as a web designer/developer...


    --Jon.
    Last edited by ChiefWigs1982; March 21st, 2009 at 05:27 PM. Reason: Can't spell for ****! :p
  8. #5
  9. 4:04 Time Not Found
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2004
    Location
    Northern Virginia
    Posts
    2,273
    Rep Power
    338
    Didn't read Jon's critique, so some of this may be duplicate; items are in no specific order.
    1. Title should be text only, should contain the title of the site and possibly the section.
    2. Background image is weird and not useful.
    3. I don't really prefer the rounded corners, they don't really seem to serve much purpose aside from saying "I've got rounded corners".
    4. Line height on "EricReese's Featured Bug" is odd.
    5. Navigation is in a list, which is quite good.
    6. Subsection headers should probably be the same font and should probably expand all the way across.
    7. Directory browsing in apache should be disabled, noticed when clicking on articles.
    8. It is recommended to turn off extended server status. "Apache/2.2.11 (Unix) mod_ssl/2.2.11 OpenSSL/0.9.8i DAV/2 mod_auth_passthrough/2.1 mod_bwlimited/1.4 FrontPage/5.0.2.2635 Server at www.devwebsites.com Port 80"
    9. W3C released an announcement awhile back requesting that the DTD files be hosted locally on your server, rather than http://www.w3.org/TR/html4/loose.dtd

    That's all I can think of for now, no offense is meant in any of this, these are just things I could think of off-the-cuff.

    Comments on this post

    • Skipt agrees
    I am so smart, I am so smart, S.M.R.T ... I mean S.M.A.R.T.

    Stop Using Pop-Ups
  10. #6
  11. Eager to learn
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2009
    Location
    Maryland, USA
    Posts
    2,230
    Rep Power
    2179
    Wow great critiques everyone. First off. @Jon. Sorry my rep cycle is down for you at the moment. I'll start off from the first critique.

    Thanks for the suggestion on the hover effect. Wasn't sure to include it or not. And about the rounded corners. Yea I noticed it looked bad to have it rounded for the footer and not for the bottom. I'm not a designer

    @Jon
    Line in the background is bad photoshop by a friend
    Thank you for the gradient issue. I need to have him fix it
    Again with footer, bad photoshop
    Nope, the gray boxes aren't. Its only supposed to be for that corner only.
    Yes about the alignment. I don't want to use an inline-element such as a span because I am using block level elements such as <h2> for SEO purposes. I will get to that ASAP
    Thanks for the tip on the paragraph alignment
    The point of the slightl blue is that it barely gets peoples attention. So they look at it and see what its about and go to look. About the rounded corner, again, I did not make these images.
    The fixed width is indeed an issue. I had to have one for the container because of the poor way the image was sent to me. He didn't give me rounded corner images, but instead one big image.
    Thanks for the footer rollover tip. I couldn't decide a color. Maybe no rollover effect at all?
    Yes I need to restructure my html and clean up my css. I whipped this up in a day in a rush. I want screenreaders to get to content first.
    Yes My css is weird I am still trying to figure out what style I am coding at such a young age
    Thanks for the suggestion on the search box. I actually uploaded this thread without it and then realized I had not added one. Thanks!
    About the website..I am using this domain to code then hosting the other one so I am not wasting money. Kravvitz asked the same thing.
    Actually that code is what I needed jon. If you look, my site displays perfectly in Opera, Firefox, IE8, IE7, Chrome, and Safari. IE6 throws some double float margin bugs around but for the most part most of that code was necessary. I am going to clean it up asap thought

    @vb

    I thought it would be nice to display what the sites about underneath. Maybe I should just stick that to the about me section
    I like the background
    I like rounded corners
    Ok I'll fix that line height. I was just testing out a little
    Thanks for the list complimenet...
    Ok thanks about the subsections
    How do you do that? I am no .htaccess pro.
    Same with #8.
    I don't use a loose doctype do I?



    @everyone

    Wow such amazing critiques. I shall follow all with great care. As soon as I clean up my code I shall post back with my new improved code and layout. I really appreciate it everyone
    "Quality of responses may vary. I reserve the right to change my mind for any reason what-so-ever without admitting I was wrong. I'd prefer to change your mind however, it's easier on my ego". - jwdonahue

    "so no-one has actually bothered to post an original quote ? what's wrong with making up your own?"
    - marnixR
  12. #7
  13. Cunning Linguist
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2003
    Location
    I used to live at home, now I stay at the house
    Posts
    10,180
    Rep Power
    2039
    Originally Posted by EricReese
    Yes about the alignment. I don't want to use an inline-element such as a span because I am using block level elements such as <h2> for SEO purposes. I will get to that ASAP
    I'm not sure how inline elements would help you, but there's nothing
    wrong with putting <span>s in <h#>s.

    Originally Posted by EricReese
    The point of the slightl blue is that it barely gets peoples attention. So they look at it and see what its about and go to look.
    My point was that it didn't do that - I didn't even notice it was there!
    I'd just ditch the bg colour and have the headings in big dark blue
    text [same colour as you site bg...]

    Originally Posted by EricReese
    Maybe no rollover effect at all?
    Are you talking about the footer? I'd probly just keep the links white
    and get rid of the underline on hover.

    Originally Posted by EricReese
    Yes I need to restructure my html and clean up my css. I whipped this up in a day in a rush. I want screenreaders to get to content first.
    You should be able to do that using 2 divs - put the right div first
    with your content in, set the width and float it right, then float the
    other one left.

    Originally Posted by EricReese
    Actually that code is what I needed jon. If you look, my site displays perfectly in Opera, Firefox, IE8, IE7, Chrome, and Safari.
    It looks the same, but the issue I was referring to is present in all
    the browsers I have...


    Originally Posted by EricReese
    How do you do that? I am no .htaccess pro.
    If you have access to the main config for apache [the httpd.conf]
    then you should do this there. If you don't, then you can still do it
    in the htaccess. "Options -Indexes" is the rule you need - google
    that for more info.


    Originally Posted by EricReese
    I don't use a loose doctype do I?
    Originally Posted by your site
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
  14. #8
  15. Eager to learn
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2009
    Location
    Maryland, USA
    Posts
    2,230
    Rep Power
    2179
    Oh mother of God. I thought I had a strict in there. Wow

    Ok I have updated my site. While Ido not have photoshop so I can't edit the rounded image *hint hint* I have done a paint job and fixed the rounded corners on most of the images

    I will google. Thanks

    I haven't got around to vertical aligning most of my stuff. I am having some css issues on the footer

    www.devwebsites.com

    I am going to post a thread in CSS because on the top right hand of page you can see a little bit of the rounded image in the top part of the page and that shouldnt be there. I can't figure out what it is. Updated my site btw.

    No. I have not got around to fixing my code yet..
    "Quality of responses may vary. I reserve the right to change my mind for any reason what-so-ever without admitting I was wrong. I'd prefer to change your mind however, it's easier on my ego". - jwdonahue

    "so no-one has actually bothered to post an original quote ? what's wrong with making up your own?"
    - marnixR
  16. #9
  17. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2005
    Posts
    51
    Rep Power
    35

    Re: Site


    Hey there,

    I'll add a couple suggestions too -- sorry if this just repeats what has been said )

    Overall, I like that you've taken the time to develop a color scheme. The grey, green and blue go nicely together, and provide attractive contrast to the muted scheme.

    The combination of horizontal and vertical navigation is also helpful. With respect to vertical navigation, if I were you, I'd make the vertical less visible (lighter) than the horizontal nav.

    As someone else mentioned, it's important to consider what you want a site user to see first, next, and last. The boldness of the elements plays a large part in that.

    In order to differentiate the elements, I might also place more space between the blog posts, and the top navigation - 10 to 20 px should be fine - and either center, or left-align, the text in the blue bar -- but then center the text vertically in the div, so there's blue both above and below, rather than just below (the text lacks a visual ground). I'd standardize the font used in blog titles, as well.

    Finally, I really like that you've taken the time to place nav at the bottom, as well - the oft-forgotten sitemap is especially helpful.

    All in all, great work!
    --Dave
  18. #10
  19. Eager to learn
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2009
    Location
    Maryland, USA
    Posts
    2,230
    Rep Power
    2179
    Thanks. All I have to do left is center the blog posts, create more space, and turn the latest css articles list into links.

    Oh yea and edit the image to have the same hex code as the bg color.

    I may create more space. This is a personal site remember. This isn't about pleasing the users.
    "Quality of responses may vary. I reserve the right to change my mind for any reason what-so-ever without admitting I was wrong. I'd prefer to change your mind however, it's easier on my ego". - jwdonahue

    "so no-one has actually bothered to post an original quote ? what's wrong with making up your own?"
    - marnixR
  20. #11
  21. Cunning Linguist
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2003
    Location
    I used to live at home, now I stay at the house
    Posts
    10,180
    Rep Power
    2039
    Originally Posted by EricReese
    This is a personal site remember. This isn't about pleasing the users.
    Behave. What's the point of it then? :/
  22. #12
  23. Eager to learn
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2009
    Location
    Maryland, USA
    Posts
    2,230
    Rep Power
    2179
    Behave..?

    The point of it is for showing off my portfolio, having a css reference of all properties and which browsers they work in, plus CSS3 and more on my site.

    The only browser my site fails in is IE6 and thats just a bunch of double float margin bugs.

    @Chief

    How do you like my site now? Anything I missed?
    "Quality of responses may vary. I reserve the right to change my mind for any reason what-so-ever without admitting I was wrong. I'd prefer to change your mind however, it's easier on my ego". - jwdonahue

    "so no-one has actually bothered to post an original quote ? what's wrong with making up your own?"
    - marnixR
  24. #13
  25. Cunning Linguist
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2003
    Location
    I used to live at home, now I stay at the house
    Posts
    10,180
    Rep Power
    2039
    Originally Posted by EricReese
    The point of it is for showing off my portfolio, having a css reference of all properties and which browsers they work in, plus CSS3 and more on my site.
    And all of that is for who's benefit?
  26. #14
  27. Eager to learn
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2009
    Location
    Maryland, USA
    Posts
    2,230
    Rep Power
    2179
    Me, and my employers who want to see my portfolio...

    And maybe anyone who I post a link to my site here on the forums in reference to helping them out.
    "Quality of responses may vary. I reserve the right to change my mind for any reason what-so-ever without admitting I was wrong. I'd prefer to change your mind however, it's easier on my ego". - jwdonahue

    "so no-one has actually bothered to post an original quote ? what's wrong with making up your own?"
    - marnixR
  28. #15
  29. Cunning Linguist
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2003
    Location
    I used to live at home, now I stay at the house
    Posts
    10,180
    Rep Power
    2039
    Do you not see the irony in making a website to show off your work
    if you don't care if the site looks/feels/works well?

    Comments on this post

    • Skipt disagrees : No I don't have a lot to learn. By the time I will go into this field, ie6 wont be used in a corporate environment
Page 1 of 4 123 ... Last
  • Jump to page:

IMN logo majestic logo threadwatch logo seochat tools logo