On this page, we present some of the best articles from Smashing Magazine’s archives which are promoted in the sidebar and updated monthly. These are the articles that you probably haven’t stumbled upon yet, but might find useful or interesting.
Please stay tuned for more Smashing Highlights next month. Thanks for dropping by!
- Design Process In The Responsive Age1
An insightful look into an evolving design process that Drew Clemens has been using with some promising new deliverables and tools. This should provide a starting point for you to freshen up your own process and bring it into the responsive age.
- iCandies: Free Icons For Your User Interfaces and Apps2
60 high quality icons that provide crisp, attractive visuals for your modern and fashionable-looking interfaces. Available in 64×64px, 48×48px and 32×32px (.EPS, .AI and .PNG).
- Applying Macrotypography For A More Readable Web Page3
This article focuses mostly on a few simple macrotypographic techniques—with a dash of micro—and on how to combine them all to build a more harmonious, adaptable and, most importantly, readable Web page.
- Free Food and Cakes Icon Set (20 Icons)4
A set with 20 beautiful, original and sweet icons in resolutions 48×48px – 128×128px and formats .png, .ico, .incs and .tif. Also, the vector source (.eps) is available for free download as well.
- The Z-Index CSS Property: A Comprehensive Look5
z-indexhas undoubtedly caused as much confusion and frustration as any other CSS property. Ironically, however, when
z-indexis fully understood, it is a very easy property to use, and offers an effective method for overcoming many layout challenges.
- Lessons From Swiss Style Graphic Design6
Also known as International Style, the Swiss Style does not simply describe a style of graphic design made in Switzerland. It became famous through the art of very talented Swiss graphic designers, but it emerged in Russia, Germany and Netherlands in the 1920’s.
- Web Form Design Patterns: Sign-Up Forms7
If you want to maximize the revenue of your service, you need to maximize completion rates of your web forms. We present findings from an analysis of 100 popular websites where Web forms (should) matter.
- How To Market Your Mobile Application8
App Store is a competitive environment. Against more than 140,000 apps, all screaming for attention, how do you make sure your app gets its time in the spotlight? How do you get people to talk about your app?
- All About Unicode, UTF8 & Character Sets9
Find out about the history of characters, character sets, Unicode and UTF-8, and why question marks and odd accented characters sometimes show up in databases and text files.
- Free PNG Credit Cards and Payment Icon Set (18 Icons)10
The icons are intended to be used on e-commerce websites where you can show what types of payment the shop accepts. The set is free to use in private and commercial projects — no credit is required.
- Introduction To The Command Line11
Why would anyone want to bother with these text commands when you can use the mouse instead? The main reason is that they are very useful for controlling remote computers on which a GUI is not available, particularly Web servers.
- Form-Field Validation UX: The Errors-Only Approach12
We thought of a validation technique better suited to complex data. What if we removed all validated fields on the error page that reloads? What if we displayed only those fields that failed validation?
- How To Provide Technical Support13
Whether your product is an open-source script, a Web application or a downloadable product, you will need to provide some form of technical support.
- Towards A Retina Web14
The third-generation iPad showed us how fuzzy our Web graphics are. Realize the challenges and constraints of designing for multiple display densities.
- Mastering Photoshop With Paths15
Anomalously residing within the pixel-gridded world of Photoshop are a series of tools waiting to break out of the canvas’ inherent squareness.
- “But The Client Wants IE 6 Support!”16
The developers are stuck with the same Web development techniques that we used five to ten years ago. Their clients just don’t “get” graceful degradation. How can we solve this problem?
- The Story Of Scandinavian Design17
While the countries of Scandinavia have extreme differences, they do have some similarities. This article gives an overview of the influences and state of art and design in the Nordic countries.
- Showcase of Interesting Navigation Designs18
Everyone is always looking for interesting and effective ways to organize their website, but there’s a fine line between unexpected and unusable. Here are some unusual navigation design examples.
- CSS3 vs. CSS: A Speed Benchmark (April 2011)19
As a single use case experiment, I decided to design and code a Web page and add visual enhancements twice: once with CSS3, and a second time using background images sliced directly from the PSD. I timed myself each round that I added the enhancements, and when finished, I used Pingdom to measure the loading times.
- Web Designer, Be Your Best Promoter (October 2011)20
Have you ever had someone flirt with you and they did nothing but demean themselves the whole time? Did that make you attracted to them? Doubtful. Yet, this is how so many individuals seem to handle their business today.
- Free PNG Credit Card, Debit Card and Payment Icons Set (18 Icons)21
The icons are intended to be used on e-commerce websites where you can show what types of payment the shop accepts. Each icon comes in curved and straight edge variations. As usual, the set is free to use in private and commercial projects — no credit is required.
- New High-Quality Free Fonts (January 2012)22
Every now and then, we look around, select fresh free high-quality fonts and present them to you in a brief overview. In this selection, we’re pleased to present Tondu, Banda, Morning Glory, Matilde, Bohema, Weston Round Slab, Highlands, Cabin, Linden Hill and other fonts.
- Eight Inspiring Stories Of ASCII Art23
Labels are fragile: text and pictures have always been closely connected. From the dawn of written language to the era of microcomputers, much of human creation has explored the relationship between the literal and the figurative, the form and the function.
- Portfolio Design Study: Design Patterns and Current Practices24
We have carefully selected 55 design agencies and Web development agencies, analyzed their portfolio websites and identified popular design patterns. The main goal of the study was to provide freelancers and design agencies with useful pointers for designing their own portfolio.
- Technical Web Typography: Guidelines And Techniques25
Creative typography involves making design decisions such as which face to use, what mood the type should create, how it should be set, or even what tone it should have. These decisions must be made on a per-project basis.
- Time-Saving Tips To Improve Designer’s Workflow26
You’re probably always looking for ways to do this faster and make that easier— it’s human nature. One of the best ways to save time is experience. Always stay dedicated at what you do and you’ll definitely save more than “just” time!
- Useful Techniques To Improve Your UI Designs27
Web design consists, for the most part, of interface design. There are many techniques involved in crafting beautiful and functional interfaces. Just be sure not to use a technique just because it exists — use it if it makes sense in your context.
- Writing Systems And Calligraphy Of The World28
Pick any language you like: Arabic, Chinese, Japanese, maybe Nepali? Each is based on a different writing system, which makes it interesting to figure out how they work. Learn how to draw inspiration and apply it to your own typography work.
- Free Typographic XHTML/CSS-Layouts For Your Designs29
Some brilliant typographic templates designed by our fantastic Web design community. Feel free to take a look at all the wonderful templates – we hope that they’ll help you improve the quality of typography in your future designs!
- Designing and Producing Creative Business Cards30
Plenty of creative business card showcases are available out there. This guide is meant to help you decide which technique is right for you, how to correctly prepare the files and what to look for in a printer when creating your own business card.
- The Art and Science of the Email Signature31
It’s a shame how often email signatures are done poorly nowadays. Many people want their signature to reflect their personality, provide pertinent information and more, but they can easily go overboard.
- Clever PNG Optimization Techniques32
This article provides you with a good number of useful techniques that will help you optimize your PNG-images. The techniques are derived from laborious hours spent on studying how exactly the PNG encoder saves data.
Be sure to check out this post! Here you will find some really valuable tools that will help you save your precious time, automate mundane tasks and hence help you focus on more important things.
- Designing and Building Email Newsletters34
This article gives you the information you need to plan, design and build good HTML newsletters. It’s a quick and dirty guide to effective email newsletters.
- Powerful New CSS Techniques and Tools35
A comprehensive overview of useful CSS techniques and tools released in early 2011. The round-up covers both tutorials and learning resources for beginners and professionals.
- Bizarre and Weird Websites36
- Designing Style Guidelines For Brands And Websites37
A website is never done. Everyone has worked on a project that changed so much after it launched that they no longer wanted it in their portfolio. One way to help those who take over your projects is to produce a style guide.
- The Evolution Of The Logo38
Logo design has been a controversial subject in the design press lately. One branding professional recently claimed that logo design is not that hard to do and another said that logos are dead; some rebutted while others concurred. Why all the fuss?
- Optimizing Error Pages: Creating Opportunities Out of Mistakes39
In this article, we’ll review a few techniques that will help Web designers and UI professionals improve their error pages in order to engage visitors and improve the experience. As C.S. Lewis said, “Failures are finger posts on the road to achievement.” Website designers should take this to heart.
- 1 https://www.smashingmagazine.com/2012/05/30/design-process-responsive-age/
- 2 https://www.smashingmagazine.com/2010/09/01/icandies-icon-set-60-free-icons-your-user-interfaces-and-apps/
- 3 https://www.smashingmagazine.com/2012/05/02/applying-macrotypography-for-readable-web-page/
- 4 https://www.smashingmagazine.com/2009/12/24/yummy-a-free-tasty-icon-set/
- 5 https://www.smashingmagazine.com/2009/09/15/the-z-index-css-property-a-comprehensive-look/
- 6 https://www.smashingmagazine.com/2009/07/17/lessons-from-swiss-style-graphic-design/
- 7 https://www.smashingmagazine.com/2008/07/04/web-form-design-patterns-sign-up-forms/
- 8 http://mobile.smashingmagazine.com/2010/03/03/how-to-market-your-mobile-app/
- 9 https://www.smashingmagazine.com/2012/06/06/all-about-unicode-utf8-character-sets/
- 10 https://www.smashingmagazine.com/2010/10/21/free-png-credit-card-debit-card-and-payment-icons-set-18-icons/
- 11 https://www.smashingmagazine.com/2012/01/23/introduction-to-linux-commands/
- 12 https://www.smashingmagazine.com/2012/06/27/form-field-validation-errors-only-approach/
- 13 https://www.smashingmagazine.com/2011/10/10/supporting-product-providing-technical-support/
- 14 https://www.smashingmagazine.com/2012/08/20/towards-retina-web/
- 15 https://www.smashingmagazine.com/2009/08/18/mastering-photoshop-with-paths/
- 16 https://www.smashingmagazine.com/2011/11/but-the-client-wants-ie-6-support/
- 17 https://www.smashingmagazine.com/2011/06/13/the-story-of-scandinavian-design-combining-function-and-aesthetics/
- 18 https://www.smashingmagazine.com/2010/09/07/showcase-of-interesting-navigation-designs/
- 19 https://www.smashingmagazine.com/2011/04/21/css3-vs-css-a-speed-benchmark/
- 20 https://www.smashingmagazine.com/2011/10/21/web-designer-be-your-best-promoter/
- 21 https://www.smashingmagazine.com/2010/10/21/free-png-credit-card-debit-card-and-payment-icons-set-18-icons/
- 22 https://www.smashingmagazine.com/2011/08/02/new-high-quality-free-fonts/
- 23 https://www.smashingmagazine.com/2009/01/24/8-inspiring-highlights-of-ascii-art/
- 24 https://www.smashingmagazine.com/2009/09/17/portfolio-design-study-design-patterns-and-current-practices/
- 25 https://www.smashingmagazine.com/2011/03/14/technical-web-typography-guidelines-and-techniques/
- 26 https://www.smashingmagazine.com/2009/05/26/20-time-saving-tips-to-improve-designers-workflow-part-1/
- 27 https://www.smashingmagazine.com/2008/12/15/10-useful-techniques-to-improve-your-user-interface-designs/
- 28 https://www.smashingmagazine.com/2010/05/18/the-beauty-of-typography-writing-systems-and-calligraphy-of-the-world/
- 31 https://www.smashingmagazine.com/2010/02/04/the-art-and-science-of-the-email-signature/
- 32 https://www.smashingmagazine.com/2009/07/15/clever-png-optimization-techniques/
- 34 https://www.smashingmagazine.com/2010/01/19/design-and-build-an-email-newsletter-without-losing-your-mind/
- 35 https://www.smashingmagazine.com/2011/04/18/powerful-new-css-techniques-and-tools/
- 36 https://www.smashingmagazine.com/2010/05/25/bizarre-websites-on-which-you-can-kill-time-with-style/
- 37 https://www.smashingmagazine.com/2010/07/21/designing-style-guidelines-for-brands-and-websites/
- 38 https://www.smashingmagazine.com/2010/07/06/the-evolution-of-the-logo/
- 39 https://www.smashingmagazine.com/2011/05/18/optimizing-error-pages-creating-opportunities-out-of-mistakes/
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.