By Huw Wilkins
Ampersands have long been the character in a typeface1 with which typographers2 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. [Content Care Oct/20/2016]
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.
1. Nilland Link
Here we have a pretty run-of-the-mill ampersand. It comes from the font Nilland5. You see this style in common fonts like Helvetica and Arial. It has the classic one piece figure-of-eight body. The little horizontal tail finishes this character off nicely, it seems to give a certain perkiness that it otherwise might have lacked.
2. Bitstream Vera Sans Link
You might recognise this style as well. This particular character comes from Bitstream Vera Sans6. There are a few ways to look at this ampersand, and this is one of the reasons this character works so well. It looks like the ampersand above, only with the top right side of the figure-of-eight cut out (yet it actually ends up not looking very much like the above character). It also looks like a sweeping back-to-front 3 with a extension from the middle (you can see this better if you turn your head so your left ear is pressed against your shoulder).
3. BPmono Link
This is where things start to get a little weird. Is it a ‘g’ gone wrong? Is it a swan? Is it a fishing hook? Actually it’s the ampersand from BPmono7. I probably shouldn’t have likened it to a swan and a fish hook, because now you’re probably having a hard time seeing it for what it is… a sweet little ampersand with a cute tucked in style.
4. Kontrapunkt Link
Here we have another style entirely. It’s an evolution of what you might see in handwriting. However, on paper the line would be drawn down the middle of the ‘E’ shape. This is the font Kontrapunkt8, so it’s been given angles and a lovely boldness.
5. Diavlo Link
6. La Peruta FLF Link
7. Skia Link
8. Tuffy Link
9. Lacuna Link
I’ve decided to finish off with two italicized ampersands. This one is from Lacuna13 and looks like some kind of crazy ‘e’. Somehow, with that cross bar and the horizontal plate at the end, it still ends up feeling like an ampersand.
10. Fontin Link
So there we have it. 10 interesting takes on the ampersand. I hope you’ve been educated, I hope you have fallen in love with typography a little more, and I hope that next time you are creating a typeface you will be inspired to make an ampersand with attitude.
About the author Link
Huw Wilkins is the lead creative for a digital agency. He has a passion for user experience, usability, interfaces and good design. He also has a background in development. His little corner of the web is at huwshimi.com15.
- 1 https://www.smashingmagazine.com/2011/03/how-to-choose-a-typeface/
- 2 https://www.smashingmagazine.com/2014/06/hands-on-sigmund-freud-typeface-making-fonts/
- 3 https://www.smashingmagazine.com/images/ampersands/main-large.gif
- 4 https://www.smashingmagazine.com/images/ampersands/main-large.gif
- 5 http://www.dafont.com/nilland.font
- 6 http://www.dafont.com/bitstream-vera-sans.font
- 7 http://www.abstractfonts.com/search/bpmono
- 8 http://www.kontrapunkt.dk/news/ddprize_typeface_of_the_year_2004#downloads
- 9 http://www.exljbris.com/diavlo.html
- 10 http://www.abstractfonts.com/font/12371
- 11 http://www.abstractfonts.com/font/7083
- 12 http://www.dafont.com/tuffy.font
- 13 http://www.dafont.com/lacuna.font
- 14 http://www.exljbris.com/diavlo.html
- 15 http://huwshimi.com/
Hold on, Tiger! Thank you for reading the article. Did you know that we also publish printed books and run friendly conferences – crafted for pros like you? Like SmashingConf Barcelona, on October 25–26, with smart design patterns and front-end techniques.