Author:

Co-Founder and former CEO of Smashing Magazine. Sven is now writing Science Fiction Stories and looking for a publisher ...

55 Free High Quality Icon Sets

We love free icons. We love to smash things. And we respect hard-working designers. Therefore we are regularly looking for talented artists and creative designers and we are glad to support them by showcasing their work in our magazine. If you are going to create an icon set and experience any problems releasing it or spreading the word — let us know, we may figure something out.

Freebies Icons

In the overview below we present 55 more excellent, free and professional icons for desktop and web design. Some of them can be used for both private and commercial projects. You may always use them for free in your private projects. Nevertheless, it is always worth to take a look at the license agreements — they can change from time to time.

You can also scan through the icons-related articles we’ve published before:

Read more...

Style Switchers Contest Results

Three weeks ago we have announced the Style Switchers Design Contest where we've presented some ideas for style switchers design and encouraged our readers to create a style switcher for their own web-sites. One of the participants was to be awarded with an Apple Cinema 20 Flat Panel Display. Over 60 designers participated and — as in all of our earlier contests — the results are indeed pretty smashing. Now it's time to review some of the best designs and, of course, announce the winner.

Screenshot

Screenshot

This contest has proved one thing: there are a number of possibilities for creative use of style switchers in your designs. They don't have to be boring and can combine functionality with a beautiful and engaging design. Style switchers are back now; and we are glad that so many designers have participated in our contest learning how to use them and apply them to their designs.

Read more...

Favicon Episode 7

Every now and again we showcase beautiful favicons — tiny pieces of art you’ll usually find in your browser's address bar or when searching through your bookmarks. Favicons are important as they provide visual indicators to visitors and help them to easily associate the content with a bookmark in their browser. Besides, favicons are just nice to look at and there are way too many sites which don't make use of them. We like to change things. Which is why here is the 7th episode of the favicons series.

Favicon
Favicon
Favicon
Favicon
Favicon

Below you'll find 70 outstanding favicons. Please notice that the favicons weren’t chosen simply because of their beauty; it’s been important to us that the favicon perfectly fits to the overall site design. All favicons are linked to the sites where they are used — you can click on them to get more insights into how favicon design can be related to the layout design.

We’ve written enough about favicons in our recent posts. If you’d like to find out more about them, feel free to take a look at our previous posts:

Read more...

CSS Editors Reviewed

We continue to review text and source editors for designers and web-developers. After a thorough consideration of WYSIWIG- and source code editors now it's time to take a closer look at applications for advanced CSS-coding. Reason: while numerous HTML-editors offer more or less advanced CSS-support there are also allround-CSS-editors which offer a sophisticated integrated development environment for CSS-coding.

Of course, real CSS ninjas accept nothing but a minimalistic Notepad or some sophisticated source code-editor. In fact, CSS-editors are often considered to be unnecessary and superflous — after all, you can do the same in your favourite text editor. And sometimes this is true — while there are some really bad HTML-editors there are also some even worse CSS-editors. Particularly code autocompletion tools are extremely good at bloating the code to extremes, making the resulting stylesheet unnecessary complex and hard to maintain. Why would someone purchase a CSS-editor to raise the maintenance costs afterwards?

CSS Editor Screenshot

Yet CSS-editors can be helpful; furthermore, you can effectively use them in different settings by developers with different skills. Web professionals can use a CSS-editor to improve workflow and get all useful CSS-tools provided by one single application. Newbies can easier learn CSS by analzying stylesheets and using live-editing to understand how the design is built up and what is actually going on behind the scenes. In either case you should make sure you know what you are doing and not end up producing quick'n'dirty stylesheet.

This post presents an overview of 15 established or rather unknown CSS-editors; you’ll probably find “usual suspects” — your favourite editor or the editor you’ve once been working with. But you’ll also find some rather unknown alternatives which are definitely worth considering when choosing an optimal source code editor.

Read more...

Hand-Drawing Style In Modern Web Design – Volume 2

When it comes to web design too often perfect, colorful and boxy designs make the cut; however, the reality is different as it is hard to find objects with a perfect shape and a perfect color in our daily routine. To achieve a unique and communicative design we need to consider more creative approaches. For instance, we can draw sites by ourselves — or at least some parts of it.

The main purpose of hand-drawn elements lies in their ability to convey a personality and an individual note in times when perfect, boxy and rounded elements can be found almost everywhere. They look different and they can make a web-site look different. And this is what we usually are after in the first place.

Screenshot

And in fact, this is done quite often: whether a blog, a shop, an ad, a private page, or some collaborative project — doesn’t matter whether with Flash or (X)HTML. This post presents fresh examples of hand-drawing style in modern web design. All screenshots can be clicked and lead to the sites from which they’ve been taken.

Please also have a look at our previous showcase

Read more...

Block Quotes and Pull Quotes: Examples and Good Practices

Quotes are used to emphasize excerpts of text. Since users almost never read but scan we need to provide them with some focus anchors to fix their attention to the most important parts of our articles. Furthermore, quotes are always used for testimonials and sometimes for blog comments. They can be styled using graphics, CSS and a little bit of JavaScript. Sometimes, creative dynamic solutions can be applied as well.

Screenshot Pullquote

This post presents creative examples and best practices for design of pull quotes. We’ve tried to identify some common solutions and interesting approaches you may want to use or develop further in your projects.

You may also want to take a look at the posts

Read more...

Style Switchers Are Back: Ideas, Examples and a Contest

Design a style switcher and win an Apple Cinema 20 Flat Panel Display with 16.7 million colors, 400:1 contrast ratio, 0.258 mm dot pitch, 16 ms response time and 170-degree viewing angles. Yes, that's that easy. Style switchers are used to provide users with a choice of layouts, fonts, colors and views they can use to adapt the design to their personal needs. Designs with style switchers are more flexbile, more adaptive and more user-friendly as different visitors can quickly modify the design for their personal convenience.

Apple

Web designers can achieve significant usability-improvements by adding a simple style switcher to their designs. Style switchers are useful and powerful as they give users a better control of site presentation. However, this technique is almost never used and are sometimes considered to be unnecessary and useless which is simply not true. We would like to change it.

We want to motivate you to figure out how style switchers work and how you can use them to improve your designs.

Read more...

Smashing Texture Contest Results

Last week was really full of hard work for us. The response to Smashing Texture Contest was impressive and overwhelming. We have received over 740 e-mails from over 600 participants, resulting in far more than 2000 photos. The result, however, is not just literally zillion of textures, but truly brilliant textures you can use in your private and professional projects for free. Thanks to all participants — without Smashing readers this texture gallery wouldn't be possible.

What came out of it? A variety of interesting, exotic or creative textures from all around the globe. Wood, stone, metal, nature, ice, sand, fabric, paper, glass, fire, food and plastic textures. A large number of daily routine things observed from a completely new perspective.

You can use all textures we present in the gallery for both private and commercial projects for free, without any restrictions whatsoever. However, you are not allowed to offer these files for download; please respect the interestes of over 300 participants of our contest. Please also consider the license information attached to the .zip-archives you download from our server. When it comes to usage of textures, different photographers may have different opinions and intentions.

Read more...

↑ Back to top