Leo Laporte interviews JZ
IN EPISODE 63 of Triangulation, Leo Laporte, a gracious and knowledgeable podcaster/broadcaster straight outta Petaluma, CA, interviews Your Humble Narrator about web standards history, responsive web design, content first, the state of standards in a multi-device world, and why communists sometimes make lousy band managers.
Filed under: business, businessweek, client management, client services, clients, content, Content First, CSS3, Curation, Dan Benjamin, Design, E-Books, Ethan Marcotte, findability, Google, Happy Cog™, HTML, HTML5, Jeremy Keith, Microsoft, podcasts, Publishing, Real type on the web, Redesigns, Responsive Web Design, Standards, State of the Web, The Big Web Show, Usability, User Experience, UX, Web Design, Web Design History, Web Standards, Zeldman
CSS & Mobile To The Future | Embrace Users, Constrain Design | An Event Apart Seattle 2012 Day II
TUESDAY, 3 APRIL 2012, was Day II of An Event Apart Seattle, a sold-out, three-day event for people who make websites. If you couldn’t be among us, never fear. The amazing Luke Wroblewski (who leads a day-long seminar on mobile web design today) took excellent notes throughout the day, and shares them herewith:
The (CSS) Future is Now – Eric Meyer
In his The Future is Now talk at An Event Apart in Seattle, WA 2012 Eric Meyer talked about some of the visual effects we can achieve with CSS today. Create shiny new visual elements with no images using progressive enhancement and CSS that is available in all modern browsers.
A Philosophy of Restraint
- Simon Collison
In his A Philosophy of Restraint talk at An Event Apart in Seattle, WA 2012 Simon Collison outlined his design philosophy and how he applies it to web projects. Embrace constraints; simplicity and complexity; design aesthetic; design systems as foundations that prepare us for future projects and complexity; affordances and type; focus and content; audit and pause — prevent catastrophic failures and shine a new light on what you’ve learned with each project.
Touch Events – Peter-Paul Koch (PPK)
In his Touch Events talk at An Event Apart in Seattle, WA 2012 Peter-Paul Koch talked about touch support in mobile browsers and how to handle touch events in web development. Includes a ranking of current mobile browsers; interaction modes in mobile versus desktop (mouse) and keyboard — how do we adjust scripts to work with touch?; touch events; supporting modes; event cascade; and “stick with click.”
Mobile to the Future – Luke Wroblewski
Alas, Luke could not take notes on his own presentation. Here’s what it was about: When something new comes along, it’s common for us to react with what we already know. Radio programming on TV, print design on web pages, and now web page design on mobile devices. But every medium ultimately needs unique thinking and design to reach its true potential. Through an in-depth look at several common web interactions, Luke outlined how to adapt existing desktop design solutions for mobile devices and how to use mobile to expand what’s possible across all devices.Instead of thinking about how to reformat your websites to fit mobile screens, attendees learned to see mobile as way to rethink the future of the web.
What’s Your Problem? – Whitney Hess
In her What’s Your Problem? Putting Purpose Back into Your Projects talk at An Event Apart in Seattle, WA 2012 Whitney Hess outlined the value of learning about opportunities directly from customers. Understand the problem before designing the solution. Ask why before you figure out how. There is no universal solution for all our projects, we need to determine which practices are “best” through our understanding of problems. Our reliance on best practices is creating a world of uniform websites that solve no one’s problem. Leave the desk and interact with people. Rather than the problem solver, be the person who can see the problem.
Properties of Intuitive Pages
- Jared Spool
At An Event Apart in Seattle WA 2012, Jared Spool walked through what makes a design intuitive, why some users need different treatment, and the role of design. Current versus acquired knowledge and how to bridge the gap (how to train users, thus making your site or app “intuitive”). Redesigns and how to avoid disaster. Design skills. The gap between current knowledge and target knowledge is where design happens. Why intuitive design is only possible in small, short iterations.
Day III begins in 90 minutes. See some of you there.
Photos: AEA Seattle Flickr pool or hashtags #aea and #aeasea on Instagram.
Filed under: An Event Apart, Appearances, CSS, CSS3, Design, development, eric meyer, HTML, HTML5, Ideas, industry, Information architecture, IXD, Platforms, Publishing, Redesigns, Responsive Web Design, Scripting, Standards, State of the Web, User Experience, UX, Web Design, Web Standards
An Event Apart Atlanta 2011
YOU FIND ME ENSCONCED in the fabulous Buckhead, Atlanta Intercontinental Hotel, preparing to unleash An Event Apart Atlanta 2011, three days of design, code, and content strategy for people who make websites. Eric Meyer and I co-founded our traveling web conference in December, 2005; in 2006 we chose Atlanta for our second event, and it was the worst show we’ve ever done. We hosted at Turner Field, not realizing that half the audience would be forced to crane their necks around pillars if they wanted to see our speakers or the screen on which slides were projected.
Also not realizing that Turner Field’s promised contractual ability to deliver Wi-Fi was more theoretical than factual: the venue’s A/V guy spent the entire show trying to get an internet connection going. You could watch audience members twitchily check their laptops for email every fourteen seconds, then make the “no internet” face that is not unlike the face addicts make when the crack dealer is late, then check their laptops again.
The food was good, our speakers (including local hero Todd Dominey) had wise lessons to impart, and most attendees had a pretty good time, but Eric and I still shudder to remember everything that went wrong with that gig.
Not to jinx anything, but times have changed. We are now a major three-day event, thanks to a kick-ass staff and the wonderful community that has made this show its home. We thank you from the bottoms of our big grateful hearts.
I will see several hundred of you for the next three days. Those not attending may follow along:
- An Event Apart Atlanta three-day schedule
- A Feed Apart – live tweeting, Monday through Wednesday
- AEA Atlanta Flickr Group
- An Event Apart Facebook page
Filed under: An Event Apart, Announcements, Appearances, apps, Atlanta, Authoring, Best practices, business, cities, client services, clients, Code, Community, Compatibility, conferences, content, content strategy, creativity, CSS, CSS3, Design, Designers, development, editorial, Education, eric meyer, events, Fonts, Formats, glamorous, Happy Cog™, HTML, HTML5, Ideas, industry, Information architecture, interface, IXD, Jeremy Keith, Platforms, Real type on the web, Redesigns, Responsive Web Design, Scripting, speaking, spec, Standards, State of the Web, The Profession, Usability, User Experience, UX, W3C, Web Design, Web Design History, Web Standards, webfonts, webkit, webtype, work, Working, Zeldman
Happy Cog redesigns Zappos.com
Free overnight shipping; a liberal return policy; friendly service: it’s no secret that Zappos.com positions the customer as the cornerstone of their brand promise. Yet despite their success, Zappos.com was a website with a problem: their business growth had outpaced the slowly-evolving aesthetic of their website. While the site enabled customers to make their purchases quickly, it didn’t capture and embrace the hallmarks of the Zappos.com culture. Enter Happy Cog. (Read more.)
ALA 289: Redesign yourself
In Issue No. 289 of A List Apart, for people who make websites: 90% of web design is redesign. The hardest redesigns are the ones you do for yourself. In this special issue, we look at how two of the great ones handled the challenge of redesigning their own sites.
- Erskine Design Redesign
In a mere two years, Erskine Design grew from two people working at home into a full-fledged agency of eight, working with major clients. Their website needed to better reflect their achievements, abilities, and team strengths. They also sought to improve the quality of data collected during client inquiries. Simon Collison explores the agency’s thought processes, and the decisions they made as their own client.
- Redesigning Your Own Site
Redesigning your freelance website is an exercise in masochism. There are no colleagues to share the pain: It’s just you. As the designer who wrote The Art of Self-Branding, freelancer Lea Alcantara knew her site had to be just right. People were bound to scrutinize any update to the design, and she couldn’t afford to damage her credibility. Follow her process and decide for yourself if she succeeded.
[tags]design, redesign, self-branding, webdesign, alistapart[/tags]
Redesign template finals
- Blog post template final (with rotation in footer)
- About page template final (with rotation in footer)
- Contact page template final (with yadda, yadda)
- 404 page – my favorite!
- New! 21 May Subscribe page
- New! 21 May Style switcher in footer
- New! 22 May WordPress tout page
- New! 22 May (mt) Media Temple tout page
Note: Top left and top right footer elements rotate. ALA element (top middle) changes every two weeks, upon publication. Bottom three elements are static, at least for now.
A couple more templates to go, and then we can build this thing. Can’t wait.
[tags]zeldman, zeldman.com, design, redesign, designingfromthecontentout[/tags]
Designing from the content out 2
And the saga continues. I took a few days off from the redesign project while in Seattle. Today I designed and quickly prototyped a simple masthead. Have a look. I’m going to live with it for a while.
AEA Seattle after-report
Armed with nothing more than a keen eye, a good seat, a fine camera, and the ability to use it, An Event Apart Seattle attendee Warren Parsons captured the entire two-day show in crisp and loving detail. Presenting, for your viewing pleasure, An Event Apart Seattle 2009 – a set on Flickr.
When you’ve paged your way through those, have a gander at Think Brownstone’s extraordinary sketches of AEA Seattle.
Still can’t get enough of that AEA stuff? Check out the official AEA Seattle photo pool on Flickr.
And here are Luke W’s notes on the show.
Our thanks to the photographers, sketchers, speakers, and all who attended.
[tags]aneventapart, aeaseattle09, AEA, AEA09, Seattle, webdesign, conference, Flickr, sets, Twitter, photos, illustrations, sketches, aneventapart.com[/tags]
Filed under: An Event Apart, Appearances, Browsers, Career, client services, Code, Community, content, creativity, CSS, Design, eric meyer, events, Happy Cog™, HTML, HTML5, Ideas, Images, industry, Information architecture, jobs, Redesigns, Seattle, speaking, Standards, State of the Web, Surviving, The Profession, tweets, twitter, Working, Zeldman
An Event Apart redesigned
There’s a new aneventapart.com in town, featuring a 2009 schedule and a reformulated design. I designed the new site and Eric Meyer coded. (Validation freaks, only validator.nu is up to the task of recognizing the HTML 5 DOCTYPE used and validating against it; the validator.w3.org and htmlhelp.com validators can’t do this yet. Eric chose HTML 5 because it permits any element to be an HREF, and this empowered him to solve complex layout problems with simple, semantic markup. Eric, I know, will have loads more to say about this.)
Family branding concerns drove the previous design. Quite simply, the original An Event Apart site launched simultaneously with the 2005 redesign of A List Apart. Jason Santa Maria‘s stripped-down visual rethink was perfect for the magazine and is imitated, written about, and stolen outright to this day. It was a great design for our web magazine because it was created in response to the magazine’s content. It didn’t work as well for the conference because its design wasn’t driven by the kind of content a conference site publishes. But it was the right conference design for 2005 because the goal at that time was to create a strong brand uniting the long-running web design magazine with the new web design conference that sprang from it.
New goals for a new environment
In 2009, it’s less important to bolt the conference to the magazine by using the same layout for both: by now, most people who attend or have thought about attending An Event Apart know it is the A List Apart web design conference. What’s important in 2009 is to provide plenty of information about the show, since decisions about conference-going are being made in a financially (and psychologically) constricted environment. In 2005, it was enough to say “A List Apart has a conference.” Today more is needed. Today you need plenty of content to explain to the person who controls the purse strings just what you will learn and why a different conference wouldn’t be the same or “just as good.”
The redesign therefore began with a content strategy. The new design and new architecture fell out of that.
Action photos and high contrast
The other thing I went for—again, in conscious opposition to the beautifully understated previous design—was impact. I wanted this design to feel big and spacious (even on an iPhone’s screen) and to wow you with, for lack of a better word, a sense of eventfulness. And I think the big beautiful location images and the unafraid use of high contrast help achieve that.
Reinforcing the high contrast and helping to paint an event-focused picture, wherever possible I used action shots of our amazing speakers holding forth from the stage, rather than the more typical friendly backyard amateur head shot used on every other conference site (including the previous version of ours). I wanted to create excitement about the presentations these brilliant people will be making, and live action stage photos seemed like the way to do that. After all, if I’m going to see Elvis Costello perform, I want to see a picture of him onstage with his guitar—not a friendly down-to-earth shot of him taking out the garbage or hugging his nephews.
So that’s a quick overview of the redesign. The store is now open for all four shows and the complete Seattle show schedule is available for your viewing pleasure. I hope to see some of you in 2009 at our intensely educational two-day conference for people who make websites.
[tags]aneventapart, design, redesign, relaunch, webdesign, conference, events, HTML5, ericmeyer, zeldman[/tags]
Filed under: A List Apart, An Event Apart, art direction, Boston, Chicago, cities, Code, conferences, content, CSS, Design, development, eric meyer, events, Happy Cog™, links, Redesigns, San Francisco, Seattle, Standards, User Experience, UX, Web Design, work, Zeldman
Say hello to web standards
There’s something new at Apple’s online store: web standards and accessibility.
Apple.com has never lacked for panache. It has always looked more stylish, more elegant, more beautifully designed than most business sites. The site’s combination of utility, seduction, and understated beauty is practically unique—in keeping with the company’s primary point of product differentiation.
But while its beauty and usability have always run ahead of the pack, its underlying source code has not always kept pace. Now the online Apple Store’s inside is as beautiful as its exterior—and as far ahead of the mainstream in web development as a company like Apple needs to be.
One day, all sites will be built like this. View Source for an inspiring glimpse of how semantic and accessible even a grid-based, image-intensive, pixel-perfect site can be.
And next time your boss, client, or IT director annoyingly proclaims that you can’t have great looks and good markup, point them at store.apple.com. Who knows? They might buy you an iPhone or MacBook as a token of thanks.
Opinions are no longer being solicited, but you can read the 101 comments that were shared before we closed the iron door.
[tags]apple, css, markup, accessibility, webstandards, jinabolton, aneventapart, aeasf07[/tags]