New Browser Windows = Very, Very Bad. Really.

As a professional web developer, it’s shocking to me how many clients (usually but not always marketing droids) still insist that any and all links pointing off-site — or even to other sections of a large site — must open in a new window. More shocking is how many of them actually think it’s a great idea that benefits both them and the user. Nearly 13 years after the advent of HTML frames made opening new windows from a link all too easy, and after fully a decade of ongoing pleas and indoctrination from usability and accessibility gurus, I can’t believe how frequently I have to re-fight this battle and educate misguided clients on the folly of this “strategy.”

For typical users, gratuitous new windows are only slightly less annoying than sites and pages that forcibly resize your browser window. If I wanted a new damn window, I’d have used “open in new tab” or “open in a new window” my own damn self! I know how to use a back button, and I know how to use bookmarks. Forcing new windows on your visitors is amateur hour. It’s arrogant, it’s insulting, and it’s very 1997.

It’s much worse for users relying on assistive technologies, including (but not limited to) screen readers, for whom new windows and pop-ups can severely hamper the ability to navigate your oh-so-self-important site.

Now, what do you do when you encounter a painful stimulus? You avoid it, of course, and probably quietly curse whoever caused your pointless pain. At that moment, your site becomes associated with annoyance. Is that really what you want? I’m guessing not.

In my considered judgment, new windows (or pop-ups if you absolutely must) are only justified — even advisable — when linking to digital media: PDFs, MS Word or RTF files, video, audio, and the like. Other than that, forget it. Don’t insult — or cripple — your users.

Following below, for future reference, are a number of the hundreds of specifications, studies, and articles which hammer home the point.

Do not open new windows – a dire user experience
http://www.simiusweb.ie/news/2009_11_10_why_not_open_new_windows.htm

Rebuts the main reasons people think they need to open new windows, and explains why it is such a terrible idea. (With supporting links from accessibility and usability experts…as early as 1999.)

“Opening new windows creates frustration, anger and leads to users leaving your site and ultimately a loss of business.”

“…Breaking news: users know how to use the back button. …[U]sers are not stupid.”

“There are solid business and technical reasons for not opening new windows. There is little or nothing in the way of an argument in favor of them.”

W3C Web Content Accessibility Guidelines (WCAG) 1.0
http://www.w3.org/TR/WCAG10/#gl-interim-accessibility

Checkpoint 10.1: “Until user agents allow users to turn off spawned windows, do not cause pop-ups or other windows to appear and do not change the current window without informing the user.”

WCAG 2.0 – Success Criterion 3.2.5: Change on Request: Changes of context are initiated only by user request or [if] a mechanism is available to turn off such changes. (Level AAA)
http://www.w3.org/TR/UNDERSTANDING-WCAG20/consistent-behavior-no-extreme-changes-context.html

WCAG 2.0 – F22: Failure of Success Criterion 3.2.5 due to opening windows that are not requested by the user
http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/F22

“Beware of opening links in a new window”
http://www.webcredible.co.uk/user-friendly-resources/web-usability/new-browser-windows.shtml

“Dive Into Accessibility: 30 days to a more accessible web site. Day 16: Not opening new windows.”
http://diveintoaccessibility.org/day_16_not_opening_new_windows.html

“Avoid forcing to open in a new window”
http://www.webnauts.net/new-window.html

“Radical changes of focus in a GUI environment are extremely disorienting to blind users who are navigating by screen reader, and thus can be considered discrimination against the visually impaired.”

“Links to New Windows, Pop-ups, Other Frames, or External Web Sites”
http://www.webaim.org/techniques/hypertext/hypertext_links.php#new_window

IE6 Transparent PNG Backgrounds…With Repeat and Positioning?!

It’s brand-spankin’ new and I haven’t tried it myself — so caveat emptor — but Drew Diller has posted a JS widget he calls DD_belatedPNG, which purports to not only get IE6 to display both inline and background transparent PNGs correctly but to actually permit the use of the background-position and background-repeat CSS properties.  The latter is not possible using the MS-proprietary AlphaImageLoader filter, making this capability something of a holy grail for compatibility-conscious web devs.

What the thing does is dynamically grab the PNG it’s told to, then use an MS “behavior” to recreate it as a VML node, and then insert that VML node back into the document, replacing the original PNG.  Unlike AlphaImageLoader, VML honors all of the expected CSS properties.

One drawback is the script has to be explicitly told which element(s) to grab, though at least one can use standard CSS syntax. This makes implementations in, say, a CMS-driven environment more problematic.  But if the thing works reliably and without leaking like a sieve, it could restore a little sanity and flexibility until that glorious day when IE6 is finally staked through the heart and forgotten forever, amen.

WCAG 2.0 Moves to Proposed Recommendation Status

On Nov. 3, 2008, the W3C‘s Web Content Accessibility Guidelines (WCAG) Working Group published Web Content Accessibility Guidelines 2.0 as a Proposed Recommendation.

WCAG defines how to make Web sites, Web applications, and other Web content accessible to people with disabilities. “Proposed Recommendation” means that the technical material of WCAG 2.0 is complete and it has been implemented in real sites. This is the last step before WCAG 2.0 becomes the official standard.

The WCAG Working Group is welcoming final comments on WCAG 2.0 through 2 December 2008, less than a month away.

I highly recommend that every single person in the web business read this stuff carefully. If you have something constructive to contribute to the discussion, now is the time.

WCAG 2.0 will supersede WCAG 1.0, which has been the operative accessibility standard since 1999. There are some important changes to the standard that all coders, IAs, and designers should take note of, and it’s worth noting that there have been periods of considerable controversy during WCAG 2.0′s adoption process.
Current official working drafts of WCAG 2.0 primer documents:

Read the official announcement. Check the latest changes and status of WCAG 2.0.

jQuery to be Included in Microsoft Visual Studio. Reports of Airborne Pigs Skyrocket.

Those of you who care may well already know since it was announced about a month ago now, but Microsoft has announced that it will be including the excellent JavaScript library jQuery in future releases of their main development tool, Visual Studio. Best of all, MS says they won’t fix what ain’t broke — jQuery (and its documentation) will be included 100% as-is, with no modifications and with the MIT open source license intact, and intellisense will be fully functional with it. Any proposed changes, enhancements, or bug-fixes will be submitted to the jQuery team, just like everyone else does. Even more incredibly, later this year jQuery will be supported 24×7 by Microsoft’s Product Support Services (PSS) just like any MS product.

This is pretty much gob-smacking news, especially given Microsoft’s open hostility to open source. For those who have sworn like grizzled sailors trying to use the ASP.NET AJAX stuff in something resembling a decent cross-browser fashion, this announcement will no doubt prompt dancing and screams of joy.

jQuery will not be replacing the ASP.NET AJAX libraries but augmenting them, and moving forward the VS crew will be using jQuery to “implement higher-level controls in the ASP.NET AJAX Control Toolkit” and other such like. The new ASP.NET MVC download will also distribute it, and add the jQuery library by default to all new projects. Fortunately, since jQuery is so well architected it already plays very nice with the existing ASP.NET AJAX gizmos.

Updating the jQuery library will reportedly be as simple plopping the new one over the old, though as always you may need to tweak your code slightly or write a compatibility module or something.

Don’t pinch me, I don’t wanna wake up.

Here’s some relevant linkage, lest you think I’m smoking crack:

Prototype API Documentation Search Bar Add-On

The Prototype JavaScript framework is a fine thing, and the Prototype API Documentation online reference is obviously indispensible. The only problem is that currently the Prototype site has no site search, except for the API Search Bookmarklet which will only retrieve for specific method names (which is certainly useful but somewhat limiting, since it assumes you already know what you’re looking for and is not a free-text search).

So, after one too many searches on Google using site:www.prototypejs.org/api/, I wrote a couple search bar add-ons that simply uses the same Google trick to perform full-text searches of the API docs on the Prototype site.

There are two different versions — one for Firefox and one for IE7 (which has a slightly crippled implementation of the OpenSearch protocol…go figure).

Install the Prototype API Documentation search bar add-on here. (Sorry: Firefox and IE7 only.)

2007 WebAward Winner

One of the sites I helped build has won a 2007 WebAward from the Web Marketing Association.

The site for San Francisco’s Yerba Buena Center for the Arts won an Outstanding Website award, recognizing “work above and beyond the standard of excellence.”  WebAwards were also won by six other sites created by POP.
Screen capture of the YBCA.org home page

Here is the team from POP that worked on the site:

Account Director: Jennifer Showe
Designer: Brad Holst
Information Architect: Minoru Uchida
Flash Designer: Dave Curry
Flash Designer: Aaron Hedquist
Web Developer: Spencer Sundell
Software Developer: Keith Richardson

My own work included interface integration with the online ticketing application, creation of page templates (XHTML, CSS, JavaScript, images) and related documentation used by YBCA’s internal web staff for migrating their content to the new site, a fair amount of content migration of our own, and related tasks. The site also uses a little sIFR dynamic font replacement.

It’s a beautiful design and I’m pretty proud to have worked on it, though I do wish I could have optimized a few things a little further (like the olde school legacy markup on the event calendar).

Congratulations to the team at POP, and to the folks at YBCA.

The other POP sites that won 2007 WebAwards are listed below — mad props to everyone who worked on those:

Random stuffs

What’s this fascist Dick hiding, anyway?

An above-average Sun Ra discography

The mighty Ivor Cutler on the John Peel show (thanks, Hell’s Donut House)

Weekly experimental music concerts at The Chapel in Wallingford (Seattle)

Dope-ass Vermont

Swanky “file browse” stylings (and another)

14 Rules for Fast Web Pages (excellent: summarizing Steve Souders’ presentation at Web 2.0, with links to the PowerPoint [very recommended] and all the references)

More optimization: “Performance Research, Part 4: Maximizing Parallel Downloads in the Carpool Lane” (YUIblog — related to the above)

More optimization: Optimizing Page Load Time (see bottom for additional links)

Why brain-teaser interview questions are stoopid

Bitchen 16mm scanned telecine machine (3 CCD coming soon, they say)

Official Forrest J. Ackerman site

The Online 78rpm Dicographical Project

The one and only Travis (ex-Ono)

Impressive synth sharity

And did I mention Vincent Collins?

Windows Vista! It’s Spook-erific!

Although just about a month old now, this news item just crossed the ol’ Brainpain today…

For Windows Vista Security, Microsoft Called in Pros

By Alec Klein and Ellen Nakashima
Washington Post
Tuesday, January 9, 2007

When Microsoft introduces its long-awaited Windows Vista operating system this month, it will have an unlikely partner to thank for making its flagship product safe and secure for millions of computer users across the world: the National Security Agency.

For the first time, the giant software maker is acknowledging the help of the secretive agency, better known for eavesdropping on foreign officials and, more recently, U.S. citizens as part of the Bush administration’s effort to combat terrorism. The agency said it has helped in the development of the security of Microsoft’s new operating system — the brains of a computer — to protect it from worms, Trojan horses and other insidious computer attackers.

“Our intention is to help everyone with security,” Tony W. Sager, the NSA’s chief of vulnerability analysis and operations group, said yesterday. [cough]

The NSA’s impact may be felt widely. Windows commands more than 90 percent of the worldwide market share in desktop operating systems, and Vista, which is set to be released to consumers Jan. 30, is expected to be used by more than 600 million computer users by 2010, according to Al Gillen, an analyst at market research firm International Data.

…”I kind of call it a Good Housekeeping seal” of approval, said Michael Cherry, a former Windows program manager who now analyzes the product for Directions on Microsoft, a firm that tracks the software maker. …

Yyyyeah. Duly noted.

Read the full article at the link above. Although…I would be remiss to not quote the following as well:

…Other software makers have turned to government agencies for security advice, including Apple, which makes the Mac OS X operating system. “We work with a number of U.S. government agencies on Mac OS X security and collaborated with the NSA on the Mac OS X security configuration guide,” said Apple spokesman Anuj Nayar in an e-mail.

Novell, which sells a Linux-based operating system, also works with government agencies on software security issues, spokesman Bruce Lowry said in an e-mail, “but we’re not in a position to go into specifics of the who, what, when types of questions.” …

IE6 and IE7, Side By Side

One of the banes of web developers’ existence is when a new version of Internet Explorer gets released. That’s because you can only run version of IE on your machine at a time, yet for some months after the release date the responsible web dev is obliged (sometime contractually) to build sites that work and look right proper in both the outgoing version and the new version. And those versions never, ever, ever work the same when it comes to client-side code.

In the past, one had to rely on kindly maniacs who managed to cobble together some sort of stand-alone approximation of the outgoing version that would run on a system running the current (new) version. There’s been a couple problems with that: there’s no real guarantee the fakey standalone really worked exactly like the IE version it was approximating (which is critical when coping with, say, CSS or DOM anomalies) and, perhaps more importantly, god only knows what the thing might do to your box. And nevermind worries about virii. Heavy sigh. Where I work, we’ve been leaning toward installing a local VMWare instance of Windows running IE6 just for this purpose. Less disaster-prone, perhaps, but no less a pain (not to say that VMWare doesn’t rock — it definitely does). And then there’s the OS licensing thing. MS is a little picky about that.

Well, after seven-ish years and 2 browsers versions of that nonsense, Microsoft has seen some kinda light and made available to the dev community an actual, gen-yoo-ine, sanctioned standalone of IE6. The catch? It’s still a Virtual PC image, but hey at least it’s sanctioned, right?

Anyway, get all the details from “IE6 and IE7 Running on a Single Machine” on the official IEBlog.

(Um…but is anyone else besides me slightly unnerved by an MS widget that “time-bombs” on April Fools Day? I’m just askin’.)

Thanks to B.F. for the refer.

PNG Color Gamma Issues in IE7, and a Workaround

IE7 finally has support for PNG transparency without having to use clunky, pain-in-the-butt proprietary filters. Huzzah. However, it’s not entirely smooth sailing with PNGs in that browser.

The latest SitePoint Tech Times newsletter has a worthwhile read about PNG’s native gamma correction trip and how it causes problems in IE7.

“PNG images,” SitePoint explains, “can also contain a gamma correction value, which is meant to represent the relative brightness of the display on which the image was created. In theory, the browser can use this value to display the image at the exact same brightness on another display.”

In practice, tain’t really so. The problem can come when trying to match color(s) in the PNGs to CSS colors, which of course have no gamma correction. Result: total, hopeless mismatch and a gnashing of teeth.

I first ran into this some months back with an older version of Safari. Photoshop’s “Save for Web” doesn’t give you the option of not saving gamma info, and despite spending the better part of a day at the time researching the issue I was not able to find a workaround. (Though Henri Sivonen’s “The Sad Story of PNG Gamma ‘Correction’” was most informative about the background.)

Since then, things have changed a little. Current versions of Safari, Firefox, and Opera all natively ignore any gamma data in PNGs. However, the brand-new IE7 honors the PNG spec strictly and parses the image’s gamma as instructed. Ironic, isn’t it? Also a major drag for web devs, since IE7 will be the majority browser in no time.

Thankfully, SitePoint’s newsletter refers us to a handy utility called TweakPNG that is free and open-source…though Windows-only (sorry). As SitePoint explains, “Simply drag a PNG to the program window and delete the ‘gAMA’ chunk from the list before saving the file. While you’re at it, you might as well delete the ‘tEXt’ chunk as well, to save a few extra bytes of file size by removing Adobe’s stamp on the file.”

For Mac, one has to resort to installing ImageMagick (which can sometimes be a bear to compile depending on the trip with libraries familiar to all Linux nerds) and running commands via the terminal (see the article for details).

Even with all of that you’ll be out of luck with Safari 1.x “which arbitrarily corrects PNG images even when they contain no gamma information.”