HTML for Icon Font Usage

Chris Coyier on an accessible implementation for icon fonts:

Where are we at right now in terms of the best markup for using icon fonts? Let’s cover some options I think are currently the best. [...]

And our major goals here are:

  1. As good of semantics as we can get
  2. As little awkwardness for screen readers as possible

Spoiler: the key is to map the icons to the Private Use Area instead of “real” characters in the font files and injecting them with pseudo elements.

I’m using Font Awesome on this site which comes with icons mapped to PUA, so everything should be good for screen readers. Only concern to me are the quite ineffective CSS selectors like [class*=" icon-"] but this makes it nicely flexible.

Go to source ∞

Responsive Images and Web Standards at the Turning Point

Good overview about the patterns currently being discussed:

Recently, all of the ongoing discussion around responsive images just got real: a solution is currently being discussed with the WHATWG. And we’re in the thick of it now: we’re throwing around references to picture and img set; [...]

The markup pattern that gets selected stands to have a tremendous influence on how developers build websites in the future. Not just responsive or adaptive websites, either. All websites.

Naturally I’m in the picture camp, this just makes most sense to me.

Go to source ∞

How Yahoo Killed Flickr and Lost the Internet

Great insight article into what and how exactly Yahoo managed to screw this up.

It is a case study of what can go wrong when a nimble, innovative startup gets gobbled up by a behemoth that doesn’t share its values. What happened to Flickr? The same thing that happened to so many other nimble, innovative startups who sold out for dollars and bandwidth: Yahoo.

As a year long Flickr user I’m just sad about this but hey, we got 500px which probably wouldn’t exist without Flickr’s decline.

Go to source ∞

Why Comic Sans?

The creator of Comic Sans, Vincent Connare, revealing the irony of it:

Comic Sans was NOT designed as a typeface but as a solution to a problem with the often overlooked part of a computer program’s interface, the typeface used to communicate the message.

There was no intention to include the font in other applications other than those designed for children when I designed Comic Sans. The inspiration came at the shock of seeing Times New Roman used in an inappropriate way.

He also has this presentation dubbed I hate Comic Sans (pdf)

Go to source ∞

Nielsen vs Clark – they’re both wrong

Great middle ground arguments from Jason Mark in this recent controversy about mobile web experiences:

The truth is when working on mobile you should always look at the site analytics and make smart decisions based on what you find. If you find that your mobile users use the site in a significantly different way than desktop users, check out Nielsen’s guidelines and see which apply to you. And if you find that your mobile users are accessing the same content as desktop users then consider a responsive design.

Go to source ∞