IN EPISODE No. 79 of The Big Web Show (“everything web that matters”), I interview CSS guru, Microformats co-founder, O’Reilly and New Riders author, and An Event Apart co-founder Eric A. Meyer (@meyerweb) about upcoming CSS modules including grid layout, flexbox, and regions; his career trajectory from college graduate webmaster to world-renowned author, consultant, and lecturer; founding and running a virtual community (CSS-Discuss); becoming an O’Reilly writer; the early days of the Mosaic Browser and The Web Standards Project’s CSS Samurai; “The Web Behind” variation of The Web Ahead podcast, and more.

Listen to the episode.

About Eric

Eric A. Meyer has been working with the web since late 1993 and is an internationally recognized expert on the subjects of HTML and CSS. He is the principal consultant for Complex Spiral Consulting and lives in Cleveland, Ohio, which is a much nicer city than you’ve been led to believe. Author of “Eric Meyer on CSS” (New Riders), “Cascading Style Sheets: The Definitive Guide” (O’Reilly & Associates), “CSS2.0 Programmer’s Reference” (Osborne/McGraw-Hill), and the CSS Browser Compatibility Charts, Eric co-founded and co-directs An Event Apart, the design conference “for people who make websites,” and speaks at a variety of conferences on the subject of standards, CSS use, and web design.

URLs

• http://twitter.com/meyerweb
• http://meyerweb.com
• http://aneventapart.com
• http://dev.w3.org/csswg/css3-regions/
• http://www.w3.org/TR/css3-grid-layout/
• http://dev.w3.org/csswg/css3-flexbox/
• http://css-discuss.org
• http://microformats.org

Photo: Chris Jennings

Filed under: Big Web Show, CSS, CSS3, Designers, development, Education, eric meyer, HTML, podcasts, Standards, State of the Web

Comments off.

IN EPISODE No. 77 of The Big Web Show, I interview returning guest Sarah Parmenter about designing an app for the homeless; the challenges of multi-device design; teaching HTML and CSS to young people; designing a complex reader app; the ideal number of employees for a small design studio; Brooklyn vs. small-town UK; and more.

The Big Web Show features special guests on topics like web publishing, art direction, content strategy, typography, web technology, and more. It’s everything web that matters.

Sarah Parmenter Photo by Pete Karl II.

Filed under: Big Web Show, business, Career, clients, Design, Designers, development, HTML

Comments off.

Except when I occasionally update Designing With Web Standards, I quit writing hands-on, nuts-and-bolts stuff about CSS and HTML years ago. Publishing abhors a vacuum: other designers and developers took my place. For the most part, this has been a good thing—for them and for our industry. The best writers about code have always been those who spend 25 hours of every day up their necks in it, as I used to. While folks like me migrate into strategic or supervisory roles (providing us with new places to innovate and new things to write about), a new generation of code crafters is making new discoveries and sharing new teachings. Ah, the magical circle of life.

But amid the oodles of resulting goodness, I find occasional stinkers. Take the notion, now concretizing into dogma, that id should almost never be used because it has “too much specificity,” and that class names are always preferable. Respectfully, I call bunk.

To my knowledge, this notion comes out of Nicole Sullivan’s brilliant Object Oriented CSS, an approach for writing HTML and CSS that is designed to scale on sites containing thousands of pages, created by dozens of front-end developers over a period of years, generally with no rules or style guide in place (at least no rules or style guide until it is too late). On sites like these—sites like Amazon or Facebook that are hosed from the get-go thanks to too many cooks and no master chef—the use of structural id and descendant selectors can be problematic, especially when inept coders try to overwrite an id-based descendant selector rule by creating ever-more-specific descendant selector rules.

In this particular (and rare) circumstance, where dueling developers have added rule after rule to a huge, shapeless style sheet that is more of an archeological artifact than a reasonable example of modern code, Nicole’s admonition to avoid descendant selectors based on id is probably wise. If you have the misfortune to work on a huge, poorly developed site where you will never have permission to refactor the templates and CSS according to common sense and best practices, you may have to rely on class names and avoid descendant selectors and ids.

But under almost any other circumstance, properly used ids with descendant selectors are preferable because more semantic and lighter in bandwidth.

The way I have always advocated using id, it was simply a predecessor to the new elements in HTML5. In 2000, we wrote div id="footer" because we had no footer element, and we wanted to give structural meaning to content that appeared within that div. Today, depending on the browsers and devices people use to access our site, we may well have the option to use the HTML5 footer element instead. But if we can’t use the HTML5 element, there is nothing wrong with using the id.

As for descendant selectors, in a site not designed by 100 monkeys, it is safe to assume that elements within an id’d div or HTML5 element will be visually styled in ways that are compatible, and that those same elements may be styled differently within a differently id’d div or HTML5 element. For instance, paragraphs or list items within a footer may be styled differently than paragraphs or list items within an aside. Paragraphs within a footer will be styled similarly to one another; the same goes for paragraphs within an aside. This is what id (or HTML5 element) and descendant selectors were made for. Giving every paragraph element in the sidebar a classname is not only a needless waste of bandwidth, it’s also bad form.

Say it with me: There is nothing wrong with id when it is used appropriately (semantically, structurally, sparingly). There is plenty wrong with the notion that class is always preferable to descendant selectors and semantic, structural ids.

Please understand: I’m not disparaging my friend Nicole Sullivan’s Object Oriented CSS as an approach to otherwise unmanageable websites. No more would I disparage a steam shovel for cleaning up a disaster site. I just wouldn’t use it to clean my room.

I’ll be discussing code and all kinds of other things webbish with Chris Coyier and Dave Rupert on the Shoptalk podcast today. Meanwhile, let me know what you think. And don’t forget November 30th is the sixth international celebration of Blue Beanie Day in support of web standards. Wherever you may stand on the great id debate, please stand with me and thousands of others this November 30th.

Filed under: Code, CSS, HTML, Web Standards

Comments off.

Those eager to bash Hixie and the WHATWG are using the new spec as if it were a cudgel; “this is how you deal with Hixie and WHATWG” says Marc Drummond. I don’t think that’s productive. What is productive is the debate that this publication will (hopefully) foster.

Bruce Lawson’s personal site: On the publication of Editor’s draft of the element.

Filed under: Authoring, HTML, HTML5, State of the Web, Web Design, Web Design History, Web Standards, XHTML

Comments off.

JOHN DYER’S MediaElement.js bills itself as “HTML5 <video> and <audio> made easy”—and that’s truly what it is:

• HTML5 audio and video players in pure HTML and CSS.
• Custom Flash and Silverlight players that mimic the HTML5 MediaElement API for older browsers.
• Accessibility standards including WebVTT.
• Plugins for WordPress, Drupal, Joomla, jQuery, BlogEngine.NET, ruby gem, and plone.

For complete information, visit mediaelementjs.com.

Hat tip: Roland Dubois.

Filed under: Design, development, Formats, HTML, HTML5, Products, software, State of the Web, Tools

Comments off.

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

Comments off.

IN A LETTER dated July 19, 2012, WHATWG leader and HTML living standard editor (formerly HTML5 editor) Ian Hickson clarifies the relationship between activity on the WHATWG HTML living standard and activity on the W3C HTML5 specification. As my dear Aunt Gladys used to say, you can’t ride two horses with one behind.

Filed under: HTML, HTML5, Standards, State of the Web, W3C, Web Design History, Web Standards

Comments off.

“IF I WERE advising them on these decisions, I would have had them look at what people actually want from Facebook — fast access to their friends’ photos and posts — and … helped them design an HTML5 web experience that actually works for mobile.”

.net magazine: Facebook iPhone app to go native By Tanya Combrinck on June 28, 2012

Filed under: Apple, apps, Design, facebook, HTML, HTML5, Usability, User Experience, UX

Comments off.

AT AN EVENT APART Boston, “Scott Jehl discussed ways we can improve web performance by qualifying capabilities and being smart about how assets are loaded in browsers [and] shared a … new tools he helped create that can help address these issues.”

Enjoy Luke Wroblewski’s notes on Scott’s talk.

Filed under: An Event Apart, conferences, content, Content First, HTML, Responsive Web Design

Comments off.

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.

Filed under: A List Apart, Design, HTML, HTML5, Publications, Publishing, Standards

Comments off.