Author:

Co-Founder of Smashing Magazine. Former writer, web designer, freelancer and webworker. Sven is now writing Science Fiction Stories.

Google Profile: https://plus.google.com/u/0/104031840292767553284/posts

50 Fantastic Favicons: Episode 9

Every now and again we showcase fantastic favicons, those tiny pieces of art that you’ll find in your browser’s address bar or when rifling through your bookmarks. These little gems are important because they serve as visual indicators to help visitors easily identify content in their browser. That aside, favicons are just nice to look at, and way too many websites don’t make use of them. We want to change that, which is why we are presenting what is now the ninth episode in our favicons series: a small article with tiny images and fast loading time… for a change.

illu_favicon09

Any picture's merit is debatable. But notice that these favicons were chosen not simply for their beauty and originality; it was important to us also that each fit the overall website design and logo. Pay attention to the details of the design.

All favicons are linked, of course, to the websites from where they were taken (if they still exist). Click on them to get more insight into how favicon design relates to overall layout design. The order here does not indicate any ranking.

Read more...

30 Free Photoshop Swirl Brushes

Today we are glad to release 30 Swirl Brushes, a set with 30 high-quality swirl Photoshop brushes with an average size 2000px. These brushes were created with Adobe Photoshop CS4 and also work with the version CS, CS2 and CS3. This set was designed by Thomas Béal especially for Smashing Magazine and its readers.

30 Swirl Brushes

You can use the set for all of your projects for free and without any restrictions. You can freely use it for both your private and commercial projects, including software, online services, templates and themes. The set may not be resold, sublicensed, rented, transferred or otherwise made available for use. Please link to this article if you would like to spread the word.

Read more...

The Mystery Of CSS Sprites: Techniques, Tools And Tutorials

CSS Sprites are not new. In fact, they are a rather well-established technique and have managed to become common practice in Web development. Of course, CSS sprites are not always necessary, but in some situation they can bring significant advantages and improvements – particularly if you want to reduce your server load. And if you haven't heard of CSS sprites before, now is probably a good time to learn what they are, how they work and what tools can help you create and use the technique in your projects.

CSS Sprites Screenshot

The term "sprite" (similar to "spirit," "goblin," or "elf") has its origins in computer graphics, in which it described a graphic object blended with a 2-D or 3-D scene through graphics hardware. Because the complexity of video games has continually increased, there was a need for smart techniques that could deal with detailed graphic objects while keeping game-play flowing. One of the techniques developed saw sprites being plugged into a master grid (see the image below), then later pulled out as needed by code that mapped the position of each individual graphic and selectively painted it on the screen.

You may want to take a look at the following related posts:

Read more...

Smashing Highlights 2008

2008 was a successful year for us and for Smashing Magazine. Reviewing what has happened on Smashing Magazine over the last year, we could have told a couple of impressive stories that happened here and there, but we won't do that. Instead, we would like to take a rather critical look back and discuss what we've done and what has changed in 2008.

Smashing Alien Icon

We genuinely thank our readers for your attention, criticism, ideas, suggestions and numerous emails and links over the last year. We have tried our best to improve the quality of our articles and increase its value for designers and developers. In this post, we review what has happened on Smashing Magazine over the last year: smashing highlights, setbacks and small sensations of 2008, in a brief overview, month by month.

Read more...

A Short Story About “Back To Top” Links

Often it is the close attention to small details that makes a design outstanding. During the development of a website, designers tend to quickly forget about small details and focus on major design elements, such as navigation, typography and layout. If done properly, the result is usually a solid, impressive and highly professional design that communicates information. However, it is not memorable. The reason is that such designs often do not have a memorable voice: they may look visually appealing, but they don't provide a vivid anchor for users to remember a website after leaving it.

Screenshot - Top Link

In this post, we showcase the design of "Back to top" links, a forgotten and rarely used link that helps users jump to the top of a given page. A visitor can achieve this effect by pressing the "Home" button on his or her keyboard; however, not every user is aware of that shortcut, and most probably use the vertical scroll bar in the browser for that purpose. As designers, we can help our users out by adding a stand-alone "top" link to our designs.

Read more...

Favicons, Episode 8

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 8th episode of the favicons series. For a change a small article with very small images and a quick loading time.

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. Pay close attention to the small details of the 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. All favicons are listed without a particular order. All images are linked - of course, if the page that contained the favicon still exists.

Read more...

50 Beautiful Blog Designs

There are things one can do a number of times without worrying about becoming boring. For instance, collecting and showcasing excellent blog designs. In this post we do it already the fifth time. Why? Web design lives in blogs; new developments appear there, that’s where the music plays. And that’s where you need to look for in order to keep up with current trends and developments.

Showcase of Beautiful Blogs

In the showcase below we present 50 beautiful blog designs that literally stand out — either through their layout or through their design or through their attention to little details. Below you'll find a variety of designs: clean designs, grunge, retro, graphics-heavy designs etc. Most designs presented below risk unusual approaches in the choice of design and content presentation. That's what makes them different. Hopefully you will find some creative ideas which you can develop further in your further projects.

We strongly encourage designers to break out the common layout conventions, experiment with new approaches and risk crazy ideas. Show what you are capable of!

You may want to take a look at the following related posts:

Read more...

The <hr>-Contest Results – Download your fresh <hr>-line now!

Three weeks ago we have encouraged our readers to participate in our <hr>-contest by designing beautiful and creative horizontal lines. It was necessary, since this design-element was slowly disappearing and was often neglected in web design. But it is going to change now. We have received 1290 images and source-files from 384 designers across the globe. The result is an impressive collection of horizontal lines that designers can use for free without any restrictions whatsoever.

hr-line

hr-line

hr-line

Many entries contained not only images, but also source-files, mostly for Photoshop or Illustrator. You can use them if you want to modify a design for your projects. For this purpose we packed these files in one .zip-archive with all source-files (109 files, 25 Mb). Of course, it would be better to provide the link to a .zip-package next to each of the designs presented below, but it would take many hours of work which we can actually use in a more effective way. We can not guarantee that all images in the .zip-package are correct as we haven't tested all of them.

Unfortunately, some entries could not be considered for the contest. They didn't meet our requirements, were too big or unusable. It was important for us that these files could be used in projects beyond the scope of our contest.

Read more...

Smashing Magazine’s 2nd Anniversary

It happened again. Today, Smashing Magazine celebrates its second birthday. We are two years old now and we are proud of what we have achieved over these years. To celebrate our anniversary, we could do any number of things. For instance, we could organize a huge giveaway—as we did one year ago—but, of course, bigger and more overwhelming. However, we won't do that; after all, we're giving away stuff every week and we have many contests where our readers can win truly smashing prizes. (New contests are already on their way.) Posters Instead, we could share some insight about the highlights of Smashing Magazine over the last 12 months: an exploding number of page views, hundreds of thousands of backlinks, numerous testimonials and rewarding ad revenues. But we would probably sound like show-offs and we can't afford to do that; after all, we have only published 301 posts so far.

Read more...

Simplicio: A Free Icon Set

We are always looking for creative and talented artists and designers. Once we find them, we ask them to cooperate with us and release something for free. We provide them with the full freedom to showcase their professionalism and express their creativity. Every release helps to make the Web a nicer place. In fact, the results are quite often pretty impressive. You can find our previous releases in our section Freebies.

Smashing Icon Set

Today we are glad to release a Simplicio icon set. The main motivation behind the design was to create a simple, even minimalistic set which can fit into every project. The set contains 78 free icons in .png and .ico including AI which can be useful for both corporate and personal setting. You can use the set for free – without any restrictions whatsoever.

The icons are available in the .png- and .ico-formats in the resolution 128×128px. AI-sources are also included in the package. This icon set was designed by Neurovit from Turkey especially for Smashing Magazine and its readers.

Read more...

↑ Back to top