Grow your CSS skills. Land your dream job.

Design Refresh (Version 5)

Published by Chris Coyier

The new design has been rolled out. Nothing to shockingly different I hope, just a refresher. It's kind of hard to say, but I think this is the 5th significant iteration of the design at this point. The lines are fuzzy since the design evolves in between those iterations quite a bit. One of these days I'll have to do a post showing snaps of all these old Photoshop files of old design ideas. Holy cow there is some awful design work in there.

Motivation

The biggest reason is that I really wanted to do this Snippets idea. I had it all built and ready to go but no good way to integrate it into the old design. I thought it deserved it's own main tab, so I started there.

The other main target was the sidebar. The old sidebar had a featured ad on top, ten 125x125 ads, and another featured ad below that. 12 ads, and that took up and enormous amount of space. There are still ads, there will probably always be ads, but they have been rejiggered a little bit to still be good for the advertisers but take up less space for the other more content-oriented sidebar stuff.

Search has also moved into the header. That freed up some sidebar room as well and search still retains a prominent spot. There is quite a bit of content on this site now, so the search targeting gets more and more useful every day.

New Stuff

Other than the design itself, there

  • Snippets area
  • Posts now have "theoretically related posts". I hope this is useful to folks looking to read more about topics when they are finished with an article. I hear it's great for pageviews too so what the hey.
  • Sidebar has new content, like a Blog Roll of some of my other blogs Digging Into WordPress, Quotes on Design, and Script and Style.

To-Do

  • I need to create a better contact, about, and advertising pages and make those easier to find.
  • I'd like to work on improving the typography in the articles. Just to liven things up. For example, the little star graphics for these unordered lists really have to go.
  • Try out some new-fangled font technologies in production. I might try TypeKit, but I think it might just at that range where the bandwidth would be too high for the reasonably-priced plan.

For Posterity

Old

New

Regular programming will return later this week. Even a screencast I hope. Might be a quicky, but I have a great three-part series coming up!

Comments

  1. TheDoc
    Permalink to comment#

    Looks good, Chris!

  2. Definitely a good refresh on the design and content, I’m impressed with the snippets page.

  3. Permalink to comment#

    I’m really digging the header, Chris! I’m not personally so keen on the sidebar but that’s just me.

    I’m curios about the 3 part series…

    • I agree with Paul :) great design, although the Sidebar kind of dominates the page abit much.

    • Permalink to comment#

      I know what you mean, but after a bit, it seems like it fits. I dunno. It’s definitely a thing where you either like it or hate it.

  4. Permalink to comment#

    Great job chris!

  5. Permalink to comment#

    One thing maybe you should use some webkit animation with the navigation.

  6. Permalink to comment#

    Love the new design! The header is my favourite part :)

  7. Chris Adams
    Permalink to comment#

    Definitely an awesome looking site!

  8. Permalink to comment#

    I preferred the previous one. The sidebar is somehow heavy. You know, I’m a big fan of your wp-typo theme: no additional content at all! :)

  9. Permalink to comment#

    bravo for the new design :-) i really like it much better than the one before i like the way you set its banners the best, good luck Chris!

  10. Ashish
    Permalink to comment#

    The refreshed look i feel is better than the older one i like the header although not so keen on the sidebar it looks out of place atleast for me ……i also like the related posts stuff that u put up ……gr8 job Chris

  11. Nice! Well done Chris.

  12. Permalink to comment#

    The 3dish perspective of the headings in your sidebar don’t make sense when combined with the different drop shadows on the rest of the site. Choose a light source and stick with it..

    • If you picture the light source as coming from around the search bar in the header I think the light source pretty much makes sense. Although it’s not as obvious as I could be, I’ll have to work on that.

    • I think it looks alright, adds dynamic too the sidebar widget headers.

    • I must agree with Colin. I don’t like that bit.

    • yeah, when I first looked at the new re-design, I loved the main navigation and stuff but the 3dish sidebar header kinda felt out of place.. This 3D effect looked good in the old design cause of the shadowy effect on the sidebar but over here it just looks a bit out of place :)

    • Ryno Burger
      Permalink to comment#

      Honestly, I think it’s just fine Chris!

    • Permalink to comment#

      Looks like you changed the headings, they fit much better in mu opinion. nice one!

  13. Jarret
    Permalink to comment#

    Nice job on the redesign, really like the Snippets section! Will be quite handy!

  14. Love the re-align of the website Chris! Great job as always.

  15. Looks great! :)

  16. Torsten
    Permalink to comment#

    I like the new design refresh, but I also agree with colin about the 3d thingy in the sidebar.
    Anyway, keep up the good work!

  17. Imran Khan
    Permalink to comment#

    Very nice indeed!

  18. Marc
    Permalink to comment#

    Sidebar doesn’t look really good on Firefox 3.5.2… Box titles (FAQ, Blog Roll, Poll…) are overthe box content…

  19. Permalink to comment#

    I was a big fan of the last design (the 3D sidebar influenced my own redesign) but this looks great. Especially the header and navigation appeal to me. I have to agree with other comments that the sidebar looks kinda heavy, but it contrasts nicely with the main content and it doesn’t really bother that muchI think. The 3rd perspective on those titles seems a bit lost now. Maybe they’d work better when darker as well? Now they kinda flow over in the white of the surrounding area.
    Also: hover-effect on the sidebarlinks takes away your border-bottom, which makes the links jump up and down. A bit irritating.
    Keep up the nice work!

    • Permalink to comment#

      okay, that last point? I’m looking in Safari and you see the ‘Blog Roll’ block jump when doing a mouse-over on the bottom-link of the F.A.Q.

    • This jumpy stuff should be fixed… that’s one of my worst pet peeves actually!

  20. Lucky
    Permalink to comment#

    great job dude……

  21. rizza
    Permalink to comment#

    Looks nice, Chris.

  22. The new header is nice especially the search box, a simple thing that looks really cool. Not sure about the sidebar though it’s a bit imposing on the article. Widen the article area and give it more space to breath – I feel claustrophobic down here!

    • LuK
      Permalink to comment#

      =))…@claustrophobic…maybe a a gradient would do better? and how about making the wraps go “behind” on both sides?

    • Permalink to comment#

      I agree, the sidebar ads seem to grab more attention than the article. And that’s when I feel justified using an adblocker…

  23. Permalink to comment#

    Looks great but is it only me, or is the list links in the sidebar jumping when you’re in a specific post?

  24. Tim Tunbridge
    Permalink to comment#

    Big thumbs up although I’m still not keen on the 3d effect going on in the sidebar. I always loved the reciprocal “pixel” links in the footer/logo – I assume they’re lurking in here somewhere waiting to be discovered? Another big thumbs up for the new Snippets too.

  25. Permalink to comment#

    Looks good…
    Though used to like the first design. The reading are was much more. In new design i feel it is more focused towards sponsored links.

  26. Permalink to comment#

    Great. As always …

  27. Permalink to comment#

    I’ve just spent an hour in the snippet area in awe! Well done. Opened to suggestions/submissions? ;)

  28. Antony
    Permalink to comment#

    The redesign is quite nice although there are a couple of things that I find a bit annoying;

    Really like the idea of snippets although the JQuery accordion style drop downs are not particularly user friendly in particular once you’ve clicked a snippet and then return back to the snippets page you have to open the snippet option again, I was hoping to click through a whole bunch to get an idea of what they were but in the end got a bit bored after one or two.

    The sidebar seems to be a bit overwhelming, it’s size to me just seems a bit too wide, although I realise you need to make money from advertising.

    The light ‘off’ state primary nav could do with being a bit darker (bearing in mind colours from an accessibility point of view).

    Other than that, not too shabby!

    • LuK
      Permalink to comment#

      Jep, had that problem too…but you can just open every snippet in a new tab and that isn’t really annoying^^

    • Jack Feefofe
      Permalink to comment#

      The new design is great!

      I do agree, however, that the sidebar is a bit big, especially compared to the size of the content – it feels a bit squeezed!

      The sidebar also feels heavy, especially when the sidebar content ends (like down here by comments). I know last redesign many commented on the large white space and suggested some texture, etc, but maybe the brown is a bit too dark?

      Otherwise fabulous job!

  29. Leighton
    Permalink to comment#

    Nice spit and polish Chris… and the Snippets gallery is a godsend.

    Thank you for making this tremendous resource available.

  30. Permalink to comment#

    You just love changing your site don’t you! Looks good, I think this is your best so far.

  31. ConCy
    Permalink to comment#

    I can’t say other then.. you did it again !
    Overall a good improvement.

    However, as I see others have posted aswell while scrolling down, the sidebar is a bit distracting.

    I personally like a lot that black is coming in the design. Cool stuff looks best without borders and on a black background.

    However, with the sidebar fatter (check screenshots, the new sidebar is wider, no shadow, and more pushed to the left). If the sidebar starts a bit more to the right, and has a spacy breathing shadow it would bring back the attention to the article. My eyes are kinda wanting to go to the left but sucked away to the right by a big wall, (especially after the sidebar-content is done, meaning only an big empty black column.

    Also frighting is when browsing the frontpage, the “div.date” with the horizontal line is almost eaten by the sidebar, there used to be some space there. Stretch the article-column, either literal or as a ilusion.

    For al the rest (I like the header a LOT ), there are a lot of small improvements. I see you’re minimalisting here and there, looks pretty cool !


    Thanks again, looking forward to the screencasts series coming up.

    • ConCy
      Permalink to comment#

      PS: I figured out why the sidebar lists items (featured, blogroll etc.) are all moving up 1px on hover.

      In the ad on top of the post
      Vertical1241314 = false;
      ShowAdHereBanner1241314 = true;
      RepeatAll1241314 = false;
      NoFollowAll1241314 = false;
      BannerStyles1241314 = new Array(
      "a{display:block;font-size:11px;color:#888;font-family:verdana,sans-serif;margin:0 4px 10px 0;text-align:center;text-decoration:none;overflow:hidden;}",
      "img{border:0;clear:right;}",
      "a img, a:hover, a:hover img {border: 0 !important;)",
      "a.adhere{color:#666;font-weight:bold;font-size:12px;border:1px solid #ccc;background:#e7e7e7;text-align:center;}",
      "a.adhere:hover{border:1px solid #999;background:#ddd;color:#333;}"
      );
      document.write(unescape("%3Cscript src='"+document.location.protocol+"//s3.buysellads.com/1241314/1241314.js?v="+Date.parse(new Date())+"' type='text/javascript'%3E%3C/script%3E"));


      There is:
      "a img, a:hover, a:hover img {border: 0 !important;)",

      That one is deleting also the border-bottom from a:hover inside (for example) “#sidebar ul#sns-roll li a:hover”.

      So you might wanna be a bit more specific with the css javascript’ed in for the post-top-ad ;)

      ByTheWay, I didn’t realise it’s the same Chris that does Digging into WordPress. Nice site over there !
      Regular subscriber speaking :D

      Grtz,
      Tem

    • LuK
      Permalink to comment#

      LOL, saw the new design (it’s nice @ Chris) played around a bit and saw the jumpy behaviour of the sidebar-list-items…just wanted to do som diggin (saw the border thing too) but you did that very well!

      My favourite parts are also the header (nice new tabs with description =D) and I think the comments are organized very well too…just the “Reply” link is sort of…don’t know how to say it =)…I think it should be a bit more button-like (but that’s just me) and it would be nice if it disappears when someone clicked on it…now the comment form has appeared and the reply link is still there…=)

  32. Permalink to comment#

    Its cool. Look great …

  33. Permalink to comment#

    Could you please change the color of the writing in black? (is better than actual gray)

  34. Peter
    Permalink to comment#

    The new design refresh looks great Chris!

  35. Very nice improvement! My complements.
    To bad you didn’t fix the png IE6 problem.
    I’m viewing in IE6 now. (don’t ask why) and it’s a shame to see you didn’t fix it (or the fix doesn’t work).

    • LuK
      Permalink to comment#

      Or it’s a shame that some people still use IE6…that is really annoying to every designer (I even think microsoft designers hate this thing =D)…and the only way to stop those 15-20% of the IE users that still use IE6 is to make the sites look ugly in their crappy IE6, then they maybe change or don’t come back…and since this is a design related site it’s not that important I think…and the time to make everything work in this shitty piece of code could be used in many better ways…but maybe you don’t have a choice and have to use IE6?? (poor guy =D)

    • I wasn’t home when I was checking the site out. I had no other choice then to use IE6.

      I think it’s very important to include a png fix. It doesn’t take that much time if you know how it’s done. Even google offers a solution.

      BTW in IE6 the website doesn’t fit also. The sidebar is positioned all the way down near the footer.

      In FF it looks great though!

    • LuK
      Permalink to comment#

      What places do only have IE6?? Ever heared of portable browsers and memory sticks =))

  36. Permalink to comment#

    Looks good.

  37. Permalink to comment#

    Love the new header. Really love the content of the site in general. Need to politely agree with the sidebar haters. My only problem with it is the pop out headers. Have never really liked those on any template. Again not keeping me from coming here for the awesome content though.

  38. Permalink to comment#

    I like that you have been re-aligning the website in small iterations, but this one just feels odd. I think its the ratio of the sidebar to main content aspect. I understand that you have to include the ads, but the sidebar just feels too big and calls too much attention.

  39. Karl Oakes
    Permalink to comment#

    Loving the header Chris, you are getting the initial flash of content on your snippets page, which can be sorted. Good job :)

  40. Chad
    Permalink to comment#

    Great Job. I’m a big fan of the new tabs with icons and small descriptive text.

  41. Eire32
    Permalink to comment#

    I love it. Some small little things that get though, when you change your search type (ie. from articles to all and vice vera) you get a small 1px shuffle, Also i would agree with some of the comments that the sidebar is a bit strong, but we’ll get used to it, or even lightening it a few shades would help. Overall I love it to bits!

    • Eire32
      Permalink to comment#

      Ahh also forget, can you add a background image with an !important to cover over than horrible default pollbar gradient, or not as good for when you upgrade the plugin, just edit the default image to something that suits this wonderful site.

  42. TeMc
    Permalink to comment#

    Very very nice Chris.
    You tried again, and pulled it off very well.

    Small nitpicks:
    * The 404-error page is a little too wide, the sidebar jumps below
    * The sidebar on it’s self doesn’t quite fit in with the page. Although the contents and the look are perfect, the top part doesn’t “come out of the header” or attaches itself to the page, it’s just… there.

    The old one was laying on top with the shadows, and other sites’ sidebar’s sometimes start apart from the header. The current situation is neither and looks a little strange.

    Also, agree with ConCy that the width is a little weird, article to small, sidebar too wide and too far to the left.


    Gretz, keep up =)
    Thanks for everything !

    – Tem

  43. Permalink to comment#

    Very nice! I love the new design.

    A tiny imporvment, (but it’s the tiny thing that matter :D)

    The tabs should fade in and out using jQuery to make a slower and smoother effect. That’s be cool and modern.

    Great refresh though, I love it :D

  44. The header tabs look really great, I love the graphics.

  45. Permalink to comment#

    I liked that you had your twitter post at the bottom of the site. Why was it removed?

    • If the site was ever slow, that was usually the culprit. Twitter has a lot of outages and slowness still, and it’s just too risky relying on them for a page to load quickly.

      The code I was using was supposedly written to handle that, but I don’t think it worked quite right. I might homegrow a solution to put it back in at some point.

    • Matt
      Permalink to comment#

      Have you ever tried delaying the load of the widget until the container div was in the viewport?

    • Permalink to comment#

      How about using JSON feed jquery from Build your own social home demo? Get it to fade in after the page has loaded. As it is at the bottom of the page, unless you scroll to the bottom of the page straight away you will not see it come in.

  46. I think it looks a millions times better than it did before. I actually thought I was on the wrong website for a second.

    Excellent work, I especially like the new links. Sprites by any chance?

    • There are sprites used all over the place. Probably not as much as I should have, but more than the old design for sure.

  47. The background images for the comment input boxes doesn’t show. The “#comment-writer-info div input” is blocking the images from showing with the “background: white none” property.

    I’m digging the header.

  48. Permalink to comment#

    This is tight. I look forward to each update. Love the accent of 3D. Nice. :-)

  49. Permalink to comment#

    This might sound weird but I LOVE the new bottom of the sidebar with Abe chillin’ on the footer. It’s like “what’s up little guy?” great stuff.

  50. Jason Buck
    Permalink to comment#

    Every tweak makes you site better. Your site has helped me learn more CSS and think about design differently. I recommend your site to everyone I know that shows an interest in web design. Thank you for all you give back to the web design/developer community.

  51. DougS
    Permalink to comment#

    great work as always.

  52. Good job on the redesign Chris! I hope to use the snippets section quite a lot!

  53. Overall I like it. I am not crazy about the navigation tabs though. They are a bit busy for my tastes. Good work though!

  54. Permalink to comment#

    Looking good. Pretty narrow posts, but the header looks good. It does come together nicely.

  55. Permalink to comment#

    Looks good Chris.
    Just wondering if I was the only one having a problem with Firefox not displaying properly on the side nav? All of the H3s are dropped about 30px below the sidebar-bridge. Played with Firebug and it seems to have something to do with the Italic font-style. Thought you should know.

  56. I dig the new look. Unlike some of the other commenters, I like the sidebar. It brings a nice contrast to the overall design.

  57. Danc Chan
    Permalink to comment#

    Nice approached. I guess this one is definitely better and nicer than the previous one.

  58. Permalink to comment#

    keeps getting and better! It seems like you learn a lot with each iteration. Each time the design seems clearer and better organized.

  59. al
    Permalink to comment#

    Like the new header as it seems to be better layed out but the menu list items seem a bit too faded with the orange on them. Perhaps a lighter grey instead of the orange coming over them.

    On my screen when I click the options under the search bar the text and magnifying glass move slightly which is a bit strange (firefox 3.5).

    Sidebar seems just a bit too large to me.

  60. Wow the snipped thing is really the best thing I’ve seen on any blog I’ve been :D

    I cant find the words how I like CSS-tricks :D

    I will feature you every time I can if my blog goes up :D With your premission off course :D

  61. Permalink to comment#

    chris, I think the snippets button looks odd, maybe because the other buttons have an image at one side and this one has images at both sides, how about the or {}at the start of the button???

    Also your bullets/list item images, have you had a small orange version of the asterisk you have as a logo been used? but just the asterisk?

  62. Kyle Cotter
    Permalink to comment#

    Love it… yesterday in school I was checkin out an article in the old version of the site, then 2 hours later i come back and see this totally awesome redesign…sweet

  63. Glenn Van Bogaert
    Permalink to comment#

    Well, I like the redesign. Its much better.

  64. Permalink to comment#

    I love it!!!!!!!!!!!!!1

  65. Permalink to comment#

    Personaly prefered the old one, this side bar is pretty huge, more space for adds and less for content, not so cool.

  66. Great work with the redesign and good to see you put more thought in the usability of the site rather than just the visual appeal and the snippet’s area. :) The related posts and the blog roll of your other blogs are two updates you should have done long back! But better late than never hehe

  67. Permalink to comment#

    Real improvement to the header and I actually like the giant sidebar, nice style, something different, the footer is the only questionable part of the redesign, good stuff though all around.

  68. Permalink to comment#

    Nice Touch!

  69. Personally I preferred the old design, but this one is nice, nonetheless. :)

  70. Permalink to comment#

    Looks Great!

  71. Still a fan of the old one … this one is too crowded…

    bug: the form drops down a bit when u click Articles, Forums or Snippets (FF 3.5)

  72. Permalink to comment#

    Very nice new design! By the way, it has a horizontal scroller on a 1024×768 screen.

  73. Jillian
    Permalink to comment#

    I love the tabs with the hand drawn elements, as well as the footer. Agree with others that the sidebar might be a little distracting/large. Overall, very nice!

  74. Permalink to comment#

    Love the new look. I think there’s an issue with the sidebar. I’m using FF 3.5.2 and the first few entries are not clickable. For example, Featured Articles, Core Concepts, etc. you cannot click the top two links.

  75. jsdev
    Permalink to comment#

    I like the new design. Esepcially the top navigation

  76. Permalink to comment#

    Nice refresh Chris! The top nav is alot nicer.

  77. Permalink to comment#

    Just a heads-up:
    Screenshot from my laptop: http://i30.tinypic.com/14dq1b8.png

    1024×768 resolution – and I’ve got a horizontal scrollbar.

  78. scott
    Permalink to comment#

    I realize not many in this crowd use IE6, but I have to tell you the site is jacked up bad in IE6. I’m just sayin.
    Otherwise great refresh.

  79. scott
    Permalink to comment#

    Also, just recently I noticed that the videos don’t have controls. You go too fast for me, or my brain is slow. I need those controls. I checked it out in IE6, the other browser on my machine at work, and controls are there. The CSS is off but the controls are there. I guess I just want it all.

  80. Jermaine
    Permalink to comment#

    smashing stuff greate job on the new design

  81. Thanks for all the feedback folks. I took care of most of the issues presented here today. The weird sidebar headers problem is gone, and in fact that whole approach is changed now with some less strangely-3D headers.

    The 1024 problem should be fixed. This will probably be the last design restrained to that width.

    • Ah, this new header looks very classy and goes with the feel of the site :) *Thumbs Up*

    • Ashish
      Permalink to comment#

      Hey chris ….there is a a jjumpy feeling in the search bar u have the search criteria’s listed out over there…..when i click on all and articles …..the search bar gets jumpy……
      i found this in Firefox 3.5 windows

  82. Nice redesign, it’s very colorful and quite well marked up just as the last design. Since the sidebar is so wide…I wonder if it would look better all the way on the right side instead of having that margin on the other side of the sidebar? Sidebar is the only thing that might be a drawback I feel, but how you gauge that is up to you.

  83. Ross
    Permalink to comment#

    It’s ok, Chris, but I kinda liked the whitespace in the old sidebar. It gave it a sense of openness. The new one is a little heavy.

    Thanks for the great tips.

  84. Matt Christy
    Permalink to comment#

    Awesome job as usual Chris. It is what I come to expect when I am on your site. Nice work.

  85. Paul
    Permalink to comment#

    I like the old site better.

    This design is to busy, orange and brown are two of my least favorite colors, combined with the pink poll buttons is enough to make me want to blow chunks.

    The fonts overall, and especially in particular areas, like navigation tabs are way to tiny.

    Your designs have always been really sharp, you were bound to drop the ball sooner or later.

  86. Thanks so much for adding the Snippets section. I already found a WordPress snippet that I was looking for today and was not able to find through a quick Google search.

  87. Geoing
    Permalink to comment#

    I liked the search field from the old design how it showed through to the background.

  88. Joshua Gruzard
    Permalink to comment#

    Love the new site design. Great Job!

  89. Some 30 seconds of initial observation commentary (take it for what it is):

    Design is pretty busy, IMO.

    The tagline “curated by Chris Coyier”, your name shouldn’t be in italics, it distracts from “curated by” being italicized.

    The Search All Articles Forums Snippets…..Since this is a mutually exclusive choice, seems a better semantic choice would be radio buttons not anchors.

    Don’t really care for the pixel fonts, too small and seems dated to me.

    The “poll”, the text shouldn’t wrap underneath the radio buttons, text should have a hanging indent, if you know what I mean.

  90. Ross
    Permalink to comment#

    Hey, Chris

    What are you using to pass the active tab?

    I don’t see anything in the url string, or is it something internal to WordPress?

    • TeMc
      Permalink to comment#

      It’s using PHP to ID the with the current virtual directory from the URL.

      And then by CSS targetting that particular menu-item.

      Check also here: http://css-tricks.com/id-your-body-for-greater-css-control-and-specificity/

      Specificly the third heading down (“But then how do we apply the “active” class to the current navigation list element?”)

    • TeMc
      Permalink to comment#

      I should note though that since a few versions now in WordPress, when using the wp-function “wp_list_pages” to create the menu dynamicly (rather then hard-coding the menu in header.php), then wordpress will apply a class like “current-page” to the menu-item.

      So, if you’re dynamcly listing your menu then simply use wordpress’s auto applied class.
      And if hard-coded or not WordPress at all then the Body-ID trick would work pretty good.

  91. ilter
    Permalink to comment#

    Sidebar is heavy.
    But I don’t know if it could improve your click rate.

  92. Permalink to comment#

    Wow that new design looks nice.

  93. Permalink to comment#

    i like new design header

  94. Hakeem
    Permalink to comment#

    what a great job dud.

  95. Seb
    Permalink to comment#

    Ughh.. no comment

  96. Really you did a good job, thanks for sharing.

  97. Richard
    Permalink to comment#

    The old design is definitely better, your site still looks great though I just think these hand drawn effects are getting too popular to be cool anymore.

    You do an awesome job though mate, keep up the good work, I love your style of video tuts really informal but very informative.

  98. Permalink to comment#

    I personally like the old design better, but I understand why you had to change it. The Snippets section is a great idea, by the way!

    In my opinion, the sidebar is a little too big. =/
    I REALLY loved the old sidebar’s design. I wish you would have kept it the same.

    But anyway, keep up the good work, Chris!

  99. Permalink to comment#

    Very nice. Congrats!

  100. hansen
    Permalink to comment#

    yeah i agree… i’m totally digging the header! pretty schweeet sir!

  101. Permalink to comment#

    I see you tried to fix the IE6 png issue.
    It doesn’t work entirely. In the menu only the articles button is displayed correctly. The other buttons still have transparency issues. Everything else is ok.

    BUTT!! The menu is unclickable now.
    I hope you can fix it, because I can’t browse the site :(

  102. Permalink to comment#

    Nice re-design. I wasn’t really feeling the last version (loved the version before that).

    The only thing I’m not too fond of is the advertising.. it’s coming on a little strong. Now you have two top banners, the little ones, and the HUGE one in the poll area. A little bit much IMO..

  103. ibura
    Permalink to comment#

    excellent work man.

  104. Yeah! This is a really nice change!

  105. I always like the use of hand drawn stuff. Adds a bit of personality to your site.

  106. Permalink to comment#

    I don’t know Chris, I kind of like the stars next to your unordered lists…

  107. Dim
    Permalink to comment#

    Hi Cris
    I found one irregularity with the markup i suppose. It’s your favorite one pixel shift up at the search . When you click on searching forums it kind of shifts. Tested with opera safari and firefox.
    Cheers, Dim

  108. Permalink to comment#

    Nice, excellent work.

  109. Jonathan Marzullo
    Permalink to comment#

    Love the new design… great look and feel! And thank you for all your great advice and resources!!!

  110. Looks great Chris! I still like your v3 footer the most… but your shirt DOES have a loader on it (pretty cool!).

    I like how you’ve been playing around moving and redoing the little graphics (things like are my sites up?). I think you have a really solid overall layout – with a great usability factor.

    Thanks for all the great resources. Rock on!

  111. Drum
    Permalink to comment#

    You can put a new image of your self. People are changing too.
    - How are you?
    - Fine, redesigned by the time, you? :)
    - Me too, me too….

  112. Permalink to comment#

    Well done Chris. I love the new snippets area especially, it’s the reason I’ve been coming back almost every day. You’ve got such an incredible resource here that I don’t even trust other sources now. Way to make me dependent on you!!

  113. Very good Job done on this design, just a few things i didn’t like that much.

    But the Thing you had done on the comments is impressive.

    Good Job.

  114. Permalink to comment#

    looks really good! I like it.

  115. Jonas
    Permalink to comment#

    Good Job. Way easier to read and surf the page althoug it was easy befor.

  116. Permalink to comment#

    Two things:

    I really like how you have the option to save code as a Textmate snippet or add to Coda. Is that a plugin you found or something custom?

    I also really really like the way the comment author info fields act. I like how the text goes grey when you click in them, and then disappears when you start typing. Is this jquery at work? I’ve always wanted to have some default text in an input field that was grey, but then turned black the user actually started typing something, but this takes it to a whole new level.

  117. Permalink to comment#

    I just noticed that if you resize the browser window horizontally that the brownish “sandy” background image moves. This obviously isn’t a huge deal, but you can avoid that by setting that background image to align to the center instead of the left.

  118. Permalink to comment#

    love the new design. I want to ask one simple thing how did you change the color of the highlighted region from Blue(default) to Orange. The color that comes when we drag and select.

This comment thread is closed. If you have important information to share, you can always contact me.

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