blogZero

What's this, no multi-page post today—complete with code examples and links all over the place? Instead, I did some house cleaning, and added a new wing. JavaScript has been such a hot topic around here of late, and in the Web development community in general, that I took a look at my growing list of resources and discovered that indeed, the JavaScript category was in need of some pruning. Amongst the list, and in particular by studying the most popular tags, I found that JavaScript libraries would make an excellent category to splinter off and reduce the weight in the parent folder. I know, I know, I need to implement paging. PHP is another one that grew out of its clothes.

Speaking of implementing paging (and caching and a lot of other things on my todo list), I have been really busy behind the scenes fixing bugs and making other improvements to both this blog and loadaverageZero in general. Some of them my visitors may have noticed, some may not. But things are definitely on the upswing around here since health has improved.

One thing that really has me puzzled is what to do with this blog. I'm running a rather old, and hacked to pieces, version of Serendipity. I don't want to let go of the design, which I spent a lot of time on, yet on the same token it bothers me that my only recourse to block spammers and other miscreants was to disable comments and trackbacks. I'm not a big fan of Captchas, I would prefer to go the OpenID route.

Anyway, I'm starved and I haven't been to the diner for some good old eggs and bacon in ages...

The past month has seen a fair share of rumors flying around about AdSense revenue generated by the Firefox Search Bar—when the default Google search engine is used of course. In January, Blake Ross published his first book, Firefox For Dummies. If he decides to write another one, would this be the title?

This brilliant piece of humor and artwork was created by designer Jamey Boje of graphicsguru.com.

As far as the grapevine goes, you can speculate all you want and total dollar amounts are irrelevant. The hardworking Mozilla team has brought us some incredible products and they deserve support on all sorts of levels, including financial ones. No organization can compete with the likes of Microsoft without revenue.

If you want to show your support but prefer a more direct approach, head over to the Mozilla Store. They have plenty of cool swag and other stuff. I have a Firefox t-shirt, coffee mug and, if they ever get the Mozilla logo in shirt sizes other than XXL, I will order one of those too.

For more information on Blake Ross, visit his Wikipedia page.

I've been wondering why Shirley Kaiser over at Brainstorms and Raves has been so quiet lately. Turns out, she's been hard at work on a complete redesign for WebsiteTips.

I've always felt the site was an excellent compliment to drx, since we have similar approaches. For instance, both provide a nice overview for each category and have carefully designed navigation systems. Her site is geared more towards designers (Color, Fonts, Graphics, Typography, Design and Layout) while mine tends to be programmer centric. When it comes to things like Markup, JavaScript CSS, and Accessibility, there is some overlap.

Before I go looking foolish, I am aware of the tenure gap—did you know WebsiteTips has been on the map since 1996? And no, I didn't copy her style. In fact, I only discovered WST last year during a period of researching sites that focused on design, since this is not one of my strengths. I admire thoroughness and careful planning, which I recognized immediately. As if to drive this point home, Shirley has even set aside an entire page to explain all aspects of the new design. Kind of reminds me of my Help page, which started out as a simple idea and quickly grew into a big project.

What's that old idiom, "Great minds think alike?" Nice work Shirley!

PS. If this post seems a little belated, I apologize. Between recovering from SXSW and having my laptop out of commission (the machine I usually use for reading feeds), I'm still playing catch-up over here.

Related posts: Evolt Redesign Contest.

On a tip from Krista at Digital Web Magazine, I learned that O'Reilly's seminal Web Design in a Nutshell by Jennifer Niederst was recently released in a 3rd edition. This is good news since the 2nd one was getting a little dog-eared and needed to play catch-up with the latest trends and techniques. I hope O'Reilly is planning on doing the same for Webmaster in a Nutshell.

Acclaimed accessibility advocate Derek Featherstone and Digital Web contributing author Aaron Gustafson both invested some of their time in the Nutshell project, and today A List Apart has published an excerpt from Aaron's work titled Getting Started with Ajax. The article does a good job of introducing Ajax concepts, including the JavaScript XMLHttpRequest object, various data formats that can be returned from such calls, and how to update the DOM of the page with the requested data. Aaron uses the simple XHConn interface library in his examples, and provides sample code, both markup and JavaScript. Keep in mind that ALA is not a programmer's magazine (any more than Digital Web is), so do not expect gory details here. But it is important for designers to understand Ajax development since it is a client-side technology. Or at least the designer's half of the equation.

And this leads to my point, something I plan on asking as many designers as I can corner at SXSW—in this day of Rich Internet/Web applications and Ajax (I really hate to mention Web 2.0), do you see the line between designer and programmer blurring a bit more? If you're not able to make it to the convention, feel free to post your viewpoints here, regardless of whether your area of expertise is design or code.

evolt.org is looking for entries in a Design Contest.

Over the years, evolt.org has had a number of designs, produced and implemented by a small group of admin evolters. We've come a long way in developing the design in the 7 years we've been in existence, including this current iteration, which we've lived with for over 6 months since we replatformed the site last summer. In that time, we've progressively opened up the running of the community. But now we'd like to go a step further and open up the design too. Here's your opportunity to stamp your own creativity on evolt - we'd like you (yes, you) to redesign this site.

If interested, you should review the rules and the Evolt styleguide. The design will be based on a set of standards compliant Drupal templates and heavy use of CSS for presentation. They have a test site you can use to work out the details. Submit your proposal by emailing the forum mailing list.

Contact Martin Burns for additional details.

Well boys and girls, in just one weeks time those who can make it will be jetting down to Austin, Texas for the South by Southwest 2006 Interactive Festival. If you are lucky enough to have the whole week off you can stick around for the music and indy film festival as well. I've never been to Austin myself, but I have an old friend who lives there. So I will also be taking the opportunity to hang out with him, and he knows the area well so maybe I can coax him into stopping by to share some tips on good places to eat and the famous local music scene.

I thought I would take a few moments to share with everyone what panels I find interesting and what parties I will be attending. Some of these overlap, or may fill up fast so there is no guarantee I will be at all of them. Except for the parties of course, since there will be some people at each I am looking forward to meeting in person for the first time, not to mention the free food and drinks. Oh what fun it will be to snap pics of drunken digerati and upload them to Flickr so I can post them to this blog later.

Saturday, March 11th

• How to Bluff Your Way in DOM Scripting [Jeremy Keith]
• Creating Building Blocks for Independents [Tantek Çelik]
• Starting Small: Web Business for the Rest of Us [Nick Finck]
• South by Northwest [Blue Flavor, Newsvine]

Sunday, March 12th

• Making Web 2.0 Accessible [Derek Featherstone]
• Flickr, Upcoming.org, and del.icio.us in the company of Yahoo!

Monday, March 13th

• Web Standards and Search Engines: Searching for Common Ground [Molly Holzschlag]
• CSS Problem Solving [Dave Shea]
• Microformats: Evolving The Web [Tantek Çelik]
• WaSP Task Force Panel: Getting the Job Done Right [Drew McLellan]
• Ambient Findability [Peter Morville]
• Design Eye for the List Guy [Keith Robinson]
• WaSP Annual Meeting [Jeffrey Zeldman]

Tuesday, March 14th

• RSS: Not Just for Blogs Anymore [Christopher Frye]

Note that each panel consists of several speakers, all of them worthy of mention. I am simply listing the person I am most familiar with. Parties are indicated in green (is there really any need to post links to the sponsors of the second one?)

I'm looking forward to seeing everyone there!

I am a huge hockey fan and I can't wait to watch the finals later today, with Sweden set to battle Finland for the Olympic gold. So why am I blogging about it here? Well, partially because it's Sunday and I like to post something a bit more light-hearted on weekends, but mostly because there is a strong connection between what interests me and these two Nordic countries. I've also heard both boast a large and enthusiastic community of ice hockey fans.

Sweden — Web Development

• 456 Berea Street. A blog by Roger Johansson, with a well-deserved reputation for upholding best practices and sharing techniques. A favorite of Web design and development blogrolls the world over.
• Robert's talk. Robert Nyman is another rising Web development blogger. I visit his site often, and you should too. I'm also looking forward to meeting him at SXSW next month.
• Autistic Cuckoo. Sadly, Tommy Olsson is no longer contributing to his blog. But he hasn't taken it down and there are plenty of excellent articles still there to study and bookmark.

Finland — Internet Technology

• Linux. Created by Linus Torvalds while a student at University of Helsinki, Finland, Linux has made such an impact on computing, and especially its use as a Web Server platform, that it's hard to say what the landscape of the Web would be like without it. I work from dozens of Linux hosts, along with the equally popular (at least in terms of Web hosting) FreeBSD open-source operating system.
• IRC. A multi-user, instant messaging/chat system created by Jarkko Oikarinen, IRC is used by open-source teams the world over. Some of the better known channels are provided by freenode, including developers chatting about Apache, many Linux distributions, MySQL, the W3C, Wikipedia, and countless others. Probably the best known of open-source IRC channels are those hosted by the Mozilla IRC Network, and many users rely on the Chatzilla Firefox extension to connect.
• SSH. The Secure Shell protocol and family of client programs was first developed by Tatu Ylönen at the Helsinki University of Technology. The OpenBSD project followed up a few years later with a free implementation, OpenSSH, which you will find pre-installed on all of the operating systems previously mentioned (and many others). Anyone still using telnet to connect to remote servers is living in the dark ages.

So, in a way I guess it's kind of like the the right brains against the left. Update: I've just heard that Sweden won, which is good since that's who I was rooting for. Not for the reasons you're probably thinking, rather because I'm a huge Red Wings fan and about half the Swedish team is made up of some of my favorite players. But I don't want to hear anything more—because of the time difference here in the US the game hasn't been televised yet!

I'm not a graphic designer, not by any stretch of the imagination. I can fire up Photoshop and do a few things. I also know enough CSS to be dangerous. But that's about it. By now, unless you are a first time visitor, you've probably come to the conculsion that I'm a bit of a nut when it comes to icons, especially those tiny little 16x16 pixel "favicons." I like them because they serve as mnemonic bullets, they remind me which tab is which because my browser usually has a dozen or more open at the same time, they sit up in your address bar next to the URL, and so on. I also have a wee bit of a petite fetish, hahahaha.

Every site in my review of developer resources has an associated icon. Often this is as simple as grabbing the one the owner has already designed. I don't see this as stealing since I am linking to their content, and it helps brand their presence on the Web. I've never had a complaint anyway. In some cases, I've had to be creative though (and when they turn out well I will usually send the results back to the owner of the site). So here are some tips I've learned along the way. Warning: I am not a Mac user (although I would dearly love to get my hands on one for a number of reasons), so some of these tips are specific to the Windows platform. I know, yuck, I know.

Like I said, I'm no designer, but my friend Jamey (of Mozilla/Firefox graphics and logos fame) is. To get you started, he has a nifty little tool that you can use to create favicons right from your browser. Also included are instructions on how to upload and install them on your site.

“I enjoy giving back what's been freely given to me.”
—Jamey ‘graphicsguru’ Boje

Since I just mentioned Firefox, here's a quick and dirty trick: If you're running version 1.5 or higher, just right click on any image on a Web page and select "View Image" to bring it up apart from other content. Notice how the browser automatically produces a condensed 16x16 version of the image in your address bar?

Which logically leads to my next tip: Screen capturing existing icons. 99% of the time this is how I acquire them. I've found it to be much more efficient than checking the source, downloading the image and, if necessary, converting it from .ico format to GIF or PNG. I have found GIF to be the best in terms of file size (if you use a lot of them like I do, the smaller the better—many of my icons are less than 100 bytes!), and across the board browser support for transparency. For drop-dead simple, the free and effective ScreenHunter from Wisdom Software does the job well. Of course, if you are lucky enough to find the icon you are looking for right on a Web page, all you have to do is drag and drop it into a folder or onto your desktop.

But you will still need to edit these small image files, and using Photoshop is like hitting a pushpin with a sledgehammer. I have to say, I looked and I looked and I tried and I tried and the only one that did anything for me is IconXP, from Aha Soft. It's got just what I need, without a whole lot of extras that will just get in the way. It's shareware so it's free to try and cheap to buy.

And finally, sometimes what you really need a little inspiration. And I can't think of a better source than the prolific work of Jakub Steiner and Tuomas Kuosmanen (of Gnome desktop fame).

“At 16x16, you're not limited. You're empowered.”
—Jakub ‘jimmac’ Steiner

Google has the mother of all datasets when it comes to a repository of Web page markup. Recently, the Google Code project released a set of stats on authoring techniques, sampled from over a billion documents. To view the results you will need a browser that supports both CSS and SVG. Firefox 1.5 is a good choice.

The overview cites both John Allsopp's study of semantics and François Briatte's design survey. Interestingly, it also mentions microformats.org and even a study done by Mozilla completed using their JavaScript Web Spider. Also noteworthy: Google admits they are “not leading the way in terms of validation.”

There is a lot of material to go over here, and among the most interesting bits are the frequency (popularity) charts that describe the distribution of class names used by developers. It turns out the most popular map consistently to the elements that are being proposed by the WHAT Working Group's so-called HTML5:

• header
• menu
• nav
• article (content, main, text...)
• footer

This list happens to be in structural order, as it turns out footer is the most popular class name. I use all of them, as do many people (my ego informs me perhaps I contributed to these stats). I can't help thinking of this as a sort of social tagging system, in which popular class names define semantics and drive the design of markup languages by consensus.

We are the Web—good stuff.

John is looking for Web site design patterns. Here's my contribution:

Pattern type: Site
Pattern name: Social Bookmarks
Also known as: Folksonomy, Shared Favorites
Examples: del.icio.us, digg, reddit, furl, jots

Description:

A shared collection of links (URLs) that, unlike in traditional categorized lists (taxonomies), the user can freely assign keywords or "tags" to each bookmark.

Comments:

Some collaborative lists are restricted to a certain subject area such as technology, while the majority are general in scope. Most bookmarking sites provide features that display link relevance by popularity (weighted lists or tag clouds) and/or front page (most popular) bookmarks, RSS feeds for each tag (and often user) and a Web service API that allows developers to tap into the datasets stored by the system.