Posts in the Tech Category

I’ve been pondering reset styles over the past few months, and come to a bit of a shift in my thinking.  Here’s the result of that thinking.

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

The small changes involve a paring down of the possible quotation around blockquotes and qs.  Before, I was explicitly pushing in empty generated content boxes with content: "", but there was no need.  A simple quotes: none; takes care of suppressing any automatic quotation marks on those elements.

The much bigger change, the shift in thinking, is the removal of the inherit values in the first rule—the ones that wiped out any boldfacing, italicizing, or font variants in browsers other than Explorer.  (You can see them in the “reloaded” post.)  I know, I know, I already defended that practice:

[The inherit] effects, as seen in my development environment, will still serve the purpose of reminding me to build up the styles I actually want, and not use the browsers’ defaults as a crutch. There is the possibility of my forgetting that (for example) IE/Win italicizes em when I don’t want it to, but that’s something I’ll catch during the browser testing phase.

But over time, I’ve come to realize that this is more than just a throwaway development tool.  It really is the beginning of a baseline style sheet.  (Or can be.)  Things like boldfacing and italics are some of the most obvious textual effects readers will see, and to have reset styles that treat them inconsistently across browsers doesn’t make sense.

Of course, browsers might treat elements differently when it comes to boldness and decoration and such.  But unfortunately, without inherit as a viable solution (due to the lack of support in Explorer), we’re stuck accepting browser defaults.  This is one area where defaults are pretty well consistent across the board, so it’s a small risk to be taking.  And this certainly doesn’t preclude anyone from adding to these styles to create their own reset that explicitly handles elements like em and strong.

Which leads me to why I explicitly set ins and del.  In some browsers, inserted text is underlined.  This leads to confusion, because most people expect underlined text to be a link.  I decided to explicitly switch that off and leave a note about it, much as I did with :focus styles.

And why am I not zeroing out deprecated elements, like center?  Because they shouldn’t even be in the markup.  The way to handle deprecated elements is with something like Marco Battilana’s Big Red Angry Text, not silently neutering them.

Comments and suggestions are, as ever, welcomed.  I’m going to shift the end result to its own URL, as I promised I would long ago, so that there will be a permanent home outside of the various postings.  Hopefully that will happen before the week is out.

• Resetting Again was published on Tuesday, January 15th, 2008.
• It was assigned to the CSS category.
• There have been one hundred eighty-eight replies.

I know it was only yesterday that I mentioned the opening of registration for An Event Apart New Orleans and the other 2008 shows, but there’s already more to share: later that same day, we announced the speakers for the other three shows of 2008.  Incredible lineups, every one.  We’re beyond excited.  Check ’em out!

• Speakers Galore was published on Thursday, January 3rd, 2008.
• It was assigned to the An Event Apart and Speaking categories.
• There have been four replies.

The new year is here, and to celebrate, we’ve announced details and opened registration for An Event Apart New Orleans, to be held April 24–25, and opened early registration for the other three events of 2008:

• Boston, June 23–24
• San Francisco, August 18–19
• Chicago, October 13–14

Now you can pick the show that best fits your schedule, fiscal year, or both, and book your seats early.

One of the things we’ve always striven to create is top-notch events for (as the motto goes) people who make web sites—covering design as well as code, architecture in addition to scripting, the big picture along with the nitty-gritty.  Focusing on that vision served us and our attendees very well in 2007, and it continues in 2008.  Just check out the list of speakers and topics for New Orleans:

• Andy Clarke, author of Transcending CSS, presenting “Underpants Over My Trousers”
• Aaron Gustafson, co-author of AdvancED DOM Scripting, presenting “Progressive Enhancement with JavaScript”
• Robert Hoekman Jr., author of Designing the Obvious, conducting “On-the-Spot Usability Reviews”
• Cameron Moll, author of Mobile Web Design, presenting “Good vs. Great Design”
• Brian Oberkirch, Publisher of Like It Matters, presenting “Kick it Like Pelé”
• Jason Santa Maria, designer at Happy Cog, presenting “Good Design Ain’t Easy”
• Dave Shea, co-author of Zen of CSS Design, presenting “Living, Breathing Design”
• Stephanie Sullivan, co-author of Mastering CSS with Dreamweaver CS3, presenting “Design Challenges, Standards Solutions”
• Jeff Veen, design manager at Google, presenting “Designing the Next Generation of Web Apps”
• Aarron Walter, author of Building Findable Web Sites, presenting “Findability Bliss Through Web Standards SEO”

And, as always, your hosts:

• Eric Meyer, author of CSS: The Definitive Guide, presenting both “The Lessons of CSS Frameworks” and “Debug / Reboot”
• Jeffrey Zeldman, author of Designing With Web Standards, presenting both “Understanding Web Design” and “Web Standards: The Return of the King”

You can get more details on the New Orleans event page, including descriptions of the sessions and details on how to get the special room rate at the conference hotel, the Hilton New Orleans Riverside.

While we don’t yet have speaker lists nor schedules to announce for the other three 2008 shows, we’re working to finalize them and hope to have at least some information out shortly.  I can already say that all the shows are at the same high level, though of course each event has its own unique flavor.

Those of you who attended one or more of our shows in 2007 (yes, we did have some repeats!) may be wondering if the shows will be the same, especially since we’re returning to some cities we visited last year.  The answer there is “not at all”.  Every show of 2008 is a mix of new and returning speakers, and we’ve done our best not to repeat speakers within a given city between 2007 and 2008.  The exceptions are myself and Jeffrey, of course, but we’re both doing new talks this year.  Simply put, if you loved AEA in 2007, we’re pretty confident you’ll love it even more in 2008.

• An Event Apart 2008 Lines Up was published on Wednesday, January 2nd, 2008.
• It was assigned to the An Event Apart and Speaking categories.
• There have been five replies.

Opera fired a broadside at Microsoft today.  In accompaniment, Håkon Lie posted “an open letter to the Web community” in which he says:

To those of you who build and shape the sites and services we use everyday — and who will create those in the future — I ask for your support. You will be the ones who ultimately benefit by having a Web that works seamlessly and effortlessly across devices, browsers and is equally open to everyone. That new day is just over the horizon…

Yes, it is.  Or maybe it was, until this happened.

Look, the time to file this motion and make this appeal was in 2005, when Internet Explorer had been dead in the water for years and it was genuinely holding back web design.  Then there’d have been a case to make.  When IE7 came out in late 2006, it wasn’t a great leap forward for web development, but it did bring IE more or less in line with where browsers were at the time—which was, frankly, a pretty large leap.  After all, they were doing five years of catch-up with a pretty small team.  Now we have IE8 in development, and there is a real chance that it could push standards support forward in a significant way.

But not if developing the browser becomes more of a liability than just walking away from it altogether.

They can’t do that, you say?  Oh, but they can, and at a corporate level would probably love nothing more than to do so.  With Silverlight, there’s the opportunity to create browser-like internet applications that support no open standards, answer to no external specifications.  The IE team would likely disagree strongly with such a course, but cut funding to the team and there’s little they can do to change it.  If you think web development is horrible now, how about a future where there literally are entirely different browsers to support?  Or a future where the open web is largely shriveled and dead thanks to wide-scale abandonment by the Windows community?

I am not advocating that we hold ourselves hostage to what Microsoft, or indeed any company, might try to do.  We’re already held hostage enough to the glacial pace of the W3C (and Mr. Clarke has some ideas on how to fix that).  What I’m advocating is that rather than attacking the laggard right when he’s showing promise of catching up and being part of the team again, it might be better to help him along, maybe even say a few words of encouragement.  Unless, that is, this attack springs out of some sort of perceived threat—in which case, just say so, and don’t use web standards as a fig leaf.

I wondered, upon having this instinctive reaction unfold, whether I was completely off my rocker.  But then I asked myself what I’d think if, say, Opera or Microsoft or anyone had pulled a similar move against Netscape circa 2001, when Netscape 6.0 was out and causing widespread grief while the programmers struggled to update and fix its standards support.  The answer came back the same.

It’s the wrong move at the wrong time, sending precisely the wrong signal to Microsoft about the importance of participating in development and support of open standards, and I can only hope that it comes to a quiet and unheralded end.

• Bad Timing was published on Thursday, December 13th, 2007.
• It was assigned to the Browsers and Standards categories.
• There have been sixty-two replies.

Two months ago, we had someone essentially spam css-discuss by sending a social networking invitation to the list.  Now, I’m all for making connections, but inviting close to 8,400 people all over the world to join your favorite new social graph seems a bit, well, anti-social.  Further, there was a statement right in the invitation that sending it to someone not personally known was an abuse of the service.  Regardless, it was a violation of list policies, so we booted the offender from the list.  I followed the “never send invitations to this address again” opt-out link and reported the offender via the abuse reporting address.

I very quickly got back a reponse from the team, expressing regret over what had happened and promising to take care of it.  I suggested they domain-block css-discuss.org and webdesign-l.com (you’re welcome, Steve), thanked them for being so responsive, and that was the end of it.  Until a few days later, when I got personally spammed from the same user account.  I reported them again, this time with a bit of snark, and opted myself out.  I didn’t hear a word from anyone.

Of course, as you’ve guessed from the title, the site in question was Shelfari.  And thanks to what I’m now finding out about their practices, it’s quite possible—even probable—that the offender was Shelfari itself.

What we have here is a clear case of bad design causing negative ripple effects far beyond the badly designed site.  In the case of css-discuss, over eight thousand people got spammed through a members-only list they’d joined on the promise of high signal and low noise.  I expelled a member of that community as a result of what a site did for them thanks to bad UI.  I feel bad about that.  Had I known, I might have put the account on moderation until they could be reasonably sure things were cleared up with Shelfari instead of just booting them.  So I’ve tracked down their address and apologized, which seems the only honorable thing to do.

It may also be the case that bad ethics are as much to blame here as bad design.  This is much harder to assess, of course, but the fact that the opt-out action was completely ignored makes me much less likely to chalk it all up to a series of misunderstandings.  Even if the Shelfari team was trying to be good actors and bungling the job, it’s little wonder they’re being hung with the spammer tag (the “Scarlet S”?).  Automatically using people’s address books to spread your payload is a classic worm-spammer technique, after all.

Given all this hindsight, I’m definitely intrigued by the following passage from the mail they sent me on 14 September:

We make it super easy to invite, but some people just send to all, which isn’t really what we want.

In other words, the very thing they’re apologizing for now, the thing that has caused such a recent uproar, was known to them no later than two months ago.  So yeah, no surprise that a whole bunch of folks are not cutting Shelfari even one tiny iota of slack.

Anyway, the bottom line is this: if you’re signing up for a social networking site and they offer to contact people you know or import your address book or things of that nature, be very cautious.  And be doubly cautious if you’re signing up for Shelfari.

• Shelfarious Behavior was published on Wednesday, November 14th, 2007.
• It was assigned to the Books and Web categories.
• There have been five replies.

In an effort to get a handle on my taskflow, I went looking for an organizer application.  So far as I can tell, what I want doesn’t exist, but maybe someone can point me to it.

What I really want is a push queue for documents and other data fragments.  I’ll call it “Q”, both for the obvious phonic match as well as to score a little ST:TNG joke plus make a Cleveland arena reference.  The latter two work because I sort of envision the application as being a very powerful being as well as a large gathering place for data.

The way I envision it, I drag a file onto the main Q window and it’s added to the general pool.  Every item in Q can be labeled, tagged, commented, and otherwise meta’d half to death.  The queue can be sorted or filtered on any number of things—file creation or modification date, Q addition date, file name, containing folder, tags, labels, and so forth.  Also, every item can be assigned a due date.

When I double-click on anything in Q, it opens the original file just as if I’d double-clicked its Finder icon.  (I’m an OS X user, but translate “Finder icon” to whatever the equivalent words are in your OS of choice.)  So really, Q is maintaining a pool of aliases to the original files, plus any associated metadata.  In that sense, it’s like iTunes set to not copy added music to the iTunes Music folder in your home directory.  Yes, some people run it that way.  And like iTunes, the ability to create smart lists based on tags and comments and such would be really awesome.

I’d find Q deeply useful because as new tasks come in/up, I could drag in whatever file(s) relate to those tasks so that I don’t lose track of what I have to do, quickly tag them and set a due date, and continue with whatever I was working on.  There’s room for tons of even more useful features like synchronization across multiple computers, the ability to accept any fragment of data at all as opposed to files, and more, but the core need is a task queue.

To illustrate this with some examples from my recent workflow, I would drag in a copy or two of the IRS W-9 form, a couple of e-mail messages, an invoice, and a Word document containing a set of interview questions.  The W-9s would get tagged by the clients’ names, the invoice would be tagged and flagged, and so on.  The real key here is that they’d be add-sorted by default, so I can work on them first-come-first-served.  Of course, other approaches would be possible with other sorts and filtering.

It seems like, with all the GTD mania floating around, someone would have come up with this solution already, but my searches have so far been fruitless.  I tried a couple of applications that seemed like they might be close to what I want, but they weren’t.  Am I just using the wrong search terms, or is this something that just doesn’t exist yet?

• In Search of Q was published on Thursday, November 8th, 2007.
• It was assigned to the General, Tools, and Work categories.
• There have been thirty-five replies.

Apologies to anyone who tried visiting meyerweb in the very near past and found it broken.  I’d noticed that suddenly all kinds of comment spam were getting past Akismet and landing in the moderation queue, and was just preparing to ask the spam-fighters about it when I discovered that the blog portions of the site were throwing a PHP error about not being able to find a function I’d written into a plugin.

At which point I discovered that all my WordPress plugins had been deactivated.  I know I didn’t do that, so how they all got turned off remains a bit of a mystery to me.  I’ve turned all the ones I need back on, and things appear to be back to normal.

So Akismet wasn’t being evaded by the spam: it was simply switched off.  Good thing my non-plugin defenses caught everything that poured in during the outage.  Which, come to think of it, must all have been direct-submit spam, since there wouldn’t have been a comment form available on the entire site.  So what they were really avoiding was my direct-submission defensive plugin, not Akismet.

Well, either way, other defensive measures protected the site, so all’s well there.  I’m certainly not thrilled about the site having been largely offlined for a short period, and again, my apologies to anyone who got blocked from information they wanted.

This episode has actually given me cause to reconsider my usual preference to put site navigation at the end of the document source.  When the PHP failed, the navigation was never served up.  Had I put it at the top of the page, it would’ve been present even though the blog posts were failing.  Getting to the static areas of the site would have been possible.  Due to my structural choices, a script failure dramatically affected the usability of the site as a whole.

Something worth thinking about as I slowly work on improving the organization of meyerweb.

• Out of Order was published on Monday, October 29th, 2007.
• It was assigned to the Projects, Redesign, and Web categories.
• There have been ten replies.

During our analysis of the responses to the Web Design Survey, one of the things I thought seriously about doing was dumping the whole dataset into a database and building a web front end to query it.  Then I remembered that as back-end developer, I’m an excellent book author.  I know some MySQL and PHP, but I’m right in that sour spot of knowing enough to make the development process slow and error-prone due to my moderate but incomplete knowledge of the languages while not knowing enough to correctly design the project from the outset.  So I stuck to Excel and the like, which can be cumbersome but quickly learned.

I was a little sad, though.  I’d had the thought that if I built an interface to the survey results, it could be released publicly once we were done.  With such a tool, anyone could generate their own pivot tables without having to learn the process in Excel (or deal with Excel’s handling of enormous data files).  That seemed like a really good thing.

Well, the dataset is public now.  So how about one or more of you super-sharp developer types, the ones who didn’t check any of the boxes on the question about gaps in your back-end coding skills, doing what I could not?

The basic scope of the project would be to list the various data points (gender, ethnicity, age bracket, salary, geographic location, perception of bias, etc., etc., etc.) and let a user pick the two they want to analyze against.  So if someone wanted a table showing the breakdown of gender by ethnicity, they would pick one to go on the top and the other to go on the left.  The table generated would give those numbers.  I’d have it spit out raw numbers, but allowing the user to optionally get the results as percentages might be a nice touch.  Though then you’d have to let the user say which way the percentages are calculated: by column, or by row.

For extra deepness, one could also filter the results based on the value for a third data point.  With that sort of feature, one could get the breakdown of gender by ethnicity for only the EU respondents.  I might do it by letting the user click on a data point and then pick the specific filtering value via a dropdown.  Maybe three radio buttons: one for top, one for left, and one for filter.  Or, heck, do a whole Web 2.0 drag-n-drop interface.  That part’s not important.  What matters is giving anyone the ability to easily get numbers out of the massive dataset.

The only real challenge I can foresee is where questions allowed more than one answer, like the location of work question and the skill questions.  In the dataset, they’re just comma-separated value lists.  Those would need to somehow be broken out into subtables or Boolean columns or something.  The actual structure of the solution interests me a whole lot less than simply having one.

I’m quite sure this is the kind of thing a real programmer could create in about a day.  As I am not a real programmer any more, it would take me a month or four.  Let’s not wait.  Anyone out there able to take the idea and run with it?

• Survey Analysis Service was published on Monday, October 22nd, 2007.
• It was assigned to the Projects and Web categories.
• There have been twenty-five replies.