Categories
Accessibility Advocacy content copyright creativity CSS Design development DWWS Fonts Ideas industry links Real type on the web Standards State of the Web Tools Web Design Web Standards webfonts webtype

Web fonts now (how we’re doing with that)

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 ?rst 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[/tags]

Categories
37signals Advocacy business

Customer service, not Ruby on Rails

Among developers, 37signals has achieved a cult following for giving us web applications like Basecamp, Highrise, and Campfire, and the Ruby on Rails platform. But the real secret of their success is as old fashioned as your great grandfather’s Victrola. It’s customer service.

We opened a HighRise account to manage our A List Apart author contacts and then didn’t use the account for whatever reason.

This morning I cancelled my account with two clicks of a button.

The messaging clearly explained that canceling the account would mean losing the contacts, and provided an opportunity to rethink the decision.

When I chose to go ahead with the cancellation, it happened instantly, and I was taken to this page, which reassured me that the account was closed and that I would stop receiving product-related emails. Smart. I was instantly satisfied and had no more questions. How often does that happen when closing, say, a phone or cable or internet account?

The page also offered me the opportunity to try another 37signals product or to provide customer feedback in a survey. If I had quit using the product because of dissatisfaction with it, I would have been able to use the survey to tell 37signals everything I disliked about my experience. If I liked the product but found it wasn’t right for me for whatever reason, I could tell them that (which could help them focus on their core audience’s needs).

All smart, businesslike, and yet inoffensive and un-pushy.

37signals not only constantly fine-tunes their products, they also think about the customer experience even when the customer is leaving.

I find that instructive, educational, and inspiring.

Disclaimer: Jason Fried is my friend, and I do business with 37signals through The Deck advertising network, so I’m not impartial. Just impressed.

Categories
A List Apart Advocacy art direction business CSS Design development Fonts Happy Cog™ HTML Ideas industry Interviews Layout Publications Publishing Standards State of the Web Typography Usability User Experience UX Web Design Web Standards Working XHTML

ALA 282: Life After Georgia

In Issue No. 282 of A List Apart, For People Who Make Websites:

  • Can we finally get real type on the web?
  • Does beauty in design have a benefit besides aesthetic pleasure?

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

by DAVID BERLOW, JEFFREY ZELDMAN

Is there life after Georgia? We ask David Berlow, co-founder of The Font Bureau, Inc, and the ?rst TrueType type designer, how type designers and web designers can work together to resolve licensing and technology issues that stand between us and real fonts on the web.

In Defense of Eye Candy

by STEPHEN P. ANDERSON

Research proves attractive things work better. How we think cannot be separated from how we feel. The next time a boss, client, or co-worker scoffs at the notion that beauty is an important aspect of interface design, point their peepers here.

A List Apart explores the design, development, and meaning of web content, with a special focus on web standards and best practices.

[tags]alistapart, type, typography, realtype, truetype, CSS, beauty, design, aesthetics[/tags]

Categories
A List Apart Advocacy An Event Apart business Design jobs Survey work Working

ALA Survey Findings Up!

The annual A List Apart survey for people who make websites is the only public source of data on the shifting salaries, titles, job skills, and work satisfactions of full- and part-time, staff and freelance web professionals.

This year’s survey findings, culled from answers provided by over 30,000 ALA readers, are now up for your pleasure on a specially designed website. We’ve sliced and diced the data, making sense of complex interrelationships, and displaying the results in miniature CSS masterworks by Mr Eric Meyer. (More about the CSS.)

This year’s findings paint a clearer picture of the distinctions between full-time and freelance web professionals: how you work, what you earn, and what you love about the job. Interestingly, too, despite the brutality of a global recession that was already in full swing when we offered the survey, most respondents revealed a surprisingly high level of job security, satisfaction, and confidence in the future.

See for yourself. Read the findings.

Comments off. Please comment on ALA.

[tags]alistapart, aneventapart, webdesignsurvey, survey, forpeoplewhomakewebsites, surveyfindings, findings, meyerweb, css, jobskills, titles, webdesign, webdesigners, webdevelopment, webdevelopers, IA, UX, editors, writers, webmasters[/tags]

Categories
A List Apart Accessibility Advocacy An Event Apart Appearances art direction creativity CSS Design development events experience Web Design Web Standards Zeldman

Your Guide to An Event Apart Boston

The complete schedule for An Event Apart Boston is now online for your reading pleasure.

Join Eric Meyer and your humble host with truly special guest speakers Jason Santa Maria, Jeremy Keith, Joshua Porter, Whitney Hess, Dan Cederholm, Daniel Mall, Derek Featherstone, Aarron Walter, Scott Thomas, Heather Champ, Andy Clarke, and GoodBarry’s Brett Welch for two days of design, code, and content.

An intensely educational two-day conference for passionate practitioners of standards-based web design, An Event Apart brings together thirteen of the leading minds in web design for two days of non-stop inspiration and enlightenment. If you care about code as well as content, usability as well as design, this is the one you’ve been waiting for.

Educational discounts and group rates are available, and everyone saves $100 during the early bird registration period.

Comments off.

[tags]aneventapart, AEA, webdesign, conference, webstandards[/tags]

Categories
A List Apart Advocacy Design development Education Publications Publishing

ALA No. 276: Web design education

In Issue No. 276 of A List Apart, for people who make websites:

Elevate Web Design at the University Level

by LESLIE JENSEN-INMAN

Web education is out of date and fragmented. There are good people working hard to change this, but because of the structure of higher education, it will take time. As part of a year-long journey to discover where we are in web education and where we need to go, Leslie Jensen-Inman interviewed 32 web design and development leaders. The consensus: technology moves too fast for college and university curricula to keep up. How, then, can educators create a sustainable foundation for the future?

Brighter Horizons for Web Education

by AARRON WALTER

No industry can sustain itself if it doesn’t master the art of cultivating new talent—an art that requires close ties between practitioners and educators. Yet web design education consists mainly of introductory Flash classes and the occasional 90s-style HTML table layout tutorial. How drastic is the web design education gap, and what can be done to close it? Designer, developer, and web design educator Aarron Walter of The Web Standards Project surveys the state of the curricula.

[tags]webdesign, education[/tags]

Categories
A List Apart Accessibility Advocacy Design HTML5 Markup mobile Standards Web Design Web Standards

ALA 275: Duty Now For The Future

What better way to begin 2009 than by looking at the future of web design? In Issue No. 275 of A List Apart, for people who make websites, we study the promise and problems of HTML 5, and chart a path toward mobile CSS that works.

Return of the Mobile Style Sheet

by DOMINIQUE HAZAËL-MASSIEUX

At least 10% of your visitors access your site over a mobile device. They deserve a good experience (and if you provide one, they’ll keep coming back). Converting your multi-column layout to a single, linear flow is a good start. But mobile devices are not created equal, and their disparate handling of CSS is like 1998 all over again. Please your users and tame their devices with handheld style sheets, CSS media queries, and (where necessary) JavaScript or server-side techniques.

Semantics in HTML 5

by JOHN ALLSOPP

The BBC’s dropping of hCalendar because of accessibility and usability concerns demonstrates that we have pushed the semantic capability of HTML far beyond what it can handle. The need to clearly and unambiguously add rich, meaningful semantics to markup is a driving goal of the HTML 5 project. Yet HTML 5 has two problems: it is not backward compatible because its semantic elements will not work in 75% of our browsers; and it is not forward compatible because its semantics are not extensible. If “making up new elements” isn’t the solution, what is?

[tags]HTML5, mobileCSS, webstandards, alistapart, johnallsopp, W3C, Dominique Hazael-Massieux[/tags]

Categories
Advocacy AIGA Design Web Design Zeldman zeldman.com

Understanding web design, live on video

Now available on streaming video, Jeffrey Zeldman: Understanding Web Design — is a good quality 42:40 capture of my October 25, 2008 presentation at Gain: AIGA Business and Design Conference.

Author and Happy Cog founder Jeffrey Zeldman answers the question: what does a web designer need most? Skills and knowledge of software, of course, but empathy—the ability to think about and empathize with your user—is by far the most important. Good useful education is hard to find, and within companies there is often no departmental standardization. Good graphic design is not the same as good user experience design, he explains. In fact, “good web design is invisible”—it feels simple and authentic because it’s about the character of the content, not the character of the designer.

In addition to the streaming video, a surprisingly accurate PDF transcription is available, along with a downloadable copy of my slides. (The typeface is Joshua Darden’s Jubilat.)

[tags]AIGA, GAIN, Gain:AIGA, Zeldman, design, presentation, video, webdesign[/tags]

Categories
A List Apart Advocacy Applications architecture business Career client services Design development experience Information architecture Standards Tools Usability User Experience UX work Working

ALA No. 273: trad vs. agile

Issue No. 273 of A List Apart, for people who make websites, looks at web design from both sides now:

Flexible Fuel: Educating the Client on IA

by KEITH LAFERRIERE

IA is about selling ideas effectively, designing with accuracy, and working with complex interactivity to guide different types of customers through website experiences. The more your client knows about IA’s processes and deliverables, the likelier the project is to succeed.

Getting Real About Agile Design

by CENNYDD BOWLES

Agile development was made for tough economic times, but does not fit comfortably into the research-heavy, iteration-focused process designers trust to deliver user- and brand-based sites. How can we update our thinking and methods to take advantage of what agile offers?

About the magazine

A List Apart explores the design, development, and meaning of web content, with a special focus on web standards and best practices. Issue No. 273 was edited by Krista Stevens with Erin Kissane and Carolyn Wood; produced by Erin Lynch; art-directed by Jason Santa Maria; illustrated by Kevin Cornell; technical-edited by Aaron Gustafson, Ethan Marcotte, Daniel Mall, and Eric Meyer; and published by Happy Cog.

[tags]agiledevelopment, agiledesign, informationarchitecture, scope, scopecreep, managing, client, expectations, alistapart, forpeoplewhomakewebsites[/tags]

Categories
Advocacy Blogs and Blogging Design writing

Um, don’t blog, or something

In Twitter, Flickr, Facebook Make Blogs Look So 2004, Wired, which ceased to be relevant in 1999, says you shouldn’t write a blog because, um, Calacanis and Scoble.

Uh, wait, the problem is that some comments are not thoughtful. And I guess you can’t turn off comments in blogging software (except in all the blogging platforms that are already out there in the marketplace). But all those many long-established blogging platforms aside, I guess, like maybe in some new as-yet unreleased blogging tool, you might not be able to turn comments off. And then you’d have to, like, endure that some comments might not be thoughtful. So clearly you should just use Twitter and not write a blog because people can’t respond to you on Twitter. (What? They can?)

Well maybe the reason you’re not supposed to blog is that you won’t get rich blogging, because Calacanis did, so I guess he used up all the rich. Sorry, no more rich to go around. I mean, what’s the point of expressing yourself if there is no immediate rich to be had?

In conclusion, Twitter, Flickr, Calacanis and Scoble. Which proves you can’t have a blog and also use Twitter. Or maybe you can have a blog and use Twitter but you shouldn’t because comments, Scoble, rich.

Paul Boutin is usually a good writer. I’m not sure what happened here. Paul, when do we stop talking about web content exclusively in terms of narrow platforms and shallow, self-interested goals? When do we stop saying x makes y irrelevant? When do we stop reducing the web to a vulgar and trivial competition between head boys, and start appreciating it as a maturing medium for real thought and expression?

Obviously, not today in Wired.

[tags]journalism, opinion, idiocy, wired, blogs, blogging[/tags]

Categories
Advocacy AIGA events New York City NYC Web Design Zeldman

Come up and see me

So it turns out I’ll be speaking about web design this Saturday at the sold-out AIGA Gain Conference. Yes, that conference.

[tags]AIGA, GAIN, events, speaking, design, business, conference[/tags]

Categories
Advocacy business Community democracy dreams engagement Happy Cog™ homeownership New York City NYC Philadelphia poverty war, peace, and justice work

Housing Works launch

We call ourselves web designers, but sometimes we are more than that. Sometimes we get to participate, in however small a way, in something much larger and more important than ourselves.

Started in 1990 by four members of ACT UP, Housing Works helps people who are homeless and have HIV or AIDS. Housing Works not only saves lives, it restores dignity, purpose, and hope to those whom society has cast aside. Happy Cog is honored and humbled to have worked with this amazing organization and to announce the relaunch of the Housing Works website, redesigned by Happy Cog.

Our thanks to Housing Works’s Christopher Sealey and his team—we bow endlessly in your direction, sir. And my thanks and commendation to the amazing people at Happy Cog who did the work:

[tags]Housing Works, AIDS, HIV, homeless, homelessness, advocacy, hope, happycog, work[/tags]

%d bloggers like this: