Smashing Magazine we smash you with the information that will make your life easier. really.

60 Rare and Unusual Vintage Signs

In the U.S., most outdoor signs made between 1890 and and 1950 were constructed of a base of heavy rolled iron, which was die cut into the desired shape, then coated with layers of colored powdered glass and fired in a kiln. This process made them durable and weather-resistant. Signs made this way were known as porcelain enamel signs or simply enamel signs.

Porcelain enamel signs originated in Germany and were imported into the U.S. They quickly became a staple of outdoor advertising across the country. Around 1900, designers experimented with bold colors and graphics on the signs and they were used to advertise everything from cigarettes and beer to farm equipment and tires. Early designs were stenciled, but American designers switched to silkscreens and started using a steel base instead of iron. Later, when porcelain enamel became too costly, tin bases were used instead of steel.

You may also enjoy these previous articles:

• Celebration of Vintage and Retro Design, which features ads, illustrations, book covers, pins and posters from the 1920s to the 1980s.
• Retro and Vintage in Modern Web Design, which highlights websites with a nostalgic atmosphere.

Read more...

Useful Glossaries For Web Designers and Developers

In a day in age where there are just as many freelancers as there are university educated designers, developers, and all around web gurus, it is amazing to me how much many of us don’t know or have forgot about our trade. As a self-taught designer, I will admit to you upfront that there is a lot I don’t know when it comes to official jargon or certain aspects of things like typography and graphic design. It is these reasons that I call upon glossaries from time to time.

But glossaries aren’t just for brushing up on old terms or for calling upon while you learn new things. They can also make a great reference point for your customers. I am sure we have all had clients who thought they knew what they were talking about when it came to SEO or web design. When you try to explain to these clients that they don’t know what they are talking about, the end result can sometimes turn ugly or at least bring on an unwanted headache. In these situations it is handy to have a glossary at hand to point your clients to. This way they can see that they were mistaken and you get the satisfaction of your own personal “I told you so.”

Last week we presented Web Design Industry Jargon: Glossary and Resources, a general guide to industry terms that should get you well on your way to understanding what web designers are talking about. In this post we go into detail in each single area of web design such as typography, usability, marketing, Photoshop, wordpress, graphic design, CSS, XHTML, DOM, JavaScript, print design, SEO, social media, software development, Twitter and further areas.

Read more...

Gorgeous Examples of Floral Typography

Floral typography is the technique that combines typography, calligraphy and lettering to create dynamic, "flourishing" designs. With the help of floral elements you can create very tempting and vivid artworks in which the typography seems to be shaped by plants and flowers. In this way you can convey your message in a very artistic way. In fact, various floral ornaments – which are the essential component of floral typography – can make the design stand out and help the artist to create inspiring, refreshing and thought-provoking pieces of art.

Below you'll find a beautiful collection of floral typography and also some outstanding tutorials that will help you to master the technique or at least get some understanding of how this technique can be used. Please feel free to explore the further works of the artists presented below as well.

Read more...

Typographic Layout Design Contest: Join In and Win!

As web-designers, we shouldn't underestimate the power of typography. The content is the king and typography is an extremely powerful mean that can help designers to effectively convey their messages to the audience. Recently we presented an overview of useful typographic CSS-tools and 8 Simple Ways To Improve Web Typography. And now it's your turn to show what you are capable of when using these tools.

In this post we announce the Typographic Layout Design Contest, a contest that has the goal to collect beautiful typographic (X)HTML+CSS-based layouts created by you and release them for free as a gift for the web design community. And, of course, we have some nice awards for best designs submitted in the contest.

Read more...

15 Fresh High-Quality Free Fonts

Every now and again we take a look around, select “fresh” high-quality free fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually the time you should be investing in your current projects. We search for them and we find them, so you don’t have to.

In this selection we’re glad to present you Junction, Nadia Serif, Nilland, CartoGothic Std, Bergamo Std, Comic Serif, Birra Stout, Vegur and a couple of other high-quality free fonts. Please read the license agreements carefully before using the fonts — the license can change from time to time.

• 15 Beautiful High-Quality Free Fonts
• 40 Excellent Free Fonts For Professional Design
• You can find over 80 more free fonts in our section Fonts.

Read more...

Creative Print Typography Layouts

In print design, typography is one of the more crucial aspects. Typography is essential the practice of organizing, arranging, and modifying type. The typography techniques uesed in print has a direct impact on how the reader is able to receive the image. In print, typography doesn't have to be plain and boring. It can be beautiful, creative, and colorful. There are a number of ways to liven up typography, such as creative and original layouts, using color variations, use of fancy fonts, and much more.

This showcase will focus mostly on the layout and organization schemes. Below are about 40 different typographic layouts used in different fields of print such as brochure design, editorial design, and poster design.

You may be interested in the following related posts:

• Sexy, Bold and Experimental Typography
• Breathtaking Typographic Posters
• Vintage And Retro Typography Showcase
• 40 Creative Design Layouts: Getting Out Of The Box
• 8 Simple Ways To Improve Typography In Your Designs

Read more...

30 Brilliant Typefaces For Corporate Design

Designing a beautiful, legible typeface is hard work and takes time and patience. The type family has to convey a message clearly and effectively, regardless of the setting in which it is used. Of course, thousands of freely available fonts are out there, and some free fonts are very impressive. Yet only a few free fonts manage to beat the look and feel of a carefully designed professional typeface, one that has been painstakingly developed over years with a close attention to tiny details.

We looked around and researched recently released corporate typefaces that have been frequently recommended, mentioned or discussed on popular typography-related blogs, forums and magazines. In the end, we came up with a list of the most promising corporate typefaces and collected information about each of them. The result is this comprehensive showcase of typefaces, together with links to specimens and pricing information.

Below, you'll find 35 brilliant new typefaces for corporate design. Please note that they are not free, but we've focused on typefaces that are definitely worth spending money on. This showcase should serve as a great reference for professional designers looking for some fresh, beautiful typefaces for their corporate projects.

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

• 40 Free Fonts For Professional Design
• 80 Beautiful Typefaces For Professional Design
• 60 Brilliant Typefaces For Corporate Designs and
• Our section on Fonts has a number of typography-related posts.

Please be patient; this page might take some time to load.

Read more...

8 Simple Ways to Improve Typography In Your Designs

Many people, designers included, think that typography consists of only selecting a typeface, choosing a font size and whether it should be regular or bold. For most people it ends there. But there is much more to achieving good typography and it's in the details that designers often neglect.

These details give the designer total control, allowing them to create beautiful and consistent typography in their designs. While these details can be applied across different types of media, in this articles we're going to focus on how to apply them to web design using CSS. Here are 8 simple ways you can use CSS to improve your typography and hence the overall usability of your designs.

Read more...

Typography Keyboard Layout: Download Now!

In January we commissioned Ilya Birman, a Russian designer with passion for typography, to adapt his typography keyboard layout (which has become a common typographer's tool in Russia) to create a version for English-speaking designers, artists and, of course, typographers across the globe.

The main idea was to provide the web design community with a handy tool that would let designers enter characters that are usually unavailable on a keyboard easier and quicker. If you already tried to enter such words like naïve or résumé or used special symbols (trademark symbol ™) or pay attention to diacritics (en-dash, em-dash, hyphen etc.), you probably know what we mean.

In this post we release the Typography Keyboard Layout – a simple, yet useful tool that lets you enter characters that are usually unavailable on a keyboard with ease. Hopefully it will help you to achieve better typography in your designs.

We asked our Twitter followers to participate in our beta-testing. And after we received a lot of positive feedback, we implemented some of your suggestions in the final version.

Read more...

10 Principles For Readable Web Typography

Readability is one of the more important aspects of Web design usability. Readable text affects how users process the information in the content. Poor readability scares readers away from the content. On the other hand, done correctly, readability allows users to efficiently read and take in the information in the text. You want users to be able to read your content and absorb it easily.

In this post, we'll explain some Web typography terms and how they play into readability; we'll present numerous tips to help improve the readability of your content; and we'll showcase very readable websites, layouts and articles.

You may also be interested in the following related posts:

• 5 Principles and Ideas Of Setting Type On The Web
• 50 Useful Design Tools For Beautiful Web Typography
• Fantastic Typography Blogs For Your Inspiration
• The Showcase Of BIG Typography

Read more...

Fantastic Typography Blogs For Your Inspiration

Some say that web design without typography is like an orange without its peel, it just isn’t complete. Typography encompasses the reality of effective web design and achieves success in creating web page identity, eye-catching sites, and the enhancement of visual appearance.

Typography is much more than the “art of text”, it’s the evolution of creativity within simple to intricate web designs. One can say that a good architecture needs great support, the same concept can be applied to web design in the sense that a good blog could do without the use of typography, but an astounding one could use the creative support.

Typography leaves you with the option of bringing together simple creativity with unique and effective communication in order to get your blog or sites main focus across. Now, with all of this information at hand here are 40 fantastic blogs that will allow you to expand your knowledge base of what typography really is.

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

• Useful Design Tools For Web Typography
• Useful Type Setting Principles
• Free Fonts For Professional Design
• Brilliant Typefaces For Corporate Design

Read more...

50 Useful Design Tools For Beautiful Web Typography

Typography is elegant when it is attractive and communicates the designer’s ideas. When chosen wisely and used carefully, it can be very effective in supporting the overall design. Designers are always exploring different techniques with type: some use images or sIFR to produce very beautiful typography, while others prefer CSS alone to get the typography just right.

Today, we will look at 50 most useful typographic tools, techniques and resources for creating effective and expressive designs. We will also look at some hands-on typography tools that help designers and developers learn how to style their Web content, test it interactively and see the changes instantly. These tools are great for experimenting with different font types for your website.

Below we cover typographic tools, useful typographic references, font browsers, typographic CSS- and JavaScript-techniques, hyphenation techniques, sIFR tools and resources, grids and related tools, free and commercial fonts, a guide to Web typography, examples of great Web typography.

Please feel free to suggest further tools and resources in the comments to this post. And if you like this post please feel free to subscribe to our RSS-feed and follow us on Twitter.

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

• 50 Extremely Useful PHP Tools
• 50 Extremely Useful CSS Tools

Read more...

The Right Type: 5 Inspiring Typography Tales

Nowadays, typefaces are a dime a dozen; there's certainly no shortage of free fonts. But as in any artistic field, the standouts are rare, and understanding why they excel takes gradual experience.

In this yarn, we'll take a closer look at inspiring stories behind the design of typefaces that you may have seen or used but didn't know the history of. We'll explore the nooks and crannies — both literal and figurative — of the evolving printed word. By the end, we hope you come away with a better appreciation of how things came to be.

Read more...

Vintage and Retro Typography Showcase

Typography talks the talk, to go along with the overall work’s walk, speaking volumes for the artist. This important design element surrounds people daily as they move through their routines, rarely taking notice. It’s literally everywhere. In advertising, product packaging, printed publications, graphic designs, and more. Accentuating and centralizing the overall theme of the design that it inhabits, communicating the message to the masses through creative inclusions in the work.

For decades this design tool has given rise to some truly elegant type that still have impressions echoing through design today. Revisiting these themes is a cyclical commonplace that the design community embraces with stunning results. In this article, we go retro, finding beautiful examples of vintage typography and the modern work they’ve inspired. Looking back, it’s easy to see why some of this type has stood the test of time and is still lingering in the design community today.

Read more...

Free Fonts Of The Month: Myndraine, Museo Sans

Every now and again we take a look around, select “fresh” high-quality free fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually the time you should be investing in your current projects. We search for them and we find them, so you don’t have to.

This month we are glad to present 5 free high-quality fonts and collections of grunge and handwritten fonts. Please read the license agreements carefully — they can change from time to time.

• Last episode features Fertigo Pro and FF Nuvo,
• You can find over 80 more free fonts in our section Fonts.

Read more...

Ampersands With Attitude

Ampersands have long been the character in a typeface with which typographers can indulge themselves. Sweeping curves, flirtatious finishes and bold statements - these are the things that make ampersands an exciting character to use and, better still, to design.

Can you spot what typeface is used to display the ampersand in the image above? Large view

There are, however, two problems. The first is that the English language gives us few situations to use such a daring character. We seldom get to show off these beautiful examples of typography. The second is that the poor little ampersand so often goes unnoticed.

Allow me to share with you my top 10 different styles of ampersands. Some are similar, but each have their own personality. In an effort to limit my sample selection, I have only chosen ampersands from freely available sans fonts.

Read more...

Top Ten Web Typography Sins

While many designers have been quick to embrace web standards, it's surprising how often the basic standards of typography are neglected. Here are ten deadly sins to avoid in your web typography.

Using hyphens instead of an em dash. If you need to interrupt yourself, do it with an em dash (alt+0151) instead of a pair of minus signs. This is a top pet peeve for countless editors. Using periods instead of ellipses. Most fonts provide a dedicated ellipsis character (alt+0133) to keep your type tidy. The ellipsis character fits the three dots into a single letterspace, which is especially beneficial for content that might be printed.

Read more...

The Showcase Of BIG Typography - Second Edition

In Web typography doesn’t have to support the overall design. It can dominate. It can be loud. It can be bold. And it can be everywhere on a web-site. In many situations it’s reasonable to give the typography the prominent position it deserves, leaving visual cues in the background or removing them at all. Doing that, you have to risk large font sizes surrounded by a generous amount of white space. What comes out of it? Elegant web sites with a unique form, style and sense of precision.

Few months ago we have already presented some sites with quite BIG typography. In this article we present further 55 examples of big, “loud” and yet elegant typography in web design; some listed designs are Flash-based, and in some cases designs are based not only upon typography, but also upon some visual elements.

Please take a look at the following posts as well:

• The Showcase Of BIG Typography — First Edition
• Sexy, Bold and Experimental Typography
• Breathtaking Typographic Posters

Read more...

Free Fonts Of The Month: Freebooter Script, Cora Basic

Every now and again we take a look around, select “fresh” high-quality free fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually the time you should be investing in your current projects. We search for them and we find them, so you don’t have to.

This month we are glad to present you Freebooter Script, Cora Basic Regular, Walkway and Karabine. Please read the license agreements carefully — they can change from time to time.

• Free Fonts Of April features GrauBlau and Nevis.
• You can find over 80 more free fonts in our section Fonts.

Read more...

Sexy, Bold And Experimental Typography

Sometimes typography is all you need to communicate your ideas effectively. Graphics can support the type or type can support the graphics, but to deliver the message precisely, you need to make sure your type is expressive enough, your design is distinctive enough and the composition is strong enough. The results are sometimes crazy, sometimes artsy, sometimes beautiful, but often just different from things we're used to. Thus designers explore new horizons and we explore new viewing perspectives which is what inspiration is all about.

This post showcases over 70 examples of sexy, bold and experimental typography. Some examples are typographic posters, some are typographic illustrations and some are just sketches with type. In any case, you will hopefully find some inspiration for your future works.

Feel free to check out our previous typography-related posts:

• Breathtaking Typographic Posters with over 50 typographic posters designed by artists across the globe. We feature Oriental, Iranian, Hebrew, Japanese, Chinese and Russian typographic posters as well as a number of further references,
• Typography In Motion presents some excellent examples of typography embedded into movies and videos,
• The Showcase of BIG Typography with over 35 examples of big, “loud” and yet elegant typography in web design.

So what can be achieved out of simple letters and symbols? Please be patient, some screenshots are huge.

Read more...