Book By Its Cover is a glorious new blog devoted to the beauty of books.

André Gonçalves is a graphic designer and this is his website. ♥

• The Ultimate Hipster Irony http://bigthink.com/ideas/18758
• Why You Can’t Work at Work | Jason Fried | Big Think: http://bigthink.com/ideas/18522
• Seeing too many ultra-minimal/undesigned blogs labeled “beautiful” cuz they use a @typekit font or two. Uh-uh.
• I love what @typekit is doing for the web, how it’s shaping the agenda *and* delivering the needed tools.
• In other news, I’ve come up with a title for my book of short stories. KAFKA FOR BEGINNERS.
• Selection pseudo-element. Choose text color/BG color when user selects text! Try it at http://bit.ly/9sjnai . (Not supported in IE).
• “IRS bomber Joe Stack captured the news for days, but his African American, Vietnam vet victim has gone unheralded” http://j.mp/a9U12B
• Must-read column, NYTimes: I Cost More, but I’m a Specialist http://s.nyt.com/u/Byb
• It’s probably a good thing that I didn’t get that XHTML2 tattoo. Probably.
• I just received a lovely “Happy New Year” card from the W3C. Repeat, I just received it.
• Watch Happy Cog’aoke 2 / Lesson Two: Solo-tunities on Vimeo! http://vimeo.com/9556324

Follow me on Twitter: @zeldman

m.nicewebtype.com is a light yet essential mobile site for people who design websites, love type, and struggle to keep up with the dizzying world of web fonts. In it, Tim Brown, author of Nice Web Type, creator of Web Font Specimen (what’s that?), and latterly type manager for Typekit, curates the Design Twitterverse to share the latest insights, innovations, quips, and controversies regarding everyone’s favorite new web design fetish.

Don’t leave home without it.

Dan Benjamin, creator of wonderful websites, apps, broadcasts, and platforms and longtime friend of A List Apart and your host, introduces a new venture.

5 by 5 Studios is a new internet broadcasting network, home to shows like EE Podcast, Tack Sharp, The Dev Show, The Ruby Show, and Utility Belt, releasing new episodes every week.

As part of the launch, 5 by 5 announces two new shows hosted by Dan:

• The Pipeline, an interview show talking with designers, developers, writers, and entrepreneurs, brought to you by Campaign Monitor. Upcoming guests include Kottke, Storey,Vaynerchuk, Coudal, Mann, and Siracusa.
• The Conversation, brought to you by Shopify, is a live-streamed talk show featuring topical discussions, reviews, special guests, news with Christina Warren from Mashable, and your calls, all live.

NOTE: I’m pleased as punch to be the first Pipeline guest. Come hear us on Friday, January 29th, 2010.

It’s the Fonty-Fresh™ thang! UPDATE: Now with further explanations and Mr Zeldman’s specific concerns for web designers, web users, and the future of type on the web.

• If real fonts on the web are of interest to you (and if they aren’t, why are you here?), you’ll enjoy Tim Brown’s iPhone-friendly summary of recent web type events, tests, and opinions. Of special note in that list of juicy goodness is Font Squirrel’s tweet about the difficulty of getting fonts to render well in Windows. I will have something to say on that topic soon. (Preview: Real fonts look bad in Windows.)
• UPDATE: From reader Ben Kiel of House Industries, here is more than you wanted to know about why the same fonts look different on different platforms and browsers, i.e. why fonts look bad in Windows.
• FontShop’s Flickr set ScreenFonts BeNeLux looks at the typefaces on posters for new movies released in Belgium and The Netherlands. It is a companion to the international ScreenFonts on The FontFeed, FontShop’s monthly review of movie poster typography.
• ilovetypography’s Sex, lies, & type explores much of last week’s font news, including the introduction of Mr Eaves, and one’s own discovery of the Film posters typeset in Trajan pool at Flickr.com.

Short URL: zeldman.com/?p=2782

1. http://webtrendmap.com/ by IA Inc. is farking amazing and beautiful. Congratulations, @iA.
2. OH: “Type means the letters.”
3. http://www.biggestapple.net/ is an exquisite new blog by a Wodehouse fan and non-designer (but you’d never know).
4. My 5-year-old just spent 10 minutes showing me the correct way to massage her foot. My little girl is becoming a woman.
5. HTML5 Super Friends declaration of support: http://www.zeldman.com/superfriends/
6. In the park with the kid and friends, watching the sunlit hours melt away. It is the mellow end of summer and our bodies know it.
7. http://bit.ly/InfXh Installing Snow Leopard: What you need to know. Fewer options make for simpler installation.
8. The difference between marriage and divorce is, in divorce, the person who’ll never have sex with you again has her own apartment.
9. “HTML 5 and me” by Jeremy Keith: http://bit.ly/sOqt7
10. Dreamed about Mackenzie Phillips and woke up with a $500 a day habit.
11. RT @leeclowsbeard Every client wants something new. And three examples of where it’s worked before. (via @Coudal)
12. #twitterwit is now in bookstores. It’s an honor to have my work appear in the same volume as real writers like Ashton Kucher.
13. Laura Dern’s hair is the scariest thing in Blue Velvet.
14. @sourjayne At a certain level, you don’t write a resume, you write a paragraph.
15. @sourjayne A multi-page resume suggests you’re narcissistic or inexperienced. These are not desired qualities in an employee.
16. @sourjayne A 1-page resume shows you’re aware the person reading it has no time to waste — proving you’re experienced + have people skills.
17. Actually, Barnes & Noble, I think I’ll save *100%* on Dan Brown’s follow-up to The Da Vinci Code.

Have another?

ShortURL: zeldman.com/?p=2554

Designed by Happy Cog and launched today, The Amanda Project is a social media network, creative writing project, interactive game, and book series combined:

The Amanda Project is the story of Amanda Valentino, told through an interactive website and book series for readers aged 13 & up. On the website, readers are invited to become a part of the story as they help the main characters search for Amanda.

The writing-focused social media network is designed and written as if by characters from the Amanda novels, and encourages readers to enter the novel’s world by joining the search for Amanda, following clues and reading passages that exist only online, and ultimately helping to shape the course of the Amanda narrative across eight novels. (The first Amanda novel—Invisible I, written by Melissa Kantor—comes out 22 September.)

The site developed over a year of intense creative collaboration between Happy Cog and Fourth Story Media, a book publisher and new media company spearheaded by publishing whiz Lisa Holton. Prior to starting Fourth Story, Lisa was was President, Scholastic Trade Publishing and Book Fairs; managed the publication of Harry Potter and the Deathly Hallows; and oversaw development of The 39 Clues. Before that she spent nearly a decade developing numerous bestselling, franchise-launching series at Disney.

Happy Cog’s New York office developed this project. The team:

• Aaron Gustafson, front-end development (blog, articles, Twitter)
• Liz, Danzico, user experience (blog, MFA program, Twitter)
• Matthew Goldenberg, project management
• Whitney Hess, user experience (blog, Twitter)
• Erin Kissane, content strategy (articles, blog, Twitter)
• Kelly McCarthy, project manager
• Jason Santa Maria, design (website, Twitter)
• Jeffrey Zeldman, creative director

Equally vital to the project’s success were Fourth Story’s leaders and partners, including:

• Lorraine Shanley, Principal Advisor
• Ariel Aberg-Riger (website, Twitter), Creative Development & Marketing Manager
• JillEllyn Riley, Editorial Director
• Dale Robbins, Creative Director
• David Stack, Director, Digital Partnerships
• Melissa Kantor, Writer
• Peter Silsbee, Writer
• Polly Kanevsky, Art Director
• Sam Gerstenzang, Technology Consultant

Today’s launch is not the end of our relationship with Fourth Story Media. The Amanda Project will continue to evolve, and Happy Cog will remain an active partner in its direction and growth. We thank our brilliant collaborators and congratulate them on today’s milestone.

Read more

• Blissbat.net: The Amanda Project Wants You

Tags: amanda, amandaproject, theamandaproject, TAP, happycog, design, webdesign, contentstrategy, userexperience, publishing, books, aarongustafson, lizdanzico, erinkissane, whitneyhess, mattgoldenberg, kellymccarthy, jasonsantamaria, jeffreyzeldman, lisaholton, dalerobbins, davidstack, JillEllynRiley, ArielAberg-Riger

The earliest websites were minimal in the extreme, but without the style and flair to make a virtue of their simplicity. 37signals and Kottke pioneered the combination of simplicity with deft design sense. Cardigan made it art.

Although it is never popular, never the dominant trend, rarely wins design awards, and almost never earns acclaim from designers, design stripped down to its essentials is always a good idea, and especially on the web, where every byte counts. We salute the old and new practitioners of minimalist web design, and solicit your thoughts on pioneers or present practitioners who combine a minimalist aesthetic with significant design chops.

• 37signals home page, 27 November 1999
• 37signals detail page (first signal), 27 November 1999
• Kottke.org, home of fine hypertext products, 9 March 2000
• Kottke.org, home of fine hypertext products today
• Drudge Report, 10 December 1997
• Drudge Retort
• cardigan.com by Dean Allen (abandoned 2001)
• Wilson Miner
• Subtraction.com by Khoi Vinh
• WordPress Neutica theme designed by Allan Cole (Hat tip: Oliver Lorton)

Tags: design, webdesign, minimalism, history, web design history

The html5 gallery is a showcase of sites using HTML 5 markup.

html5 gallery has two primary aims, the first is to showcase sites that use html5 for markup, so that we can see how people have interpret[t]ed the specification and how they’ve implemented it. This leads me on to the secondary aim which is to help people learn about html5 and how it should be used and how to implement it.

I’m hoping that a side effect of this is that browser developers will see how many people are implementing html5 and add more support for it in their rendering engines so that we don’t have to add display:block; to elements where not required and we don’t have to rely on javscript to create elements.

You can follow @htmlgallery to get updates when new sites are added to the gallery.

Richard Clark, a front end designer based in Manchester, UK, created and maintains the site. You can follow Richard on Twitter.

The Web Fonts Wiki has a page listing fonts you can legally embed in your site designs using the CSS standard @font-face method. Just as importantly, the wiki maintains a page showing commercial foundries that allow @font-face embedding. Between these two wiki pages, you may find just the font you need for your next design (even if you can’t currently license classics like Adobe Garamond or ITC Franklin and Clarendon).

The advantages of using fonts other than Times, Arial, Georgia, and Verdana have long been obvious to designers; it’s why web design in the 1990s was divided between pages done in Flash, and HTML pages containing pictures of fonts—a practice that still, bizarrely, continues even in occasionally otherwise advanced recent sites.

Using real fonts instead of pictures of fonts or outlines of fonts provides speed and accessibility advantages.

Currently the Webkit-based Apple Safari browser supports @font-face. The soon-to-be-released next versions of Opera Software’s Opera browser, Google’s Webkit-based Chrome, and Mozilla Firefox will do likewise. When I say “soon-to-be-released,” I mean any day now. When this occurs, all browsers except IE will support @font-face.

IE has, however, offered font embedding since IE4 via Embedded OpenType (.EOT), a font format that enables real fonts to be temporarily embedded in web pages. That is, the reader sees the font while reading the page, but cannot download (“steal”) the font afterwards. Microsoft has “grant[ed] to the W3C a perpetual, nonexclusive, royalty-free, world-wide right and license under any Microsoft copyrights on this contribution, to copy, publish and distribute the contribution under the W3C document licenses,” in hopes that EOT would thereby become a standard. But so far, only Microsoft’s own browsers support EOT.

Thus, as we consider integrating real fonts into our designs, we must navigate between browsers that support @font-face now (Safari), those that will do so soon (Opera, Chrome, Firefox), and the one that possibly never will (IE, with a dwindling but still overwhelming market share).

The person who figures out a designer-friendly solution to all this will either be hailed as a hero/heroine or get rich. Meanwhile, near-complete solutions of varying implementation difficulty exist. Read on:

CSS @ Ten: The Next Big Thing

“Instead of making pictures of fonts, the actual font files can be linked to and retrieved from the web. This way, designers can use TrueType fonts without having to freeze the text as background images.” An introduction to @font-face by Håkon Wium Lie, father of CSS.

Real Fonts on the Web: An Interview with The Font Bureau’s David Berlow

Is there life after Georgia? To understand issues surrounding web fonts from the type designer’s perspective, I interview David Berlow, co-founder of The Font Bureau, Inc, and the first TrueType type designer.

The W3C: @font-face vs. EOT

A discussion that shows why the W3C may not be able to resolve this conflict. (It’s kind of like asking the Montagues and Capulets to decide whether the Montagues or the Capulets should rule Verona.)

sIFR 2.0: Rich Accessible Typography for the Masses

Mike Davidson’s scalable and accessible remix of Shaun Inman’s pioneering use of Flash and JavaScript to replace short passages of HTML text with Flash movies of the same text set in a real font. The Flash movies are created on the fly. If JavaScript or images are turned off, the user “sees” the HTML text; text set in sIFR can also be copied and pasted. sIFR was a great initial solution to the problem of real fonts on the web, but it’s only for short passages (which means the rest of the page must still be set in Georgia or Verdana), and it fails if the user has a Flash block plug-in installed, as half of Firefox users seem to. It’s also always a pain to implement. I don’t know any designer or developer who has an easy time setting up sIFR. In short, while sIFR is an awesome stop-gap, real fonts on the web are still what’s needed. Which also leads us to…

Cufón – Fonts for the People

Simo Kinnunen’s method of embedding fonts, regardless of whether or not a browser supports @font-face.

Combining Cufón And @Font-Face

Kilian Valkhof: “Everyone wants @font-face to work everywhere, but as it stands, it only works in Safari and the upcoming versions of Firefox and Opera. In this article I’ll show you how to use Cufón only if we can’t load the font through other, faster methods.”

Adobe, Web Fonts, and EOT

Why Adobe supports Microsoft’s EOT instead of @font-face.

Introducing Typekit

Update May 28, 2009: Working with Jason Santa Maria, Jeff Veen’s company Small Batch Inc. introduces Typekit:

We’ve been working with foundries to develop a consistent web-only font linking license. We’ve built a technology platform that lets us to host both free and commercial fonts in a way that is incredibly fast, smoothes out differences in how browsers handle type, and offers the level of protection that type designers need without resorting to annoying and ineffective DRM.

Read more

• Web Fonts, HTML 5 Roundup: Worthwhile reading on the hot new web font proposals, and on HTML 5/CSS 3 basics, plus a demo of advanced HTML 5 trickery. — 20 July 2009
• Web Fonts Now, for real: David Berlow of The Font Bureau has proposed a Permissions Table for OpenType that can be implemented immediately to turn raw fonts into web fonts without any wrappers or other nonsense. If adopted, it will enable type designers to license their work for web use, and web designers to create pages that use real fonts via the CSS @font-face standard. — 16 July 2009

Tags: fonts, webfonts, webdesign, embed, @font-face, EOT, wiki, css, layout, safari, opera, firefox, chrome, browsers

Joshua Schachter explains how URL shorteners like TinyURL, bit.ly, etc., originally created to prevent long URLs from breaking in 1990s e-mail clients, and now used primarily as a means of monetizing someone else’s content, are bad:

• They “add another layer of indirection to an already creaky system, [making what] used to be transparent … opaque,” slowing down web use by adding needless lookups, and potentially disguising spam.
• Shorteners “steal search juice” from the original publishers. (For example, with the Digg bar and Digg short URL, your content makes Digg more valuable and your site less valuable; the more content you create, the richer you make Digg.)
• “A new and potentially unreliable middleman now sits between the link and its destination. And the long-term archivability of the hyperlink now depends on the health of a third party.”

And more. Via Merlin Mann.

Anyone who creates web content should read Joshua’s post. I’m sold and will dial way back on my use of the zeldman.com short URL. The question remains, what to do when you need to paste a long, cumbersome link into a 140-character service like Twitter. (If you do nothing, Twitter itself will shorten the link via TinyURL.)

Tags: URL, URLshortener, JoshuaSchachter, redirect, abstraction, Digg, findability, searchjuice, SEO

DanielByrne [warning! Flash site with JavaScript auto-expand full-screen window] came to Happy Cog’s New York office to shoot me for an upcoming feature story in .Net Magazine, “the UK’s leading magazine for web designers and developers.”

What can I say? I’m a sucker for the gentle touch of a make-up pad. Or of anything, really. I love this photo (shot by Byrne with my iPhone) because it captures the fact that I’m still really a four-year-old. It also shows what a genuine photographer can do with even the humblest of tools.

Tags: photos, photography, shoot, danielbyrne, photographer, zeldman, jeffreyzeldman, profile, bio, interview, .net, .netmag, .netmagazine, .netmagazineUK, myglamorouslife, iphone, candid, shoots, shots, Apple

Favorites of the afternoon of April 10, 2009. Part of this complete breakfast.

Tags: flickr, favorites, art, photography, images, image, collections

Seed Magazine has received a killer redesign courtesy of Mike Pick and Tim Murtaugh.

And, except for the custom Flash-based video players, it’s all web-standards-based. CSS, XHTML, and JavaScript were never so hawt. Click on STUDIO in the nav bar, then explore SALON or SAVED BY SCIENCE to experience the new hotness.

Tags: tim murtaugh, mike pick, seed, seedmagazine