CSS explained to web designers

CSS is not Photoshop. Period. CSS is a style sheet language designed to allow you to build complete page layouts starting from an HTML underlying structure. With CSS, you should rethink your approach to visual design. First, with CSS your design is not a full-box where the end user has no access but rather an interactive field where user's and designer's needs meet each other.

Origins of user interface colors

The color palette used in many user interfaces quite resembles
the one used on several signs that we can found in our everyday life. In this palette, colors convey a special meaning to the final message and they can actually grouped into three main groups: information, warning and errors. In this post I'm going to focus on several examples of colors found in these three groups.

From signs to logos: a web designer perspective

Signs are everywhere: we see them on the streets, inside buildings, on packagings and in a lot of other common places. But what is (or what has been) their impact on the design of logos? This is quite a stimulating question from a web design perspective. First a truism: signs came before logos. If we go back in history, we will probably notice the abundance of signs throughout the entire human history. Probably the best example of signs is represented by the ancient Egyptian writing, a complex system made up of hundreds of signs that were only later translated by Champollion back in the early of XIX century.

User-centric web design

Web design can be actually considered a form of art under many aspects. A web designer is a skilled designer with a strong background either in web standards or in graphical design. Many layout I've seen so far on the web are more than beautiful: they actually communicate some kind of inner poetry, a magic that moves from the screen and reaches the visitor's mind conveying the concept behind a web site or web project.

How can a user receive this message? How can sight convey such a concept? The idea behind all successful designs is that the user is a part of the design, and not only a mere spectator. Colors, graphics, gradients, typography work fine when a designer is able to include a casual visitor into his/her design by predicting how certain graphic combinations can affect the user's mind. It's more like painting a canvas than creating a PSD file. For example, the Gioconda's smile attracts the visitor with a subtle use of lights and shadows that gives you the impression of a living person who follows your curious eyes.

It's a smart effect, because the great Leonardo knew very well how the laws of distance and proximity do interact with our feelings. A masterpiece in web design occurs when both the designer and the user are in the same design or, in other words, when a user and a designer can exchange their roles in the inner working of site interactions.

Bad search engines in web design

Jakob Nielsen summarized his opinions in his article:

Overly literal search engines reduce usability in that they're unable to handle typos, plurals, hyphens, and other variants of the query terms. Such search engines are particularly difficult for elderly users, but they hurt everybody. A related problem is when search engines prioritize results purely on the basis of how many query terms they contain, rather than on each document's importance. Much better if your search engine calls out "best bets" at the top of the list -- especially for important queries, such as the names of your products. Search is the user's lifeline when navigation fails. Even though advanced search can sometimes help, simple search usually works best, and search should be presented as a simple box, since that's what users are looking for.

I have to say that I fully agree with him. Simply put, a bad search engine can actually affect the user experience on a given website, because the results it might produce can make the user feel frustrated and disappointed. But what is a good search engine? A good search engine is something that:

  • tries to correct typos and query variants, providing the correct results to a given query
  • avoids the disappointing "no results found" page, as Amazon does
  • suggests search queries during typing (with Ajax, for example)
  • orders results in a relevance scale, so that a user can immediately jump to the most pertinent result
  • provides some advanced search features to refine search results.

A search engine that fulfills these goals is already a good search engine, provided that it leaves room for further improvements. Flexibility is always the most required feature.