Category: A List Apart

From pixels to prose, coding to content.

Categories
A List Apart links Products Publications Publishing Usability User Experience UX

Product Management for the Web; Beyond Usability Testing

IN ISSUE NO. 357 of A List Apart for people who make websites:

Beyond Usability Testing

by DEVAN GOLDSTEIN

To be sure we’re designing the right experience for the right audience, there’s no substitute for research conducted with actual users. Like any research method, though, usability testing has its drawbacks. Most importantly, it isn’t cheap. Fortunately, there are other usability research methods at our disposal. The standouts, expert review and heuristic evaluation, are easy to add to a design and development process almost regardless of budget or resource concerns. Explore these techniques, learn their advantages and disadvantages, and get the low-down on how to include them in your projects.

Product Management for the Web

by KRISTOFER LAYON

Whether we prototype, write, design, develop, or test as part of building the web, we’re creating something hundreds, thousands, or maybe even millions of people will use. But how do we know that we’re creating the right enhancements for the web, at the right time, and for the right customers? Because our client or boss asked us to? And how do they know? Enter product management for the web—bridging the gap between leadership and customers on one side, and the user experience, content strategy, design, and development team on the other. Learn to set priorities that gradually but steadily make your product (and the web) better.

SINCE 1998, A List Apart has explored 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 Magazine.

Categories
A List Apart Announcements business content editorial Happy Cog™ people

A List Apart news

Presenting Sara Wachter Boettcher, ALA’s new editor-in-chief.

WITH THE RELEASE on July 10, 2012 of the A List Apart Summer Reading Issue (a collection of favorite articles from 355 issues of the magazine), ALA’s editor-in-chief Krista Stevens has hung up her spurs and moved on.

Over six significant web years, Krista’s passion for great writing led to such extraordinary articles as More Meaningful Typography by Tim Brown, Orbital Content by Cameron Koczon, In Defense of Readers by Mandy Brown, Responsive Web Design by Ethan Marcotte, and many others.

She helped ALA anticipate the important ideas in the rapidly changing fields of web design, web development, user experience, and content strategy, and continued the magazine’s tradition of pioneering and promoting best practices, while also broadening the kinds of stories we covered. Behind the scenes, she also updated our processes; coaxed the best work possible out of authors and staff; remembered birthdays and anticipated conflicts before feelings could get hurt; and more. She led us and mothered us, and she will be missed. You can follow Krista on Twitter, benefit from her user advocacy at Automattic, and continue to be enlightened by her via Contents Magazine. Thank you, Krista.

New editor-in-chief Sara Wachter Boettcher is a content strategist and writer who recently moved to Lancaster, PA, where she bucks the local Amish tradition by spending her days making, reading, and writing things on the web. She is the author of the upcoming Rosenfeld Media book Content Everywhere, a frequent conference speaker, and has contributed articles and essays to A List Apart (Future-Ready Content) and Contents (On Content and Curiosity).

Currently a consultant under her own shingle, Sara previously spent a half-dozen years working in agencies, mainly at Off Madison Ave, where she started as a web writer and became the director of interactive content and marketing strategy. Although her A List Apart editorship does not officially begin until August, Sara has already dived in behind the scenes. She is whip-smart and a pleasure to know.

Welcome, Sara!

Categories
A List Apart books business Career Code creativity CSS CSS3 Design Responsive Web Design The Profession

Build Books With CSS3; Design a Responsive Résumé

“WE ARE ALL PUBLISHERS,” claims Issue No. 353 of A List Apart for people who make websites. Design books with CSS3; craft a responsive web résumé.

Building Books with CSS3

by NELLIE MCKESSON

While historically, it’s been difficult at best to create print-quality PDF books from markup alone, CSS3 now brings us the Paged Media Module, which targets print book formatting. “Paged” media exists as finite pages, like books and magazines, rather than as long scrolling stretches of text, like most websites. With a single CSS stylesheet, publishers can take XHTML source content and turn it into a laid-out, print-ready PDF. You can take your XHTML source, bypass desktop page layout software like Adobe InDesign, and package it as an ePub file. It’s a lightweight and adaptable workflow, which gets you beautiful books faster. Nellie McKesson, eBook Operations Manager at O’Reilly Media, explains how to build books with CSS3.

A Case for Responsive Résumés

by ANDREW HOFFMAN

Grizzled job hunting veterans know too well that a sharp résumé and near-flawless interview may still leave you short of your dream job. Competition is fierce and never wanes. Finding new ways to distinguish yourself in today’s unforgiving economy is vital to a designer/developer’s survival. Happily, web standards whiz and mobile web developer Andrew Hoffman has come up with a dandy differentiator that is just perfect for A List Apart readers. Learn how to author a clean résumé in HTML5/CSS3 that scales well to different viewport sizes, is easy to update and maintain, and will never grow obsolete.

Illustration by Kevin Cornell for A List Apart.

Categories
A List Apart Design HTML HTML5 Publications Publishing Standards

Publication Standards

ENJOY A LIST APART’S SPECIAL two-part issue on digital publication standards.

Publication Standards Part 1:
The Fragmented Present

by NICK DISABATO

ebooks are a new frontier, but they look a lot like the old web frontier, with HTML, CSS, and XML underpinning the main ebook standard, ePub. Yet there are key distinctions between ebook publishing’s current problems and what the web standards movement faced. The web was founded without an intent to disrupt any particular industry; it had no precedent, no analogy. E-reading antagonizes a large, powerful industry that’s scared of what this new way of reading brings—and they’re either actively fighting open standards or simply ignoring them. In part one of a two-part series in this issue, Nick Disabato examines the explosion in reading, explores how content is freeing itself from context, and mines the broken ebook landscape in search of business logic and a way out of the present mess.

Publication Standards Part 2:
A Standard Future

by NICK DISABATO

The internet is disrupting many content-focused industries, and the publishing landscape is beginning its own transformation in response. Tools haven’t yet been developed to properly, semantically export long-form writing. Most books are encumbered by Digital Rights Management (DRM), a piracy-encouraging practice long since abandoned by the music industry. In the second article of a two-part series in this issue, Nick Disabato discusses the ramifications of these practices for various publishers and proposes a way forward, so we can all continue sharing information openly, in a way that benefits publishers, writers, and readers alike.

Illustration by Kevin Cornell for A List Apart.

Categories
A List Apart architecture Best practices type Usability User Experience UX Web Design

Keep your site’s type right; let users work offline

IN ISSUE No. 350 of A List Apart for people who make websites: keep your web type looking right across browsers, platforms, and devices; let users do stuff on your site even when they’re offline.

Say No to Faux Bold

by ALAN STEARNS

Browsers can do terrible things to type. If text is styled as bold or italic and the typeface family does not include a bold or italic font, browsers will compensate by trying to create bold and italic styles themselves. The results are an awkward mimicry of real type design, and can be especially atrocious with web fonts. Adobe’s Alan Stearns shares quick tips and techniques to ensure that your @font-face rules match the weight and styles of the fonts, and that you have a @font-face rule for every style your content uses. If you’re taking the time to choose a beautiful web font for your site, you owe it to yourself and your users to make certain you’re actually using the web font — and only the web font — to display your site’s content in all its glory.

Application Cache is a Douchebag

by JAKE ARCHIBALD

We’re better connected than we’ve ever been, but we’re not always connected. ApplicationCache lets users interact with their data even when they’re offline, but with great power come great gotchas. For instance, files always come from the ApplicationCache, even when the user is online. Oh, and in certain circumstances, a browser won’t know that that the online content has changed — causing the user to keep getting old content. And, oh yes, depending on how you cache your resources, non-cached resources may not load even when the user is online. Lanyrd’s Jake Archibald illuminates the hazards of ApplicationCache and shares strategies, techniques, and code workarounds to maximize the pleasure and minimize the pain for user and developer alike. All this, plus a demo. Dig in.

Illustration by Kevin Cornell for A List Apart

Categories
A List Apart content strategy

Content Strategy Double Header: A List Apart 349

IN ISSUE NO. 349 of A List Apart for people who make websites, savor the content strategy sweetness as you dip into a double dose of Rachel Lovinger, a prime motivator behind the content strategy movement.

Tinker, Tailor, Content Strategist

by RACHEL LOVINGER

What does content strategy mastery look like? As in any field, it comes down to having master skills and knowing when to apply them. While there are different styles of content strategy (from an editorial and messaging focus to a technical and structural focus), the master content strategist must work with content from all angles: messaging architecture and messaging platforms; content missions and content management. Above all, she must advocate for multiple constituents, including end users, business users, stakeholders, and the content vision itself. Rachel Lovinger shares the skills that go into achieving CS mastery.

Content Modelling: A Master Skill

by RACHEL LOVINGER

The content model is one of the most important content strategy tools at your disposal. It allows you to represent content in a way that translates the intention, stakeholder needs, and functional requirements from the user experience design into something that can be built by developers implementing a CMS. A good content model helps ensure that your content vision will become a reality. Lovinger explains how to craft a strong content model and use it to foster communication and align efforts between the UX design, editorial, and technical team members on your project.

Illustration by Kevin Cornell for A List Apart.

Categories
A List Apart

Responsive Prototyping with Foundation

Dive Into Responsive Prototyping

IN ISSUE NO. 348 of A List Apart, for people who make websites:

Dive into Responsive Prototyping with Foundation

There are hundreds of devices out there right now that can access the full web, as Steve Jobs once put it. They come with different capabilities and constraints, things like input style or screen size, resolution, and form. With all these devices set to overtake traditional desktop computers for web traffic next year, we need tools to help us build responsively. Jonathan Smiley shows how to dive into responsive design using Foundation, a light front-end framework that helps you rapidly build prototypes and production sites.

Illustration by Kevin Cornell for A List Apart.

Categories
A List Apart

A List Apart No. 347 | Style Tiles & Self-Critique

DESIGN BETTER with Issue No. 347 of A List Apart for people who make websites:

Artistic Distance

by PAUL BURTON

Pimpin’ ain’t easy; neither is self-critique. If you are passionate about what you create, it is impossible to completely disassociate yourself from your work in order to objectively evaluate and then improve it. But the ability to achieve “artistic distance”—that is, to attain a place that allows you to contemplate your design on its own merits—will enable you to improve your own work immeasurably and, ultimately, to cast off the immature shackles of ego. Learn to let your work shine by letting go of it. Acquire the knack of achieving artistic distance.

Style Tiles and How They Work

by SAMANTHA WARREN

How do you involve your client in a successful design process? Many of our processes date back to print design and advertising. It’s time we evolved our deliverables to make clients a more active participant in the process. The style tile is a design deliverable that references website interface elements through font, color, and style collections delivered alongside a site map, wireframes, and other user experience artifacts. Learn how style tiles can align client and designer expectations, expedite project timelines, involve stakeholders in the brainstorming process, and serve an essential role in responsive design.

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.

Categories
A List Apart Acclaim Appearances Design events Hall of Fame SXSW Zeldman

Behind The Music: The Jeffrey Zeldman Dolls

Jeffrey was looking for us to do a more tailored, short run of the doll we had initially designed of him-215 to be exact. They were to be given away as gifts at the Hall of Fame after party being held at South by Southwest (right about now is where you can hear our jaws drop to the floor).

Here was the opportunity to put handmade work into the hands of 215 web designers and industry gurus at one of the largest interactive design conferences in the world-South by Southwest. Are we interested? Hells, please! So, after hashing out the details and specifics we set into work on the very complicated and detailed project. Below are just a few of the pictures we took documenting the process…

Of Austin Fame and Marches | Dolls for Friends.

Categories
A List Apart mobile Responsive Web Design Standards State of the Web

Massively Mobile Progressive Enhancement | Is Your Site Future-Friendly? | Brad Frost & Stephanie Rieger in A List Apart

ISSUE NO. 346 of A List Apart for people who make websites is all about massively mobile progressive enhancement. Are your site’s content and design future friendly?

For a Future-Friendly Web

by BRAD FROST

It is time to move toward a future-friendly web. Our current device landscape is a plethora of desktops, laptops, netbooks, tablets, feature phones, smartphones, and more, but this is just the beginning. The rapid pace of technological change is accelerating, and our current processes, standards, and infrastructure are quickly reaching their breaking points. How can we deal with increasing device diversity and decreasing attention spans? Brad Frost of futurefriend.ly explains how, while this era of ubiquitous connectivity creates new challenges, it also creates tremendous opportunities to reach people wherever they may be.

The Best Browser is the One You Have with You

by STEPHANIE RIEGER

The web as we know and build it has primarily been accessed from the desktop. That is about to change. The ITU predicts that in the next 18–24 months, mobile devices will overtake PCs as the most popular way to access the web. If these predictions come true, very soon the web—and its users—will be mostly mobile. Even designers who embrace this change can find it confusing. One problem is that we still consider the mobile web a separate thing. Stephanie Rieger of futurefriend.ly and the W3C presents principles to understand and design for a new normal, in which users are channel agnostic, devices are plentiful, standards are fleeting, mobile use doesn’t necessarily mean “hide the desktop version,” and every byte counts.

Illustration by Kevin Cornell for A List Apart

Categories
A List Apart content strategy Responsive Web Design Usability User Experience UX

A List Apart No. 345: Responsive content: thinking beyond pages; from research to content strategy to meaningful project deliverables.

IN ISSUE NO. 345 of A List Apart, for people who make websites:

Future-Ready Content

by SARA WACHTER-BOETTCHER

The future is flexible, and we’re bending with it. From responsive web design to futurefriend.ly thinking, we’re moving quickly toward a web that’s more fluid, less fixed, and more easily accessed on a multitude of devices. As we embrace this shift, we need to relinquish control of our content as well, setting it free from the boundaries of a traditional web page to flow as needed through varied displays and contexts. Most conversations about structured content dive headfirst into the technical bits: XML, DITA, microdata, RDF. But structure isn’t just about metadata and markup; it’s what that metadata and markup mean. Sara Wachter-Boettcher shares a framework for making smart decisions about our content’s structure.

Audiences, Outcomes, and Determining User Needs

by COREY VILHAUER

Every website needs an audience. And every audience needs a goal. Advocating for end-user needs is the very foundation of the user experience disciplines. We make websites for real people. Those real people are able to do real things. But how do we get to really know our audience and find out what these mystery users really want from our sites and applications? Learn to ensure that every piece of content on your site relates back to a specific, desired outcome — one that achieves business goals by serving the end user. Corey Vilhauer explains the threads that bind UX research to content strategy and project deliverables that deliver.

Illustration by Kevin Cornell for A List Apart

Categories
A List Apart Design State of the Web

A List Apart No. 344: the new Webkit monoculture

ISSUE NO. 344 of A List Apart for people who make websites asks the musical question, “Webkit monoculture: threat or menace?”

The Vendor Prefix Predicament: ALA’s Eric Meyer Interviews Tantek Çelik

by ERIC MEYER, TANTEK ÇELIK

During a public meeting of the W3C CSS Working Group, Mozilla web standards lead Tantek Çelik precipitated a crisis in Web Standards Land when he complained about developers who misunderstand and abuse vendor prefixes by only supporting WebKit’s, thereby creating a browser monoculture. Tantek’s proposed solution—having Mozilla pretend to be WebKit—inflamed many in the standards community, especially when representatives from Opera and Microsoft immediately agreed about the problem and announced similar plans to Mozilla’s. To get to the bottom of the new big brouhaha, exclusively for A List Apart, our Eric Meyer interviews Tantek on Mozilla’s controversial plan to support -webkit- prefixed properties.

Every Time You Call a Proprietary Feature “CSS3,” a Kitten Dies

by LEA VEROU

Any -webkit- feature that doesn’t exist in a specification (not even an Editor’s draft) is not CSS3. Yes, they are commonly evangelized as such, but they are not part of CSS at all. This distinction is not nitpicking. It’s important because it encourages certain vendors to circumvent the standards process, implement whatever they come up with in WebKit, then evangelize it to developers as the best thing since sliced bread. In our eagerness to use the new bling, we often forget how many people fought in the past decade to enable us to write code without forks and hacks and expect it to work interoperably. Lea Verou explains why single-vendor solutions are not the same as standards and not healthy for your professional practice or the future of the web.

Illustration by Kevin Cornell for A List Apart.

Categories
A List Apart Acclaim Design people

A List Apart: a change is gonna come, I can feel it

TODAY, TWO invaluable contributors to A List Apart move on, and a new member joins our ranks:

Aaron Gustafson (@aarongustafson), author of Adaptive Web Design (the clearest, most beautiful explanation of progressive enhancement I’ve ever read) and nearly a dozen brilliant A List Apart articles, has been a technical editor at A List Apart for six exciting and formative years.

Daniel Mall (@danielmall) has written three great ALA articles and served as A List Apart technical editor almost as long as Aaron.

Both gentlemen have had a profound and lasting impact on the nature and quality of A List Apart’s content. With the publication of today’s ALA issue, both gentlemen move on.

Aaron is the founder of Web Standards Sherpa (“journeying towards best web practices”) and Easy Designs LLC; co-founder of Retreats 4 Geeks; and manager of The Web Standards Project.

Dan is a former interactive designer for Happy Cog’s Philadelphia studio, former design director at Big Spaceship in Brooklyn, co-founder of Typedia and swfIR, and singer/keyboard player for contemporary-Christian band Four24. I can’t tell you what he is doing next — he has sworn me to secrecy — but trust me, it will be awesome.

Over a long career marked by extraordinary collaborators, Aaron and Dan are two of the smartest, and most talented people I’ve had the pleasure to work with. They are also friends. This isn’t goodbye, fellas.

JOINING US today as technical editor is Mat Marquis (@wilto). He marks his entrance into A List Apart’s world via this morning’s stunning article, Responsive Images: How They Almost Worked and What We Need.

Mat is a designer-slash-developer working at Filament Group in Boston. Mat is a member of the jQuery Mobile team, an active member of the open source community, and enjoys a complicated relationship with the now-defunct HTML5 “dialog” tag.

Welcome, Wilto!

Categories
A List Apart business Design

A List Apart: Pricing Strategy for Creatives

FREELANCERS AND STUDIO HEADS, learn what your rates say about your brand, and discover how to make more money by raising your rate strategically.

A List Apart: Pricing Strategy for Creatives by JASON BLUMER.

Illustration by Kevin Cornell for A List Apart Magazine.

Categories
A List Apart Design Layout Responsibility Responsive Web Design

A List Apart: Responsive Images: How they Almost Worked and What We Need

RESPONSIVE WEB DESIGNERS, don’t miss Mat Marquis’ essential article in today’s A LIST APART, for people who make websites: Responsive Images: How they Almost Worked and What We Need. Mat shows why responsive images as we currently use them don’t quite cut it – and shares a way forward that involves the creation of a shiny new HTML element.

Illustration by Kevin Cornell for A List Apart Magazine.