Icons can add a lot of meaning to a website or web app design.

Used appropriately, they can make it faster for your visitors or users to complete the tasks they need to complete. But not every website design has space for normal, full-size icons (often 32×32 to 48×48 or sometimes even larger).

That’s where mini icons can come in handy. With the smallest versions of these icons sometimes coming in as tiny as 8×8 pixels and the largest generally being 16×16 pixels (though sometimes they’re slightly larger than that), they can fit into virtually any design.

And there’s a huge variety out there that can fit with almost any aesthetic style. Here are more than 35 of the best sets of mini icons out there (most featured here are free, though we’ve included a few premium sets, too). Read more

When creating a website, so many things need to be planned and considered before even beginning the design — content, audience, goals, usability, color schemes, and so much more.

The design of a microsite, on the other hand, would seem to be an easier task to execute. But this isn’t always the case.

A microsite will sometimes have more sensitive issues to deal with, and could see just as many design iterations — possibly due to branding issues, or a host of other factors that arise due to company politics.

Because of the vast array of possibilities for designs of microsites, there really is no way to properly define any “best practices” in this area of web design.

Certainly many of the same habits and practices would apply (valid code, progressive enhancement, usability, etc.). So, while I’ll be refraining from making any definite statements here, I think it would be valuable to consider the different ways to approach the design of a microsite, discussing some of the potential benefits and drawbacks to each one. Read more

Lex parsimoniae is the Latin expression of what is known in English as Occam’s Razor, a philosophical rule of thumb that has guided some of the world’s best and brightest minds (including Isaac Newton).

It is named after the 14th-century logician and theologian William of Ockham.

But what the heck does Occam’s Razor have to do with web design? I’m glad you asked. To put it plainly, Occam’s Razor states that the simplest explanation is usually true.

For our purposes, to use Occam’s Razor is to do something in the simplest manner possible because simpler is usually better.

In this article, we’ll show you how to use Occam’s Razor to create better websites and to enhance the user experience, both for yourself and your clients. Read more

The World Cup is currently taking place in South Africa and people all over the world are glued to television sets at home, in bars and in town squares, to watch their country play.

The World Cup is actually everywhere one looks – all over TV, the Internet and even supermarket products.

A lot of interesting graphic design is coming out of the World Cup, so we’ve put together a compilation of some of the best designed World Cup 2010 websites. We’ve also included a few African websites for more inspiration.

Drop us a comment and let us know which of these websites you like the best, and if you know of any other inspirational World Cup sites ones that we may have missed. Read more

Designers often don’t take the time they should to learn about how basic psychological principles can effect the experience their visitors have on the sites they build.

Psychological principles are either looked upon as unnecessary, or too complicated. But the truth is that they’re neither.

There aren’t that many concepts associated with basic design psychology, and most are relatively straight-forward and easy to learn.

They’re also mainly easy to implement, though some take a bit more care and planning than others.

Read on to learn more and please leave your feedback and comments at the end of this post. Read more

WordPress 3.0 is, without doubt, one of the most exciting updates to the platform in a very long time.

As well as things that all users will notice such as custom menus, custom backgrounds and a new default theme, there are also massive additions to the code-base such as the ability to run multiple sites from a single install and custom post types.

These things bring WordPress up to speed as an extremely powerful CMS as well as a publishing platform.

Since January of this year I’ve been getting involved with the core WordPress community to contribute back to its ongoing development and today I’d love to tell you a little bit about how that works. Read more

Working with a company as large as Virgin Atlantic was something of a dream come true for me. I it’s something that a lot of web designers aspire to.

Over the last few months, I was fortunate enough to be given the opportunity to fulfill this dream.

I was about to write this post up over on my blog but Walter very kindly invited me to share this case study with the much larger audience here on Webdesigner Depot and across the Smashing Network.

I’m no Elliot Jay Stocks and I certainly don’t claim to be, so when Virgin Atlantic got in touch with me back in November I was surprised, humbled and extremely enthusiastic at the prospect of working with the company on a new blog for the “vtravelled” website. Read more

An image’s dimensions on screen are measured in pixels: width and height.

An image’s quality is determined by less tangible factors: composition, mood, style, contents. But none of that matters if people get impatient waiting for the file to download.

Web images change in file size when compressed. Smaller files are faster to download, which makes for a better browsing experience.

But clear pictures make for a better experience, too. How much—and what kind of—compression should we apply? Are there alternatives to these messy trade-offs?

Here we look at some surprising facts about preparing image files for the web. Read more

Web Apps are popping up everywhere. Five years or so ago, we could live without them, but as the internet has evolved we use them more and more in our daily lives.

We have put together a great compilation of beautiful web application interfaces.

The web applications that were selected to be part of this showcase are based on usability, simplicity, colors and overall layout.

Please note that WDD was not compensated in any way to review these apps.

Feel free to comment and add links to other excellent web UI designs in the comments area below. Enjoy! Read more

Accounting for every aspect of a new website isn’t easy, especially at the last minute.

The problems aren’t the details themselves, but rather the process of making sure that seemingly minor details don’t add up to sloppy work.

The best solution is to write it all down.

The worst solution is to not take a pre-launch checklist as seriously as the planning stage itself.

With the hundreds of details that go into building or redesigning a website, overlooking minor points is easy, especially as deadlines loom—or pass. But missing details detract from the quality of a website.

Read more

ExpressionEngine by EllisLab is a powerful, flexible content management system (CMS) that many designers (and their clients) love.

Various modules exist to allow EE to be used for a number of different purposes, such as membership sites, ecommerce, blogs, wikis, and much more.

Many of the most popular modules come with the personal ($99.95) and commercial ($249.95) licenses, and additional modules are available.

The sites featured here show the flexibility of Expression Engine in their varying design and purpose.

EE allows designers to have the freedom to create layouts without restrictions, which helps to it to be a productive CMS for so many different purposes, check it out. Read more

What makes a design look coordinated, planned and professional? The answer is: ‘color’.

Not every project needs bland corporate blue to look professional. Planning color means creating a framework that describes which colors to use and how to use them.

Color is the slipperiest design element. “Good” color is so closely tied to elusive things like personal taste and intuition, as well as technical considerations such as contrast and monitor calibration.

But color is vital to content. If you consider a website important enough to spend time refining, then readers will likely consider it important enough to spend time reading. Good color choices make that happen.

In this article we’ll review some techniques to achieve beautiful color palletes for your web designs. Read more

Everyone loves an original and unique t-shirt.

Fashion statements aside, they do give a slight insight into your personality, your current mood and sets you apart from the crowd.

This article is not a collection of the best designed t-shirts by the best designers, this is a collection of t-shirts especially for designers and developers.

Those poor suffering souls that have to endure the pain and distress of the questions from everyday Joe’s (“you work with a computer, do you? Will you fix mine?”) and have to work with the many pitfalls and perils that the web offers (IE6 and Flash intros).

Yes, this collection is for you!

Read more

On Monday, October 26, CNN.com introduced a new website design, making a number of major changes to their information-heavy layout.

The new design is beautiful, clean, organized and well-structured. It invites the eye to scan and find something interesting with the goal of clicking through to another page.

The previous design was somewhat cluttered and not very inviting; the content looked liked it was being forced into an unstructured space. The new layout is very different and embraces a number of modern web design and usability best practices and trends.

So, let’s look in more detail at not only the notable improvements, but some of the questionable design and usability decisions.

Read more

“A human being should be able to change a diaper, plan an invasion, butcher a hog, design a building, conn a ship, write a sonnet, balance accounts, build a wall, set a bone, comfort the dying, take orders, give orders, cooperate, act alone, solve an equation, analyze a new problem, pitch manure, program a computer, cook a tasty meal, fight efficiently, die gallantly. Specialization is for insects.” Robert A. Heinlein

It seems that the topic of specialization has come into focus yet again in the web world and with it, the people who say being a “jack of all trades” is a useless thing to strive for.

A lot of web professionals are pushing newcomers to specialize in a single area to make themselves more marketable and employable. Without a doubt, specialists will always be needed in any industry. But is it really so bad to be a web generalist? Read more

Appearance is crucial for obvious reasons in the fashion industry. With that in mind, many fashion e-commerce sites can be an excellent source of design inspiration.

Attractive design and photography can make the products more appealing to visitors and increase sales.

There are a lot of different design styles and approaches that are used by online fashion shops, but generally photography and product/model images play a large role.

Sometimes the design and layout is minimal, allowing for more empasis on the products. Others feature huge photos as the primary focal point of the page.

In this post we’ll feature 35 inspirational fashion website designs that represent a variety of styles that are sure to inspire you. Read more

Many great designers derive their inspiration from nature, and we can find tons of examples showcasing this type of inspiration online.

Looking at the world we live in and finding a way to integrate it into a design requires seeing nature from a new and very different perspective.

Here are 17 great techniques for creating original, beautiful, nature-inspired design.

If you know of any other ways to draw inspiration from nature, please share them with us by leaving your tips and comments at the end of this article. Read more

Creating a wireframe is one of the first steps you should take before designing a website.

A wireframe helps you organize and simplify the elements and content within a website and is an essential tool in the development process.

A wireframe is basically a visual representation of content layout in a website design.

The wireframe acts as a prototype that shows the placement of page features, such as header, footer, content, sidebars, and navigation.

It also specifies the placement of the elements within these content areas. If you want to develop a site that accurately matches the client’s requirements and minimize project revisions, wireframing will keep you on track.

Read more

First of all, what is a brand? A brand is a symbol. Symbols are designs which represent something else, and a brand is meant to package all of the associations, experiences and characteristics into an abstract construct.

This construct can be evoked using consistent imagery, sounds, phrases and logos with which people come into contact.

Brands are very important as they help you win customers and they also help you to keep them.

They do this by awakening the associations and experiences you previously had with the brand, or have seen through advertising, when you come into contact with the brand at key stages. For example, when deciding what product to purchase out of a selection of similar items.

Here are 9 tips to help you to build a brand with web design. Read more