Category Archives: Accessibility

Make it work!

Online Training to Make Sites and Apps Accessible

ACCESSIBILITY IS LIKE the weather: everyone talks about it, but not enough of us do anything about it. Austin-based Knowbility is one of the few groups in the world with the commitment and expertise to change this. If enough of us fund their new IndieGogo project, they’ll gain the resources they need to create online modules that teach the world how to make our sites work for people with disabilities. This is a cause any web designer or developer should be able to get behind.

I love the web because it is democratic, agnostic, and empowering. Progressive enhancement, responsive design, and other core components of standards-based web design are all about making sure that the experiences we create online are available to any person, via any browser, on any device. That promise is the heart of web accessibility. It will seem obvious to most folks reading this page that a site that works for all is way better than a site that works only for some.

Yet, for all the sophistication and excitement of modern web design, accessibility remains the least-taught, least-understood, least-cared-about of all our new and classic best practices. Let’s help Knowbility change that. Let’s help them help us, and, by extension, help everyone who uses the web (or tries to).

Please contribute to, and spread the word about, Online Training to Make Sites and Apps Accessible: igg.me/at/knowbility. And please hurry! There are only five days left to make a difference.

A List Apart Issue No. 367: Apple’s Vexing Viewport

In A List Apart Issue No. 367, Peter-Paul Koch, Lyza Danger Gardner, Luke Wroblewski, and Stephanie Rieger explain why Apple’s new iPad Mini creates a vexing situation for designers and developers who create flexible, multi-device experiences.

Each week, new devices appear with varying screen sizes, pixel densities, input types, and more. As developers and designers, we agree to use standards to mark up, style, and program what we create. Browser makers in turn agree to support those standards and set defaults appropriately, so we can hold up our end of the deal. This agreement has never been more important.

That’s why it hurts when a device or browser maker does something that goes against our agreement—especially when they’re a visible and trusted friend of the web like Apple. Read Vexing Viewports and contribute to the discussion.

This issue of the magazine also marks the departure of Jason Santa Maria as creative director after seven years of brilliant design and support.

Jason’s elegant redesign of A List Apart and its brand in 2005, together with the master stroke of bringing in Kevin Cornell as illustrator, brought the magazine new fame, new readers, and new respect. Over seven great years, his attention to detail, lack of pretension, and cheerful, can-do attitude has made working on ALA a pleasure. Jason was also a key member of the strategic team that envisioned ALA’s upcoming content expansion—about which, more will be revealed when the site relaunches in January.

Jason will continue at ALA as a contributing writer and as designer of A Book Apart (“brief books for people who make websites”), of which he is also a co-founder.

An Event Apart Austin 2012

FOLLOW THE ACTION at An Event Apart Austin – three days of design, code, and content for people who make websites, now taking place in Austin, TX.

A Feed Apart

Just the tweets.

Content First

“In his opening keynote at An Event Apart in Austin, TX 2012 Jeffrey Zeldman talked about the need to keep content front and center in websites and the web design process.” Enjoy Luke Wroblewski’s notes on my presentation, “Content First.”

Responsive Design Workflow

“In her presentation at An Event Apart in Austin, TX 2012 Sarah Parmenter talked about the changes responsive web design requires of web designers.” Enjoy Luke Wroblewski’s notes from her talk on “Responsive Design Workflow.”

On Web Typography

Jason Santa Maria “outlined the current state of web fonts and how to approach typography online.” Luke Wroblewski’s notes on the talk.

Mobile To The Future

My notes on Luke Wroblewski’s AEA Austin presentation.

Content Strategy Roadmap

“In her Content Strategy Roadmap presentation at An Event Apart in Austin TX 2012 Kristina Halvorson talked about how to integrate content strategy into a typical web design workflow.” Enjoy Luke Wroblewski’s notes from her talk.

Rolling Up Our Responsive Sleeves

In this presentation, Ethan Marcotte walks through ways to tackle thorny issues in responsive design layouts, media, advertising, and more. Here are Luke Wroblewksi’s notes on the talk.

The Spirit of the Web

“With the explosion of web-enabled devices of all shapes and sizes, the practice of web design and development seems more complex than ever. But if we can learn to see below this overwhelming surface to the underlying web beneath, we can learn to make sites not for specific devices but for the people using them. This presentation will demonstrate how tried and tested principles like REST and progressive enhancement are more important than ever. By embracing the spirit of the web, you can ensure that your websites are backwards compatible and future friendly.” – Jeremy Keith

Bringing A Knife to a Gunfight (1)

All the links from Andy Clarke’s amazing AEA Austin presentation.

Bringing A Knife to a Gunfight (2)

“Andy Clarke talked about the changing processes in web design and shared a number of tools and techniques that can help designers make transition to a more modern workflow.” Luke Wroblewski’s notes from the talk.

The Real Me (1)

At An Event Apart in Austin TX 2012, Aarron Walter shared why having a personality and story matters for companies. Notes by Luke Wroblewski.

The Real Me (2)

Articles and books cited in the Aarron Walter talk; compiled by AW himself.

Conference Photos

Enjoy the Flickr pool of photos from the three-day web design conference event now being held in Austin, TX.

Watch this space!

More to come.

ARIA-WAI cool

Issue No. 319 of A List Apart, for people who make websites.

Issue No. 319 of A List Apart for people who make websites tackles the intersection between web apps, WAI-ARIA, JavaScript, and accessibility.

ARIA and Progressive Enhancement

by DEREK FEATHERSTONE

For seven years, progressive enhancement has been how we build sustainable, interoperable, and accessible web solutions.

Now that the release of ARIA is approaching, let’s see how ARIA fits within progressive enhancement strategy. Can we use ARIA in a way that respects progressive enhancement? Can we use ARIA in ways that ensure we have a working solution at every level?

The Accessibility of WAI-ARIA

by DETLEV FISCHER

Web developers interested in accessibility issues often look to WAI-ARIA to bridge the accessibility gap created by ubiquitous scripting and make web applications more accessible to blind and visually impaired users. But can we recommend WAI-ARIA without reservation? Are there times when appropriate semantic HTML elements are preferable to custom widgets?

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.

Illustration by Kevin Cornell for A List Apart.

iPad as the new Flash


Jeffrey Zeldman Presents

iPad. Never have so many embraced a great product for exactly the wrong reasons.

Too many designers and publishers see the iPad as an opportunity to do all the wrong things—things they once did in Flash—without the taint of Flash.

In the minds of many, the iPad is like Flash that pays. You can cram traditional publishing content into an overwrought, novelty Flash interface as The New York Times once did with its T magazine. You may win a design award but nobody will pay you for that content. Ah, but do the same thing on the iPad instead, and subscribers will pay—maybe not enough to save publishing, but enough to keep the content coming and at least some journalists, editors, and art directors employed.

It’s hard to argue with money and jobs, and I wouldn’t dream of doing so.

Alas, the early success of a few publications—publications so good they would doubtless survive with or without iPad—is creating a stampede that will not help most magazines and interfaces that will not please most readers.

Everything we’ve learned in the past decade about preferring open standards to proprietary platforms and user-focused interfaces to masturbatory ones is forgotten as designers and publishers once again scramble to create novelty interfaces no one but them cares about.

While some of this will lead to useful innovation, particularly in the area of gestural interfaces, that same innovation can just as readily be accomplished on websites built with HTML, CSS, and JavaScript—and the advantage of creating websites instead of iPad apps is that websites work for everyone, on browsers and devices at all price points. That, after all, is the point of the web. It’s the point of web standards and progressive enhancement.

Luke Wroblewski’s Touch Gesture Reference Guide gives designers plenty of ammunition to create dynamic user experiences that work on a wide variety of mobile phones and devices (including iPad) while these same sites can use traditional desktop browser effects like hover to offer equally rich experiences on non-touch-enabled browsers. Unless your organization’s business model includes turning a profit by hiring redundant, competing teams, “Write once, publish everywhere” makes more economic sense than “Write once, publish to iPad. Write again, publish to Kindle. Write again, publish to some other device.”

I’m not against the iPad. I love my iPad. It’s great for storing and reading books, for browsing websites, for listening to music and watching films, for editing texts, presentations, and spreadsheets, for displaying family photos, and on and on. It’s nearly all the stuff I love about my Mac plus a great ePub reader slipped into a little glass notebook I play like a Theremin.

I’m not against iPad apps. Twitterific for iPad is by far the best way to use Twitter. After all, Twitter is really an internet service, not a website; Twitter’s own site, while leaps ahead of where it used to be, is hardly the most useful or delightful way to access its service. Gowalla for iPad is my constant companion. I dread the idea of traveling without it. And there are plenty of other great iPad apps I love, from Bloom, an “endless music machine” by Brian Eno and Peter Chilvers, to Articles, which turns Wikipedia into an elegant reading experience, to Mellotronics for iPad, an uncannily accurate Mellotron simulator packed with 13 authentic voices—“the same production tapes featured on Strawberry Fields Forever” and other classic tracks (not to mention tracks by nouveau retro bands like Eels).

There are apps that need to be apps, demand to be apps, and I admire and learn from them like every other designer who’s alive at this moment.

I’m just not sold on what the magazines are doing. Masturbatory novelty is not a business strategy.

The future of web standards

Jeffrey Zeldman on the future of web standards.

“Cheap, complex devices such as the iPhone and the Droid have come along at precisely the moment when HTML5, CSS3 and web fonts are ready for action; when standards-based web development is no longer relegated to the fringe; and when web designers, no longer content to merely decorate screens, are crafting provocative, multi-platform experiences. Is this the dawn of a newer, more mature, more ubiquitous web?”

The Future of Web Standards by Jeffrey Zeldman

Originally written for .net magazine, Issue No. 206, published 17 August in UK and this month in the US in “Practical Web Design” Magazine. Now you can read the article even if you can’t get your hands on these print magazines.

See also: I Guest-Edit .net magazine.

My other iPad is a Kindle

Zeldman.com as seen on Kindle

The new Kindle has a lot going for it. It’s inexpensive compared to a full-featured tablet computer like the iPad; you can slip it in your back pocket, where it’s more comfortable than an old-style paperback; and it includes a Webkit browser. This last point is where folks like us start to give a hoot, whether we’re fans of epub reading or not.

The flavor of Kindle’s browser concerns us because it affords us the ability to optimize the mobile viewing experience with a single line of markup. You can see this in action in the photo at the head of this article (published and discussed on Flickr).

I made no tweaks for Kindle per se; the Kindle is simply responding to a line of markup I’ve been putting into my web pages since 2007—namely, the viewport meta element, which controls the width of the viewport, thus enabling mobile devices with a limited number of pixels to focus all available pixels on your site’s core content (instead of, for instance, wasting part of the small screen on a background color, image, or gradient). The technique is as simple as web design gets:

meta name="viewport" content="width=770"

(Obviously, the value of “width” should be adjusted to match your site’s layout.)

I learned this little trick from Craig Hockenberry’s Put Your Content in My Pocket (A List Apart, August 28, 2007), which I naturally recommend to any designer who hasn’t seen it.