After three and half years, I finally redesigned Web Designer Wall. I launched Web Designer Wall in August 2007 and haven’t made any changes since then. Today, I think it is about time to put the previous design in retirement. It is sad to let it go, but I think a redesign is a must because technology is different now (ie. HTML5, CSS3, media queries). So I’m going to highlight some of the features about this new design. I hope you will like this new design as you did in the previous version.
Before I started on the wireframe/design, I took a look at the visitor stats on my site. Below are top 10 display sizes:
… and of course iPhone 320 x 480 (#15)
It ranges from 320px to 2560px (width-wise). To target all different displays, the typical fixed width layout won’t work. I use media queries to make a liquid and responsive column layout. The layout flows automatically based on your viewport width. I made it work from 320px to 1280px and higher. Viewers now never need to scroll horizontally. To see this in action, resize your browser window on this site and watch as the layout toggles through various layouts.
If the viewport is wider than 1000px, it will show a 3-column layout: fixed left navigation column, fixed width sidebar and liquid content column.
If the viewport is narrow than 1000px, the fixed left navigation will flow to the top and turns into a 2-column layout. The content column remains liquid.
Once the viewport gets smaller than 760px, it switches from 2 columns to a single column layout. Note the sidebar drops below the content column.
The layout doesn’t breaks even viewing on mobile devices such as iPhone and Blackberry.
This theme is coded with HTML5 and CSS3. I also upgraded the site to the latest version of WordPress. Finally now you can reply to threaded comments.
I added a new Featured section which is indiciated by a star graphic (beside the post title). You can also find all the Featured Posts under the Archives page.
When the page scrolls down more than 100px, the back to top will slowly fade in.
Have fun with the collapsible comments. You can toggle the visibility of each comment. The circle avatars are done with this jQuery trick.
Some CSS transition effects are implemented on the navigation buttons (fading background color) and the search form field (animate width). It is currently only supported on Webkit browsers such as Safari and Chrome.
Don’t forget to share my posts if you find them useful. You can find the share bar below the post content.
What do you think of the new design? Share your comments in this post. If you find any bugs, please take a minute and report them. Thank you!
Looks good!! Like the css3 media rules and the “Back to Top” link as well as the neat design
Testig treaded comment
Testing the double thread…
It’s beginning to look like a triple thread
Please stop testing threaded comments.
Looks great! Just check twitter link, shows “0 followers” and goes to wrong url. RSS link shows 0 subscribers also.
I Like the new design. It has some neat features. Love the back to top button and the fixed menu on the left.
Loving the new design, especially how nicely it tansforms on narrower browser widths.
Nice touch on the comment images as well.
it’s very cool and stuff, but always a pain in one’s ass to design for different resolutions, especially if the design is only based on floats :((
Looks gr8 in chrome/FF. In IE8 I got this two:
Webpage error details
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0)
Timestamp: Tue, 8 Mar 2011 08:26:07 UTC
Message: ‘body’ is null or not an object
Message: Syntax error
Compliments. I follow your site from years and i like much new look.
Greetings from Italy!
Good, but one mistake: “Tiwtter @nickla” in right sidebar, may be twitter? :)
As always, true skill is in the details, and this site is a clear example.
Nice re-design, it’s better than the old, and I like how you write about your thinking behind the design.
I’m not sure about the fixed menu though, I personally want to leave all that navigation in the top when I scroll down to read more because it distracts me from actual text paragraphs. And those links are not that important to show them all the time fixed on the left.
But just my opinion though. :) Otherwise it’s a great design.
i like it, however i would prefer to be able to see the categories. you have to search for everything….
congrats on the design looks better!
Awesome redesign. Was just talking to a friend about the advantages of responsive (liquid) layouts. Now I have one more reason to convert him from fixed layouts. ;-)
Good work, but I liked more the older decorations.
Why in search don’t you use the html5 placeholder attribute instead of js solution?
Wow, really good work!
Terse and to-the-point explanation of the highlight points for this design. Which, by the way, is very simple and also very effective. Compliments.
Focusing the “Search…” text field does not clear it.
BTW great design!!!
Same problem here.
Yup, here too. Chrome 11.0.686.3 Dev. Mac.
Splendid job Nick, the new design looks wonderful. However, I recommend you use the HTML5 placeholder attribute with the search input field, and make it browser compatible with this handy plugin https://github.com/mathiasbynens/Placeholder-jQuery-Plugin. This way you make your design just a bit more user friendly ;)
Thanks for the suggestion. Sounds like exactly what I need.
Very nice website.. I will have a go with CSS3 Media Queries now that I have seen your site.. works in Dolphin browser – Android..
wow, you did an awesome job…the liquid layout is really amazing !
Very nice work Nick, the media queries stuff is very clever, will have to try that on my next site.
I notice you’ve got a bit of the avatar image showing through at the edges of the round corners – I’ve found that a subtle drop shadow with no offset can help to minimise this effect.
How do you get the images to scale down with the resize?
I use this jQuery trick to wrap the avatar as background image and background-size to resize the image:
Great job here ;
just one point : I find the font used in the titles too pixelated, it doesn’t fit the smooth design
I’m thinking to switch to Georgia because XP doesn’t render fonts smoothly.
It’s looking really nice! I’m becoming a big fan of the way the navigation staying in the same place as everything else scrolls. Feels like that is the way we should have always scrolled websites.
Good headline as well! When I first clicked the link in my RSS reader for a few seconds my imagination went around crazy. Great work Nick!
Man, awesome redesign. I love it. You inspire me to create something new too!
Redesigned, and still awesome as ever :D I envy you for having awesome talent in design like this. Good job!
The site is looking crisp and neat…. liked the work u have done on the search box too ;)
Stunning job (as always)!
Schweet! Loving the media querie shizzle.
Marek | Webcentric
Really great HTML5 and WP work. Well done. Hope to see some articles on complete website re-designs, effects on SEO, Link backs, and overall successes or pit-falls of complete re-designs. BTW, back to the top rocks!
I second that… an article covering aspects of a website / blog re-designing would be really helpful.
I will write the design process of the redesign soon.
The re-design is perfect. Congrat’s. The media queries is something that all new sites should be employing. Very nicely done.
Firefox 4.013beta (Win XP)
Focusing the “Search” text field does not clear it.
p.s. design likely
Lovely work. Some really subtle animation effects. I particularly like the way the search box gets activated. Really, top notch stuff.
Excellent redesign. Specially I like the static column on left. Marvelous job.
I love the 3 different layouts depending on screen size, but the static column on the biggest layout (which most people will see) is definitely the best.
perfect as always
Wonderful work and very inspiring. Congratulations!
I need to look into this liquid design thing. Very very cool.
they are cool and nice like before. well done!
im yet to move on for html5 and css3 codes.
maybe, i should start very soon.
There’s, in my opinion, a problem in the menu: on Windows XP + Google Chrome 9, “#main-nav a” has got a 13px font-size which is not displaying nicely (it’s too sharp), maybe for the font-family you’ve chosen, Copse… The problem is also present on the H2 tag.
I really like the styling of the artcle’s titles and the main title! CSS3 rocks!
Great work on the redesign! Love how the main nav auto scrolls on the left column at larger browser sizes.
Agreed on the crispy/overly sharp looking text though, it doesn’t render well in Chrome, Safari, Firefox or IE on Win.
I Always…Fans Nick La :)
Very nice! Thank you for the insight of the making of the site.
Looking awesome! Nice work
Nice redesign and like the use of media queries – only thing I really don’t like is the floating navigation in the 3 column layout – I find it really distracting when scrolling the page and the nav stays there pulling my vision to the left . Think I’m going to have to shrink the browser window when visiting the site or even use readabilty…
Very well done ;) Looks great on 1680×1050 in Opera 11 ;)
I like the redesign. You stayed true to the style before so if anyone hasn’t been to the site in a while they wont think they are in the wrong place. I really like the fluid design that shrinks from 3 to 2 to 1 column. I appreciate your attention to detail.
The only thing that doesn’t thrill me is the pixel blob in the bottom left of the site (behind the back to the top). It looks like a mess of pixels compared to the rest of the illustrations which are these very ornate and color detailed drawings.
I added those “pixel blob” to create depth on top of the tiny jellyfish elements the side.
Another great and beautiful design by Nick La… Good job!
Love the new layout!
What a beautiful piece of work!
This is amazing. I’m just starting web design and development at uni and I get missed feelings when I see a site like this. Part of me is just held in rapture, while a tiny part of me gets almost depressed as I wonder how I could ever create something as beautiful as this from scratch.
I love it! Great job :)
Hmm, I’m not sure if I like it better now. But, well … that’s probably just because I liked your old design very, very much! ;)
In Firefox, there’s a little gap below the footer. Also, you wrote “I made it work from 320px to …”, but when I resize to 320px in Firefox, parts of the text are missing, and I would have to scroll horizontally, but I can’t (probably because of “overflow: hidden”?).
However, I can’t test it with a SmartPhone, because I don’t have one. ;)
Loving the liquid layout! It’s sweet how you got the left column to come to the top and the twitter box to come to the bottom when the page starts to get smaller.
How did you get the images to scale? That seems to always give me grief.
I have featured your blog few days ago and today web designer wall come out with new design..awesome work!
Great work, Nick. I’m loving the new look— not a complete departure, but obviously a lot of well-planned updates.
Very nice. I really like the “Demo” on the article summaries very nice user experience, thoughtful. The static menu is great to, I like the tag cloud on hover, another nice effect. i dont like to ahve to look at those confusing things. however, it is nice that I ahve the option to check it out. nailed it on the categories in the blog menu too.
At first I thought what a tiny search box, then I clicked on it. NICE dude.
I would like to see the comment box on the top of the comment list. hmmm, I wonder if a study has been done on this?
Over all, great job,
Another great work! really good design, well structure and clean.
My first look at the new re-design just happened to be on my iPhone.. And it’s just lovely. :) Finally, a “mobile version” of a site that stays true to the original. Very nice. Keep up the great work! :D
Very impressed with the new design. Love the user of media queries to determine screen sizes. Elegant and simple.
Really cool redisign. I like the idea with search input field. Great work.
i love the new look! ♥
Awesome redesign! For real!
Anyway, typo error on “retirment”.
Wow i love the design always been an amazingly well designed site! I don’t know if it’s new but my favorite part is the text shadow’s on the post titles definitely.
Wow! I just wondered why you didn’t update your site for so long just last week. Now, you came out excellent.
Pretty baller. Nice work.
You did an amazing job with this iteration of your site. I am so impressed. Responsive design FTW! Nice subtle touches here and there (i.e. search bar animation).
Lovely amazing redesign Nick! Great work.
Congratz Bro i like it keep going dear i love your blog
This is very nice! Love the design and your attention to details.
Very nice implementation! You have given me some great ideas for our mobile site with the switching of styles based on resolution.
Definitely loving the new design and layout, as well as keeping some tiny aspects of the original design. Also loving the good use of the textures!
Nice redesign and features.
I like the media queries implementation. However, your logo is different in the large display version than in the others (lowercase vs capital letters) and that causes a (tiny) inconsistency. How much did you take that into account and why did you choose to make that difference? (because I guess it’s something on purpose)
I did it on purpose. I find it reads better to have lower case on the fixed position navigation.
just in case you didn’t notice – the linking of your twitter feed icon in the nav section misses the .com in the url. maybe somebody already commented on it. didn’t page through the comments. big up and cheers from frankfurt.
Love it! Amazing work!
Great job! I love the new design. Totally agree that the old Web 2.0 design needed to be ditched.
Good job, really nice redesign!
Looking good. Media Queries are amazing! It looks like you have zero twitter followers though (refreshed 3-4 times).
Looks great on my Desire Z, both normal and sideways. Just 1 thing that I noticed: back to top isn’t working on my DZ.
Just in case you wasn’t informed by now.
Design looks fantastic. But really, collapsable comments make totally no sence at all.
It’s really nice however when you resize and the nav bar goes to the top of the page, ‘web designer wall’ turns to inital caps instead of all lowercase…
Really nice design though.
Oooh, I LOVE your titles!
Pretty redesign, congrats (but ugly fonts in the #main-nav — WinXP Fx3.6)…
Like always…. awesome job!
Ventura Web Designer
Have not been here in a while. I like the new design it looks great on my 1920X1280 monitor.
Nicely done! Only issue I noticed was the search box–when I click into it, it changes size and doesn’t clear the word “Search…”
Awesome job. Looks great. I really luv the collapse/expand all in the comment area. Overall neat job- As usual.
it looks really good – I like the sticky navigation, I have to admit that I am used to see the “reacent posts” near the top (near all blogs) – but now the desition is a lot better, much more white space and clean design
I always like when I see the use of icons (in your navigation: blog, about contact, archieves)
Mathieu - Deco Tendency
Thx ! Helps me !
I’m sorry, but I liked your previous design more. The new one looks to boring… Please bring back your old design!
My honor that you still like the old design that I did 3.5 yrs ago. I might release it as a free WordPress theme.
It would be great if you do release the old theme. I thought it was well designed. I’m actually interested in it more as a template to learn from than in using it as a theme.
But, not to distract from the new theme, which is also great. It’s Clean, and uncluttered. I love it.
Amazing design, looks nice and clean, and that’s what important. Good job,
Graphics aside (which I love, but are very subjective), the layout is brilliant! It’s such an elegant solution to a pervasive problem. Great job!! I foresee a new trend…
Great technical solution, to bad WP still haven’t updated the form error page, maybe you should have a look at that? https://webdesignerwall.mystagingwebsite.com/wp-comments-post.php
Like the new design, and your variations for different sizes does well at balancing the weight of the page at different display sizes.
I prefer this simplified site to the old site. Easier to concentrate on the content.
Gonzo the Great
love what you’ve done, it just looks beautiful! Like the media queries, works fine when resizing by browser-window. Only have a problem with ‘Copse’ from the Google font Library, .. in smaller font-sizes its readability sucks majorly!
Maybe a better font-choice, or @font-face instead of Google Fonts? Otherwise the redesign looks slick and clean, love it! Great work ..
Very nice template !
I gasped so much
(from shock, not disgust or euphoria)
I like it a lot, but you have much more to live up to.
The media queries are ace, but in the 3column version the left content gutter is smaller than the right (is there any reason for this?) and the background image under the nav will annoy the hell out of me (would be fine if the nav wasn’t fixed, but really contrasts with unattached background).
Apart from that it’s so beautiful and incredibly feature-rich.
Congratulations on still making it look simple with all that under the bonnet :)
Very nice Nick! Simple, clean and effective. That’s what I like! The previous design was good too but I like this one a little more.
Nice use of media queries and responsive design Nick. Recently wrote an article on the same topic, did your new design take a while to implement and test at all the different resolutions?
Like the new simpler design also.
Overall process didn’t take long, but I spent quite a bit of extra time to make it work on IE7 and 8.
Nice design, especially CSS3 Media Queries… :D
Great redesign, easy on the eyes and very nice looking, a definitive upgrade [not that the old site was bad =) ] .
Just one thing, the categories of [Tutorial] [Trend] [General] i dont think that should be buried under blog and appear only on hover (because theres no hint that blog would pop a small window with more sub links)
Maybe should appear just below it with a little margin right or a sub and to denote been child of Blog.
You’ve made some good points, but I would like to keep fixed left navigation minimal.
I love it! Simpler but still familiar and awesome use of media queries. I also like the dominant use of mainly serif fonts.
The only thing I am not crazy about are the main categories on the 2nd level of the navigation because I usually browse them first.
Nice use of the media queries. I have to say that I still like the older one better somewhat and many might agree, Simple is nice but I think the web designer wall site name can stand out a bit more. My personal opinion but still great job!
nice work mate! looks good!
Great improvement. Although I, personally, prefer the old background. Perhaps you should contemplate making a few background layout thumbnails that change onclick for users who perfer different backgrounds?
I have been wondering when you were going to post again. Now I see why it took so long.
Nice one Nick! I have some humble suggestions for extra enhancement.
1. Change all text-transform to lowercase, except heading.
2. Collapsable button on :hover. (it pars with minimal concept)
It is pretty much enlightening post :) Impressive and great!!
Alexandre Souza (Brazil)
Cool, it is good to change… but I will miss some stuff from de old one.
Thanks u for all the good information and excellent posts.
It is said to see an old design go, however sometimes you gotta get out with the old and in with the new! I will check back on the site to see all the updates!
Web Design Giant
When you get a chance to check out my site please do. I will be incorporating a new video into my site and cant wait for the response!
Hi Nick, I like a lot the new design. Congratulations!
awesome!!! love the mobile version..I get so excited when sites have a mobile version..it’s a must these days!!! you did a fantastic job! high five!
it’s very nice Nick. I like a lot the design.
it’s more clear, congrats!
Cool! I’ve been lurking around your site and your new design is super cool! I love the auto column change (whatever its called) feature!
Just viewed this on an iPhone 4, brilliant. I have looked at mobile themes and they try to be apps. Web design for small screens is alot cleaner than mobile plugins etc.
Great new fresh look congrats! I am looking into mediaquery for my next redesign!
Nice web, nice tech. Congrats!
Very nice. I love the new design more than the old one. I think it’s cleaner and seems more tidier.
Finally its done.
I like the new design. I am myself a UX guy.
How i can use better css file while use html along with design perfect show off.
Lovely work on the new look ;)
I loved the old design and am somewhat sad to see it go… but saying that – the new design is lovely and wonderful to read the details on specifics ;) great work ;)
Thanks as always for all :)
Very nice. I liked the old site, but this is a nice update. Good use of CSS3 techniques.
Very nice. A bit less flashy than the last one, but it seems very “current” and is a joy to use. Well done!
Great update. Especially like the treatment on the headings and the stripped-down command post on the left. It shows great restraint and gives me just what i want and nothing else, well done.
Ah..Ive been a big fan of this website….
Beautifully designed and good coding..
Do you have a screenshot of the older web designer all theme?
Would be nice to see/have a comparison. ;-)
The redesign is awesome!
The featured archives section looks awesome! Great job!
….dayum! great work!
Great job! Might have to use some of these techniques on my own site. Bravo!
Ah, Nick, this is really nice! It’s updated, but it’s also still very much WDW. Great job!
I don’t know if any of the other 143+ comments mention this, but I hope that you are going to sort out your tabindex and focus styles. As a keyboard-only user, I found it annoying that my first tab took me to the comments form and subsequent tabs gave no indication of the element that was in focus. I expected to be able to tab through the sections of the article, having first tabbed through the main navigation. There is no ToC, either, which would be useful. My first experience of this site has put me off returning.
I appreciate your inputs. I’ve got to admit that I didn’t put enough thought on the keyboard navigation while designing this site.
WOW! This is awesome. cool design concept, Nick.
Hi, Nice, The Redesigned is great, I am a WUI designer form china, I am very gland to see the graphics of chinese elements .
This is one of the best designed sites that I’ve been following for few years now.
The re-design is quite good.
LED Lighting Lighting
Hi ,just found out about this site awesome really like the redesigned version hoping to see more :)
Web designer Lt
These are very refreshing new avatar of web designer wall.It is providing more space to eye with new style.
I like this new design and layout here,it is making me to browse all categories again
Loving the new deisign, just wondered whats reason the capitalization of the title is it for aesthetics or for the UX, or both?
Simply for aesthetics.
This is nice!
I love the use of HTML5, CSS3 and WordPress
I am fan of alle 3 of them.
I too like the use of 3 different display, so I had a look on your stylesheet.
Congratulation with a beatiful and functional design
Joel A Glovier
Great work on the new design – way to set the bar.
The combination of it all is a true piece of art, html5, css3, design, wordpress, very inspirational, thanx!
I found this website being one of the most usefull and informative out there to be up in date with tips, tutorials, design and info bout web design,
!!!Keep up the awesome work!!!
I love the new design, so much details!!! :D, and I so much love your backgrounds, so complex so beautifull.
I just have one comment, the title headers which have a double text-shadow doesn’t render as you would expect on any browser running on windows and its hurtfull to the eye watching them on detail, based on the pics you showed i guess its a SO problem (blame windows :P ).
Absolutely love the new redesign. HTML5 well excuted! Kudos Nick! Kudos!
Sorry, the other design was much better >.<
But I like that u use css3 and html5.
Wonderful new look, gratz
I love the new design as much as the old one. The old one was really beautiful and involved. This one is much lighter, and will load more quickly, especially on mobile devices. But you’ve kept enough of your beautiful and unique style to make it stand out from the crowd.
Overall I like the new design, especially the textured background with the random do dads that roll by when I scroll and the fixed left navigation.
i prefer the 2 column version.
The new desgin is really great. Everything is so easy to read and clean. Great work!
I think both sites are really great for its technology use. The fact that this is more robust in its own right and more modern for its environment makes it very easy to use and highly collapsible and open for more user preferences.
Great job on the HTML5/CSS3 usage! Love it!
Great job ;) I love new design (and new technologies)!
Love Love Love. Really like the resizing element too.
thank you very much for this description of your redesign. I have to study the techniques of adaptation to various screen resolutions myself as early as possible. My own humble Site doesn´t offer this at all at the moment (shame on me!).
Quite the same technique you use is also used by simplebits.com (Dan Cederholm) i guess.
Last thing: When you write “viewpoint” I think you mean “viewport” – don´t mean to bother you, and surely everyone will have understood what you meant.
You are right. It should be viewport, not viewpoint. Just fixed it.
Nick, This is brilliant. really like the texture and clean new layout!
Incredible… as usual :)
Very nice new year, new design… congrats.
Beautiful (although a bit sad to see the original design retired). I am interested in exploring your browser width solution.
One question about handling of comments: are you comfortable with WordPress comments not “filling last page”, so that the page with most recent comments might have only 1 or 2 comments, while subsequent (earlier comments) pages are filled? I know that your original design specifically “filled last page” of comments.
Again, the new design is very clean, yet is still connected to the original.
You are the man!
I love the new site! Looks really great! I found a bug though: Your mobile version does not work on Android phones. Some parts of the viewport tag is missing. For Android it should be:
Oh wait! I just get the 3 Column Layout when zoomed out. When I zoom in the layout changes accordingly. Sorry for the false alarm ;)
Khalid Majid Ali
Cool design! Loved the old design and this one is even neater. Big Fan! :)
Really great! Love this redesign! : )
Wow! The original design was great, now i call this design excellent! Even though previous design was more catchy and nice for eyes, this one provides more accessibility to all kind of users. It is good to know that you consider all those screen width including mobile. Such is a very future proof action you’ve taken. I have tried browsed this wall using my Dolphine browser on my android galaxy s, it worked flawlessly. Just so you know, IE9 is supporting search form field (animated width) and may support as well as many other things that previous IE8 did not support.
i like this design, but i don’t love it. previous design was stunning! it may not have some super, uber, fancy stuff it has now, but it was abstract and somekinda leaving being. now it’s more classic and casual, like many other sites. And I really don’t like that color transition (red-orange-yellow) on sidebar, it gets ugly when you hover more tags in small amount of time. Cheers!
great design congratulations
Well done, great work that looks and works much better than the old one. Site doesen’t feel so large and heavy anymore.
Redesign looks great!
woow.. so envy.. it’s really nice :)
Dude I admire your work so much so that I always come back to get a few tips and ideas about my own work.
The previous design was just as good as the new one but oh boy oh boy…. you must have sacrificed a lot to get to this point.
Anyways I will be happy if you accept to be my mentor…. SIR!
Great redesign as always Nick! You’ve been featured here http://html5awesome.com/web-designer-wall/
Man this is just awesome!!! Always love your designs.
=) Great Work
Great work! I’m really in love with your new design and how it is working, especially thanks for thinking about different platforms! :)
That is great work. I loved the previous design, but the new is as great. I love the http://www.ndesign-studio.com/ design and can see you are in the flow of using a similar approach but each time creating something new… great work !
Really really nice work….. :)
Beautiful Theme! It’s awesome that you have 3, 2 and 1 column displays according to display width (as well as mobile).
Just absolutely Stunning.
If possible, could you make a tutorial page on how you put this all together?
Awesome job, no doubt.
You should add an iPhone custom favicon.
Here the code:
Love the new design
Great job. Love the new style and functions.
Peter / Stockfresh
Really slick! A beautiful example of great design.
Haven’t visited the site for about a week and was surprised to see the new design. Great job. :)
I LOVE IT! Just when I thought your site couldn’t get any better. The new is you!
Some sites just makes you feel like you wanna see everything on it, every single details and wonder, how the f*** he did this? how many nights he didn’t sleep just to keep the flow going, what you make with simple details is just amazing, I can´t remember any other website that shows so much passion for web-design like this one. I mean it, this just feels like an art object that I want to put in my wall, maybe I will do it ;)
Stop being such an inspiration! It’s hard to keep up!
(although I think the comment form fields could use a little padding)
Really like the new layout, keep up the good work and inspiration.
Very impressive, seems like this design with the smaller background, while still very stylish would be more inline with the new Google page speed factors in their search placement algorithm. Large backgrounds, however beautiful, are difficult because of their great impact on site load time.
HTML5/CSS3 features are also quite impressive… hope you don’t mind if I see how you implemented them :)
I’m lovin’ it ;d
one word, awesome
Loving the new layout, the various format sizes is going to be great because I am not always on my office MAC so sometimes viewing on my IPhone is necessary. Great job!
Design looks beautiful and refreshing, althiugh you sort of stick to your style. Thanks for interesting posts!
Actually, my HTmL&Web-Design teacher asdvised to take a look at your page ;) well worth visiting and learning new things.
Keep it up ;)
fantastic design but doesn’t work properly on Opera 11.01, particularly search box and back to top button
great design! thanks for the write up!
I dig it, per usual. My only qualm is the texture on the background… a little more visual vibration than I prefer. But otherwise, very nice.
Congratulations about this new re-design, very good work.
awesome design….any plans on releasing the old design as a theme now?
Really nice design, and functionally it works without the user having too!
I really like how you guide the end user to see into details.. where designer spent lots of time in there.. and end user hardly notice in that detail.
I had first checked the video where you shown it to crazy crowd ; )
dammit nick, you’re allways so innovative!
Wow – amazing new design! Site’s looking great.
Great design! I like how you have taken all the resolutions into consideration including mobile
It doesn’t get better than this!
Pleasing to the eye, congrats. However, I have a few comments. Who wants to have fun with the comments – does anyone really spend time on collapsing comments? Have you considered placing ‘Scroll to top’ on the right side of the content? I think it would feel more natural. Just some thoughts. Anyway I love the redesign and the header is really delicious.
Impressive works, Nick! How do you manage to stay always creative and innovative? Great design! I like how you have taken all the resolutions into consideration including mobile and palmtops.
Once again nice work…!
you’re always so innovative!
I think the new design is great! Really like the auto layout changes on window resize, very clever :)
Great! Congrats WDW team! :D
Wow this is amazing. A bit of a tutorial on that “Scroll to Top” feature would be awesome. Such a brilliant idea!
Truly amazing bro…keep it up..
great design… more efficient… ^^
I noticed a thing missing on the old layout, and you didn’t add it now, either…a “read more” link. I remember that the first time I was here in 2007, I had no idea if the posts were really as super-short as they initially appeared before I looked at one. Everything else is brilliant.
Especially because design is built to suit your visitors’ needs. To always keep in mind.
I follow you sice 2008
and everyday you surprise me
with all your amazing content.
Awesome new design!
It is great to see that you decided to support all kind of devices with this design. HTML5 and CSS3 are fantastic and you make very good use of them.
What a delight to see something different than the standard white background too!
Nice and clean!
I haven’t visited the website for a couple of months.
I am surprised about the new redesign. Good job!
Great redesign – nice attention to detail.
I have to say though that I would prefer a lighter background for readability’s sake.
online project auction for clients and web designers
also purchase services online.
Very nice! Great redesign.
Your media queries are pretty brilliant. Most sites that even take display size into consideration do not degrade so gracefully. Most feel like an afterthought, but yours is very well thought out.
Beautiful, love the responsive design.
One note, on mobile when switching to landscape view the page spills beyond the screen.
You can fix this by updating your viewport meta, from:
And for BB I would also suggest forcing column view with:
Love what you’ve done., Cheers
Amazing redesign. Totally in love with media queries. Searching your site for more on media queries now. :-P
Hi, great job in creating the most accessible, flexible and usable website I’ve seen in months!
look versy pro!
web designer uk
It’s amazing post. It’s flexible and usable website.
Agree, great work, loved the look of the previous design and like this even more.
Nick you just keep getting super awesome every re-design, I was blown away with your previous n-design theme the one with the bird and flowers on a dark background, then you went vintage with Koi a fish, now this!? I mean the technology that went in this redesign is a work of art, I can’t keep myself from drooling here. Great Job!
Pretty and eye-touching. Nice color combination and layout manipulation.
Much space and a CSS3 details make it nice, clean and useful. I love it!
Felicitări! (romanian for Congratulations!)
Love it! Really soft, organic graphics, gentle on the eye, but still leaves a powerful impression. You’ve inspired me to work a lot harder on my own projects. Thanks for sharing and keep up the good work.
It’s a great redesign! But the one thing I immediately miss is the quick access to post categorized under ‘design trends’, ‘tutorials’, and (I can’t remember the other one.)
I especially liked being able to access the design trends immediately, now I feel like I have to dig and click on the category tag on a post.
Other than that, again, great looking site and as always thank you for this great resource.
Jared - Stealth Web Designs
I really like it. I’m curious how will degrade in older versions of IE.
The design is great! I love the details.
But the font of the headers is a bit pixelated (on pc).
Curious Eyes @ Postcards Printing
I like the new design, it’s whimsical and fanciful in a 3-column layout, and i like what you did with the comments thread ^_^
If in fact you decided not to implement display width targeting in IE8, I was wondering what your thought process was on this decision. It seems to me that, even though IE is simply a pain, a lot of folks use it. And even if IE9 winds up allowing media queries, there will still be large numbers of people using IE8/7 for a long time to come. (I won’t even mention IE6, which surely must be reaching the end of the road.) Thanks.
I can confirm it works just well on IE8 just like similar themes designed by Nick for Themify!
Couldn’t test it on IE7. I don’t remember using it for ages. :)
Nick- I realize I was resizing in IE faster than the page could react. Yes, works just fine in IE 8/7 for me, too, looks great.
Pedro Gabriel Manrique
Wow!! I love your site and yours designs, how you do it? Could you publish a tutorial with the steps for get an amazing website?
Thank you master
This is one of my favorites. New layout is really nice. Thanks
I think this is really great~very useful.
Site looks very very great! Nice to see a great example of using media queries.
In FireFox4 are transitions supported, so you can use -moz-transition for the background transitions.
And I found a bug on the page:
If you go to the 2 column lay-out and you will click on the search, twitter or rss button you cann’t do that. Tested in Chrome Dev. and FireFox4
I could totally relate to this post, thanks for your help.
Hi Nick –
Nicely done especially on the functional side – really like the dynamic, fluid design of 3, 2, 1-column layout. Preserving the visual consistency for the mobile browsing was also eye-opening.
If I could play the devil’s advocate for a bit, I think the original design actually had stronger visual impact and impression than this new version. If I were to try to pick out the elements, I think it is due to smaller presence of the ‘Web Designer Wall’ blog logo and also relatively smaller real estate dedicated to the beautifully crafted visuals on the top area. I’m sure there are still a lot of first-time visitors and I’d argue that we still need to serve them well and leave the strongest first impression. (I’m assuming that you tried to get the logo and visuals out of the way a bit so that the content and the Ads on the right get more emphasis.)
With that all said, your blog is one of very few blogs that I follow. Thanks for all the inspiration! Keep them coming!
Another great design by Nick but I agree with Lloyd. I think the old version had a greater visual impact.
Really, really nice website redesign! I browse it with my iPhone and it’s perfect!
Hey Nick–wanted to commend you on a beautiful redesign and also a great bit of documentation for all of us following your lead and creating mobile-friendly sites that scale down with media queries. I viewed your CSS and followed your logic for my own project which was invaluable :)
Question now is, not sure I understand how to set everything up so that a website is specifically Blackberry-friendly. You mention above that “…the layout doesn’t break even viewing on mobile devices such as iPhone and Blackberry…” but using the techniques you have noted here, I still have a viewer saying my site breaks on their Blackberry. Am I missing something? Said site looks great on Droid and iPhone. Are there Blackberry-specific considerations you can can clarify? I feel a little lost.
Thanks! Please feel free to mail me directly if you are so inclined.
Hey your website inspired many of us at college to look at the websites in a different manner alltogether. And 3 years down the line we feel it was the best thing that happened to us. The new one too is as wonderful and inspiring as previous one.
this is awesome redesign. There are too many sites ignoring mobile devices. Your site exclusion.
Thank you for making web more user friendly
I came here yesterday after not visiting in a while. The way your design changes based on browser width is amazing. I thought it was so cool I had to visit on my iPod to see what it would look like. Excellent job, I hope other websites follow in your CSS.
Very very nice!
love your header art and footer too :)
simply and cool
well done mate but you should include some animations or any other interactive home page features so that the website doesn’t just look at its visitors but also interact with them so they don’t get bored.
New design looks really good.
I would suggest you to get WP 3.1.1 update.
Also, have backup for old browsers.
Seriously, your previous design was better.
Congratulations! I love it!
Wow! Super stuff. I am very inspired. cipro
yes , it’s great , i test it by small the Browser size, and as you have said , it will appear three kind of layout. it is a great design.
Recent surveys, children of depressed mothers’ negative patterns of activity occurring in different brain reveals. This is for children of mothers who take more risks in the future is going to have depression.
You’ve certainly worked hard for this design! Totally made my day! Simply awesome.
http://crab-tree.com is now a worldwide web design services website
I liked the new design and features of your site. Most liked part is HTML5 ready wordpress theme. I checked your site. You used article and footer tags and other HTML5 tags. Great work. People can found free HTML5 ready themes on my site. http://digcms.com/wordpress-themes/
welldone guys ;) nice design , like the simplify touches here
zara maxi james
Love this design. Its great when the side navigation doesn’t move when you scroll down, i think that is awesome. I dont think i’ve seen that on any other site yet, how did you do that.
Please! Create wallpapers of this art to share with us. I think your wall is awesome and just love it!
Cross Country Home Services
Well I just stumbled upon your blog and wanted to say that I have really enjoyed reading your blog posts…
I just noticed about the collapsible comment, when u pressed (-) it has a nice face scroll to top effect, but wen u pressed (+) again, it doesnt have any effects at all.
Comprar sapatos online
Great effects you used! You made a better site, but the old one was fine great too.
Very nice design and choice of colours -I like the use of circles for icons and avatars and the collapsing comments.
Are you left-handed?.what would be really cool would be a @media- query to detect/ask if the reader was left or right handed so that the menu and back to top could be on the left for left handed people and on the right for righthanders ..as a righthander.On the desktop, I don’t like scrolling over the post to click the menu, …ha ha … great site Nick
Looks Awesome!!!! Great WORK…,
I like this more now, but his old friend was very appealing to the eye. In any case, all the praise for a quality content and choice of topics and articles.
Complaintagainst is a online Complaint Department. You can Submit your complaints Totally Free and get your voice heard!
Like! Definitely going to use your site for some much-needed design inspiration (just the the concepts!)
Nice post. Thank you to share these information for us… :D
Awesome as usual. :D
I miss the tag cloud, though. It was helpful for viewing tutorials and others.
If you hover over the Blog icon the tag cloud will appear.
Very clever, Nick!
I found that in two-column view, the search field, the Twitter- and Subscribe-buttons don’t work.
Awesome! I may be able to use these helpful tips for this project I am currently working on :) thanks a lot for this bright idea! Cheers!
i liked the old theme more )-:
simple, neat, clean, awesome designs…
Mont Blanc Pen
What is friendship?Mont Blanc PenWhy do we call a person our friend? When do we call someone a very good friend?
One of the best web design blog designs! I like the the cool effect on hover the links in the left menu. Great job!
London Car Rental
Very nice collection of some usefull icons. is there any limitation on using these icons?
Completely insane redesign and your adaptive theme rocks. I’m using the BigFeature theme but has it’s limitations, especially for mobile devices. Great to have some options now.
UX Jobs Board
Amazing redesign :) We love the static left hand navigation.
Thanks for the post. You’ve got a really attractive wall. Your level of web designing is that of the best web design company.
Website Design Australia
Your article is very informative. Thanks for posting this and if it is possible for you to share me more about it that would be great.
This is verry good.
Hope you can share your design!
You loyal fans.
I love the design because of the fact that its not too serious.its quite fun and playful with a touch of creativity.Good job
And then he handed you the thirty-five 45
i like the design good job
CSS3 Media Queries is a great function. It rocks. Also love the new looking.
Great article, and I love the new look. I found this site about redesigning a site thats pretty helpful as well and kind of funny:
I see you made the website in HTML5? Can you post the a HTML5 article/tutorial. Nice to have is a xhtml > HTML5 webdesign tutorial. Please email me when you do.
The closing date is May 2012 right ?
The new wall is looking awesome buddy :)