Since Elliot Jay Stocks so poignantly told us to destroy the Web 2.0 look, we’ve witnessed a de-shinification of the Web, with fewer glass buttons, beveled edges, reflections, special-offer badges, vulgar gradients with vibrant colors and diagonal background patterns. The transformation has been welcomed with relief by all but the most hardened gloss-enthusiasts. However, design and aesthetics work in mysterious ways, and no sooner does one Web design trend leave us before another appears.

Can you take a simple list and use different Cascading Style Sheets to create radically different list options? The Listamatic shows the power of CSS when applied to one simple list.

Great InfoGraphic from the Designers Couch blog which details the anatomy of a perfect landing page. The landing page infographic shows us 10 key items to include in your design as well what colors go well with different sites. The 10 elements they suggest concentrating on are:

Page Headlines and Ad Copy
Clear and Concise Headlines
Impeccable Grammar
Taking Advantage of Trust Indicators
Using a Strong Call to Action
Buttons and Calls to Action Should Stand Out
Go Easy on the Links
Use Relevant Images and Videos
Keep it Above the Fold
Always be Testing

The 40 biggest websites now using Drupal Very impressive list #Drupal #webdesign #socialmedia

About a month ago I was reading the New York Times online and they had an article which showed a road in Brooklyn that had been reconstructed to make it safer and more pleasing to the eye. To show the difference in the reconstruction project, they showed a before and after picture using Flash that let the visitor drag a slider over the images, which were sandwiched with one on top of the other, so that you could easily see how dramatic the changes were. I immediately thought that this could be done in JavaScript using jQuery, so I set out to do it. Here’s the result:

This plugin allows any developer to recreate a similar interaction on their own website using a few simple lines of Javascript. By attaching the method to an anchor tag, pageSlide wraps the original body content into a wrapper and creates an additional block for the secondary content load. The slide is animated whenever the click event is invoked.

Design and collaborate (in real-time) user interface mockups for your software and websites.

Compiled here is another top 10 countdown. This time we count down the top 10 PSD to HTML conversion tutorials. These top tutorials teach you how to take many different designs in Photoshop, and code them out into HTML and CSS.

Ember is the best way to share your design inspiration with the world - from webpages to screenshots, design to illustration, Ember is built for creatives looking to build an online design scrapbook.

This article reviews some important and necessary checks that web-sites should be checked against before the official launch — little details are often forgotten or ignored, but – if done in time – may sum up to an overall greater user experience and avoid unnecessary costs after the official site release.

As the number of people using mobile devices increases, so too does the pressure to ensure that our websites look good and are legible on a mobile device. The ideal, and unrealistic situation, would be to test on real handsets, but obviously this would be impossible for most designers. Fortunately, there are number of tools available online, allowing you to put your site through its mobile paces.

This icon set consists of 30 (16×16) finely crafted social media icons. They are free to use non-commercially. Put them on your blog or on your website to help users bookmark or share your site socially. I hear its all-the-rage these days.

Here are 3 awesome ways to use Wordpress’s custom fields.

This is the Chapter II of the Complete WordPress Theme Guide series. This chapter will show you how to build a custom WordPress theme. Although the Codex site provides very good documentations on how to create a theme, but I find it too complicated for a beginner. In this tutorial, I will explain the basics of how WordPress theme works and show you how to convert a static HTML template into a theme. No PHP skill is required, but you need Photoshop and CSS skills to create your own design.

We’re developing a checklist that all websites should be checked against before launch. Let us know if we’ve missed something out, or if something needs further clarification. Some well-known and well-documented tasks (such as validation and accessibility testing) are not explained in detail. Add your suggestions in the comments.

User research finds significant deficiencies in non-profit organizations' website content, which often fails to provide the info people need to make donation decisions.

One of the web 2.0 design and layout trends which I actually quite like is what I am going to call "clean and horizontally divided". Catchy name eh?

@minorjive I've wrestled a lot with IE6 bugs. Here's a helpful link: . Google Eric Meyer ie6, he's a guru.