Categories
Browsers bugs Code Compatibility CSS CSS3 development Free Happy Cog™ HTML HTML5 Ideas industry links Standards State of the Web The Essentials The Profession Tools Web Design Web Design History Web Standards

HTML5, CSS3 default templates

Free for use in all web projects, professional or personal, HTML5 Reset by Monkey Do! is a set of HTML5 and CSS templates that jumpstart web development by removing the styling native to each browser, establishing basic HTML structures (title, header, footer, etc.), clearing floats, correcting for IE problems, and more.

Most of us who design websites begin every project with bits and pieces of this kind of code, but developer Tim Murtaugh, who created these files and who modestly thanks everyone in the universe, has struck a near-ideal balance. In these lean, simple files, without fuss or clutter, he manages to give us the best-practices equivalent of everything but the kitchen sink.

Tim Murtaugh sits beside me at Happy Cog, so I’ve seen him use these very files (and earlier versions of them) to quickly code advanced websites. If you’re up to speed on all the new hotness, these files will help you stay that way and work faster. If you’re still learning (and who isn’t?) about HTML5, CSS3, and browser workarounds, studying these files and Tim’s notes about them will help you become a more knowledgeable web designer slash developer. (We need a better name for what we do.)

My daughter calls Mr Murtaugh “Tim the giant.” With the release of this little package, he earns the moniker. Highly recommended.

Categories
A List Apart An Event Apart Appearances Best practices better-know-a-speaker conferences content content strategy creativity CSS CSS3 Curation Design Designers engagement eric meyer Happy Cog™ HTML HTML5 Ideas Images industry Minneapolis people photography Responsive Web Design Typography Usability User Experience UX W3C Web Design Web Standards webfonts Zeldman

Minneapolis Remembered

Eric Meyer at An Event Apart Minneapolis - photo by Jared Mehle

The show’s over but the photos linger on. An Event Apart Minneapolis was two days of nonstop brilliance and inspiration. In an environment more than one attendee likened to a “TED of web design,” a dozen of the most exciting speakers and visionaries in our industry explained why this moment in web design is like no other.

If you were there, relive the memories; if you couldn’t attend, steal a glance at some of what you missed: An Event Apart Minneapolis: the photo pool at Flickr.

Next up: An Event Apart DC and San Diego. These shows will not be streamed, simulcast, or repackaged in DVD format. To experience them, you must attend. Tickets are first-come, first-served, and every show this year has sold out. Forewarned is forearmed; we’d love to turn you on.


Photo: Jared Mehle.

Categories
Acclaim Applications apps architecture art direction Authoring Best practices Browsers business Career Code creativity CSS Design development HTML HTML5 Ideas industry interface ipad iphone javascript links maturity Photoshop Platforms Publishing Standards State of the Web Stories The Profession Web Design Web Design History Web Standards

SlideShowPro adds HTML5

Todd Dominey at Happy Cog.

Most of us web folk are hybrids of one sort or another, but Todd Dominey was one of the first web designers to combine exceptional graphic design talent with serious mastery of code.

Being so good at both design and development that you could easily earn a fine living doing just one of them is still rare, although it looks like the future of our profession. One of the first serious designers to embrace web standards, Todd was also one of the few who did so while continuing to achieve recognition for his work in Flash. (Daniel Mall, who came later, is another.)

Finally, Todd was one of the first—along with 37signals and Coudal Partners—to abandon an enviably successful client services career in favor of full-time product development, inspiring a generation to do likewise, and helping bring us to our current world of web apps and startups.

A personal project that became an empire

In Todd’s case, the product was SlideShowPro, a project he designed for himself, which has grown to become the web’s most popular photo and video slideshow and gallery viewer. When you visit a photographer’s portfolio website, there’s an excellent chance that SlideShowPro powers its dynamic photo viewing experience. The same is true for the photo and video gallery features of many major newspaper and magazine sites, quite possibly including your favorites.

SlideShowPro

But deliberate lack of Flash support in the iPad and iPhone, while lauded here on February 1, 2010 as a win for accessible, standards-based design (“Not because Flash is bad, but because the increasing popularity of devices that don’t support Flash is going to force recalcitrant web developers to build the semantic HTML layer first”), presented a serious problem for developers who use SlideShowPro and readers who enjoy browsing dynamic photo and video galleries.

Mr Dominey has now solved that problem:

SlideShowPro Mobile is an entirely new media player built using HTML5 that doesn’t require the Flash Player plugin and can serve as a fallback for users accessing your web sites using these devices. But it’s not just any fallback — it’s specially designed for touch interfaces and smaller screen sizes. So it looks nothing like the SlideShowPro player and more like a native application that’s intuitive, easy to use, and just feels right.

The best part though is that because SlideShowPro Director (which will be required) publishes the mobile content, you’ll be able to provide the mobile alternative by simply updating the Flash Player embed code in your HTML documents. And just like when using the SlideShowPro player, because Director is behind the scenes, all your photos will be published for the target dimensions of these devices — which gives your users top quality, first generation images. The mobile player will automatically load whatever content is assigned to the Flash version, so the same content will be accessible to any browser accessing your web site.

A public beta will be released in the next weeks. Meanwhile, there is a video demo. There’s also an excellent Question and Answer page that answers questions you may have, whether you’re a SlideShow Pro customer or not. For instance:

Why mobile? Why not desktop?

We believe that (on the desktop) Flash is still the best delivery method for photo/video galleries and slideshows for it provides the most consistent user experience across all browsers and the broadest range of playback and customization options. As HTML5 support matures across all desktop browsers, we’ll continue to look into alternate presentation options.

Into the future!

Categories
37signals Acclaim Announcements Appearances Applications apps Authoring Best practices better-know-a-speaker business Chicago client services Code Coudal Partners Design ethics HTML Ideas industry interface Interviews Journalism at its Finest Press Products Publications Publishing Respect Ruby on Rails Small Business State of the Web The Big Web Show The Essentials The Profession User Experience

37signals’ Jason Fried live today on The Big Web Show

I have known 37signals CEO Jason Fried since he was a young copywriter who reminded me of me, only smarter and more confident. Like many of you, with a mixture of awe and pleasure, I have watched him change our industry, along with book publishing and business generally. Dan Benjamin and I are delighted to announce the mercurial Mr Fried as our guest on The Big Web Show. Join us today, 1 July 2010, for the live taping at 1:00 PM ET.

Jason’s official bio is brief, but he can write at length when he wishes: see Rework, Getting Real, and Defensive Web Design, each a classic, and to each of which he was principal co-writer and guiding force. Besides saying no to meetings, contracts, and VC money, Jason and 37signals are famous for godfathering a speedy, iterative form of web application design; for gifting the industry with Ruby on Rails; for creating a suite of beloved (yes, really) business productivity web apps; for mastering and then abandoning client services in favor of making stuff; for somehow, in the midst of all that busyness, churning out tons of fine content on their popular blog; and for being roommates with the equally fantastic Coudal Partners.

Can’t wait to interview Jason Fried in front of a live internet audience today. Hope you’ll join us.

The Big Web Show is taped live in front of an internet audience every Thursday at 1:00 PM ET on live.5by5.tv. Edited episodes can be watched afterwards (often within hours of taping) via iTunes (audio feed | video feed) and the web.

Photo © John Morrison – Subism.com

Categories
A Book Apart A List Apart Accessibility An Event Apart Design industry interface Interviews ipad iphone people tbws The Big Web Show User Experience Zeldman

Episode 9: Web Standards

Today at 1:00 PM EDT, join Dan Benjamin and me live as we interview designer, developer, author, lecturer, and bon vivant Ethan Marcotte (bio | blog | Twitter) for Episode 9 of The Big Web Show.

Ethan is the author of an upcoming A Book Apart treatise on responsive web design; my co-author on Designing With Web Standards 3rd Edition; and the co-author with Dan Cederholm of Handcrafted CSS: More Bulletproof Web Design.

Join us for a lively discussion as we talk about designing and coding for the likes of the Sundance Film Festival and New York Magazine, and the joys of responsive web design, working remotely, and swearing profusely on Twitter. We may even get Ethan’s take on Microsoft’s dazzling new IE9.

As always, watch and participate in the live broadcast by tuning to live.5by5.tv at the appointed time.

A few hours after the taping, the permanent, edited video and audio podcast will be available for your bliss at 5by5.tv/bigwebshow/9 and via the iTunes Store (iTunes audio feed | iTunes video feed).

The Big Web Show is a weekly video podcast on Everything Web That Matters, co-hosted by 5×5 network founder Dan Benjamin and yours truly.

Categories
Browsers Curation Design industry Web Design Web Design History

Bit o’ nostalgia for the old folks

Thanks, Mr Sippey!


Categories
Advertising bugs Google Images industry Microblogging war, peace, and justice

When Ads by Google Go Wrong

When Ads By Google Go Wrong

When Ads by Google Go Wrong


Categories
Community Design industry Micropublishing twitter

Twitter Top 140

“Here it is, our next Web Trend Map. No Metro lines, no URLS. This time, it’s the 140 most influential people on twitter, sorted by #name #handle #category #influence #activity. Plus: When they started tweeting and what they first said. …”

Where does the data come from?

“We analyzed the data in our Web Trend Engine (30gigs), got a sneak peek into the top 100 list from the Max Planck Institute PDF Twitter research team (200KB), we talked to Twitter directly, and we asked our audience to make sure that we get international tweeters in there as well.”

iA » Cosmic 140—Final Beta

Categories
A Feed Apart An Event Apart better-know-a-speaker Boston Community conferences content content strategy creativity CSS Design engagement eric meyer events glamorous HTML5 Ideas industry Information architecture interface Standards State of the Web The Profession W3C Web Design Web Standards XHTML

Boston Bound

Plane travel versus train travel, that sort of thing.

Morning finds me bound by train for Boston, capital of Massachusetts, land of Puritans, patriots, and host of the original Tea Party. Center of high technology and higher education. Where the John Hancock Tower signs its name in the clouds, and the sky-scraping Prudential Tower adds a whole new meaning to the term, “high finance.” Beantown. Cradle of liberty, Athens of America, the walking city, and five-time host to An Event Apart, which may be America’s leading web design conference. (You see what I did there?)

Over 500 advanced web design professionals will join co-host Eric Meyer and me in Boston’s beautiful Back Bay for two jam-packed days of learning and inspiration with Dan Cederholm, Andy Clarke, Kristina Halvorson, Jeremy Keith, Ethan Marcotte, Jared Spool, Nicole Sullivan, Jeff Veen, Aarron Walter, and Luke Wroblewski.

If you can’t attend the sold-out show, which begins Monday, May 24, you can follow the live Tweetage via the souped-up, socially-enriched, aesthetically tricked out new version of A Feed Apart, whose lights go on this Sunday, May 23. Our thanks to developers Nick Sergeant, Pete Karl II, and their expanded creative team including Steve Losh and Ali M. Ali. We and they will have more to say about the project soon. For now, you can always read our 2009 interview with Nick and Pete or sneak a peek on Dribbble.

There’s also a Flickr photo group and an interstitial playlist, so you can ogle and hum along from your favorite cubicle or armchair.

See you around The Hub or right here on the world wide internets.


Categories
Free Advice glamorous industry

Web Design and Fitness

Three times a week I work out hard with a trainer at a gym. It’s like sex. I don’t mean it feels good. On the contrary, it hurts. And I don’t mean there’s cuddling after. What makes my hard workouts like sex is that they’re followed by a spacey bliss in which there is no atom of desire. When I’m lying on that post-workout stretching table, gazing vaguely at the ceiling, Christina Hendricks could sashay by wearing a G-string made of thousand dollar bills and carrying a plate of spaghetti, and there’s nothing I would want from her.

Our industry rewards long hours in the cubicle and for many of us, it shows—especially as we get older.

Sometimes I wonder whether I became soft because of what I do, or chose what I do because it suits a lifestyle in which “physical activity” means answering the door when the pizza guy arrives.

For years I worked out three times a week, but with no results—partly because I didn’t know what I was doing, and the rest because when it got tough or boring, I quit. Hence the trainer.

The good client

My trainer tells me what to do next and I just do it. She’s the expert, I’m the client. I value her wisdom and experience and try to make each session a learning experience as well as a cardiovascular one.

I’m fortunate to have had good and bad clients. I know how to be a good client. The real value of a client services relationship isn’t what happens during the hours when client and consultant work together; it’s about what happens after. Like everything meaningful in life, the client services relationship is about change.

We don’t create taxonomies, layouts, content strategies and templates as a one-time deal, so the client’s content and design can be frozen in amber. We create them so the client has a framework for continuing to evolve their website into the future, with or without our help. Good clients know this. And they also know that, regardless of time and budget, we can’t do everything for them.

They know that it’s better to concentrate on getting a few things right than to try to cram every conceivable wish and feature into their time with us. Trying to do everything is a way to achieve nothing. Focus, concentration and form are what’s important. Consistency is what’s important. It’s all about the process. As in client services, so at the gym. End analogy.

Modest goals, steady commitment

I’m never going to look like Arnold, and that’s not my goal. My goal is to live a bit longer, and to enjoy life more. I already enjoy walking upstairs a lot more than I used to. Even when I’m alone on a Sunday afternoon, I’m more likely to do something physical (even if it’s just taking a photo walk instead of sitting at the computer) than I was two months ago.

And when I do sit at the computer, I’m more alert, more focused, less likely to need an artificial stimulant to get through my day.

There’s nothing special about what I’m doing, except that I’m doing it. Some old friends and some people I work with inspired me by their example. To them, thanks. Also to my ex, who advised me to give myself this gift.

Starting this weekend, I’ll be in Boston for An Event Apart. Travel usually translates to bad (i.e. overly rich) eating, which can undermine a fitness regime. Between creamy Boston clam chowder and the piles of candies and cakes with which our event planner Marci punctuates An Event Apart sessions, temptation will be everywhere. And while I can’t promise to be perfect, I will strive to put my heart before my sweet tooth.

Categories
Dan Benjamin HTML5 Ideas industry Interviews podcasts The Big Web Show Zeldman

Big Web Show Today

The Big Web Show

Live today at 1:00 PM Eastern, watch Jeremy Keith, author of HTML5 For Web Designers, discuss markup and other matters with Dan Benjamin and me on The Big Web Show. Your live calls are welcome.

  1. The Big Web Show
  2. Episode 1: Web Fonts
  3. HTML5 For Web Designers
  4. Jeremy Keith

Categories
Announcements Applications Code Design development editorial Education HTML HTML5 industry Jeremy Keith Publications Publishing Web Design Web Design History Web Standards Zeldman

HTML5 For Web Designers

HTML5 For Web Designers, by Jeremy Keith.

WHEN MANDY BROWN, Jason Santa Maria and I formed A Book Apart, one topic burned uppermost in our minds, and there was only one author for
the job.

Nothing else, not even “real fonts” or CSS3, has stirred the standards-based design community like the imminent arrival of HTML5. Born out of dissatisfaction with the pacing and politics of the W3C, and conceived for a web of applications (not just documents), this new edition of the web’s lingua franca has in equal measure excited, angered, and confused the web design community.

HTML5 For Web Designers

Win free copies of HTML5 For Web Designers on Gowalla!

Just as he did with the DOM and JavaScript, Jeremy Keith has a unique ability to illuminate HTML5 and cut straight to what matters to accessible, standards-based designer-developers. And he does it in this book, using only as many words and pictures as are needed.

The Big Web Show

Watch Jeremy Keith discuss HTML5 with Dan Benjamin and me live on The Big Web Show this Thursday at 1:00 PM Eastern.

There are other books about HTML5, and there will be many more. There will be 500 page technical books for application developers, whose needs drove much of HTML5’s development. There will be even longer secret books for browser makers, addressing technical challenges that you and I are blessed never to need to think about.

But this is a book for you—you who create web content, who mark up web pages for sense and semantics, and who design accessible interfaces and experiences. Call it your user guide to HTML5. Its goal—one it will share with every title in the forthcoming A Book Apart catalog—is to shed clear light on a tricky subject, and do it fast, so you can get back to work.


4 May 2010
Jeffrey Zeldman, Publisher
A Book Apart “for people who make websites”
In Association with A List Apart
An imprint of Happy Cog

The present-day content producer refuses to die.

And don’t miss…

Categories
Apple Applications apps architecture Design industry Information architecture ipad Platforms Usability User Experience UX Web Design

Design Lessons from iPad

Comparison of iMac and iPad screens at informationarchitects.jp.

It’s only Wednesday but we already have our link of the week. Although they call it merely a “quick write-up” (and it is a fast read), iA’s mini-compendium of design insights before and after the appearance of the iPad at their office should be required reading for all web, app, and/or interaction designers.

In the equivalent of a breathlessly quick seminar presentation, iA discusses typographic resolution and feel; the effect of the device’s brilliant contrast on readability; the kitsch produced by rigorously adhering to Apple’s “make it 3D” guidelines; whether metaphors work; and more—all of it well worth far more than the little time it will take you to absorb.

In particular, I call your attention to the section entitled, “Interaction Design: So What Works?” Although intended as a guideline to producing well-tuned iPad apps, it also works splendidly as a mini-guide to creating better websites, much like Luke Wroblewski’s brilliant “Mobile First” presentation at last week’s An Event Apart, which carried a similar message:

  1. The limited screen estate and the limited credit on the number of physical actions needed to complete one task (don’t make me swipe and touch too often), pushes the designer to create a dead simple information architecture and an elaborate an interaction design pattern with a minimal number of actions. This goes hand in hand with the economic rule of user interaction design: Minimize input, maximize output.
  2. Since the smallest touch point for each operation is a circle of the size of a male index finger tip, we cannot cram thousands of features (or ads!) in the tight frame; we have to focus on the essential elements. Don’t waste screen estate and user attention on processing secondary functions.
  3. We found that the iPad applications we designed, made it relatively easy to be translated back into websites. The iPad could prove to be a wonderful blue print to design web sites and applications. If it works on the iPad, with a few tweaks, it will work on a laptop.

Via iA » Designing for iPad: Reality Check.

Categories
industry Standards State of the Web

Courts Imperil Net Neutrality

In a ruling that could derail the Federal Communications Commission’s attempt to craft net neutrality rules, a federal appeals court said Tuesday that the agency lacked authority to sanction Comcast for throttling peer-to-peer traffic.

… Broadband advocates who had urged the FCC to take action against Comcast condemned the appellate ruling, saying that it could prevent the commission from enacting any regulations that could affect how broadband is delivered.

“The consequences of this decision go well beyond net neutrality and well beyond the matter at hand,” says S. Derek Turner, research director at Free Press. The ruling, he says, “has left the agency unable to protect consumers in the marketplace.”

Fed Court Rules FCC Has No Authority In Net-Neutrality Case 04/07/2010.

Categories
3e Blogs and Blogging Design DWWS industry Interviews

DWWS3e Live on Boagworld

There’s been a lot more opportunities for just thinking outside the very strict design parameters that we usually work with. Then just thinking about not just designing for any particular device but a particular context. Because even if you are on a mobile phone, if you’re viewing something on a subway in the morning versus in the middle of the office at 10:30, your environment sort of dictates how you want to interface with a particular piece of content. That’s really what’s been firing me up as a long term proponent of flexible designs, letting the user dictate the experience. I sort of see that as the next step, thinking beyond the desktop.

Ethan Marcotte and I talk about the third edition of Designing with Web Standards and discuss the future of the web—a podcast by Paul Boag, with full transcription.