Tags: icon

53

sparkline

History of Icons – a visual brief on icon history by FUTURAMO

An illustrated history of digital iconography.

Free Icon Design Guide - Icon Utopia

Here you go: a free book on icon design in three parts, delivered via email.

Your Social Media Fingerprint

Clever! By exploiting the redirect pattern that most social networks use for logging in, and assuming that site’s favicon isn’t stored in a CDN, it’s possible to figure out whether someone is logged into that site.

Hiding inline SVG icons from screen readers | 456 Berea Street

A good reminder from Roger on how to hide images from an SVG sprite from assistive technology (use aria-hidden) and how to expose them (use title elements within the sprite).

Inline SVG spriting and currentColor | Charlotte Jackson, Front-end developer

The currentColor value in CSS comes in very handy when you’ve got an SVG sprite and you want icons to inherit their colour from the surrounding text.

BitCam : The World’s Most Advanced Camera For Your Mini Pocket Computer

A lovely little native app:

The world’s most advanced camera for your mini pocket computer.

View source for added nostalgia/flashbacks.

Oh, and RTFM.

Julie Rubicon

The act of linking to this story is making it true.

“I don’t think there’s any law against this,” I said. How could there be a law against something that’s not possible?

A Semiotic Approach to Designing Interfaces // Speaker Deck

This looks like a terrific presentation from Alla on iconography, semiotics, and communication.

The Hamburger Menu Doesn’t Work - Deep Design

Building on Luke’s research, James outlines the problems with hiding navigation behind a hamburger icon. So, to be clear, the problem isn’t with the icon, so much as the way it is used as a cupboard to shovel all our messy navigation issues into.

A Complete Guide to SVG Fallbacks | CSS-Tricks

An up-to-date round-up of the various techniques available when you want to provide a fallback for SVG.

Hamburger icon: How these three lines mystify most people - BBC News

The controversial hamburger icon goes mainstream with this story on the BBC News site.

It still amazes me that, despite clear data, many designers cling to the belief that the icon by itself is understandable (or that users will “figure it out eventually”). Why the aversion to having a label for the icon?

Thomas Byttebier - The best icon is a text label

A look at the risks of relying on a purely graphical icon for interface actions. When in doubt, label it.

Alien | Typeset In The Future

Typeset In The Future is back with another cracking analysis. This time—following on from 2001 and Moon—we’ve got Alien.

In her final recorded message before hypersleep, Ripley notes that she is the sole survivor of the Nostromo. What she forgets to mention is that she has not once in the past two hours encountered any Eurostile Bold Extended.

Hamburger Fancy: Archive

This Tumblr blog has the grandiose ambition of being “a showcase of the hottest hamburger icons on the web”, but amazingly, they’ve actually succeeded in documenting every single example of a cool hamburger icon.

Robin Rendle › A Visual Lexicon

Some great thoughts in here about web development workflow and communication between designers and developers.

I believe that the solution is made up of a variety of tools that encourage conversation and improve our shared lexicon. Tools such as styleguides, pattern libraries, elemental and modular systems that encourage access not only by developers, but by designers, shareholders and editors as well.

Origins of Common UI Symbols

A lovely little tour of eleven ubiquitous icons.

Bulletproof Accessible Icon Fonts | Filament Group, Inc., Boston, MA

An in-depth look at using icon fonts without any nasty edge-cases ruining your day.

Unify – Unicode support on browsers and devices

Some excellent research for web developers: find out which unicode characters have the widest support—release useful for choosing icons.

NSA-Proof Your Email! Consider your Man Card Re-Issued. Never be Afraid Again.

We shouldn’t be protecting ourselves. We should be protecting each other.

Using icon fonts

A handy walkthrough of using icon fonts. The examples here use the excellent IcoMoon service