Archive for February, 2006

Just Do It or Cancel

Feb 06
26

I found this facinating story about the OK and Cancel dialog on the original mac. The Folklore website is absolutly facinating and gives a good glimpse into what it’s like to build an operating system.

Interestingly, Steve Capps who is mentioned in many of the stories later joined Microsoft where I had the pleasure to work with him on a number of projects including the early designs of Windows XP.

Storytelling is a interesting subtext to how software is built. If you have links to other stories of how software is built in the trenches please add your comments.

Alphabet Soup

Feb 06
22

When you present a list of choices to users it should be obvious what order is being used to present the choices. Here’s a dialog from the Open Office team. There are a couple things wrong with this dialog but I’ll concentrate on the list. I was trying to open a Visio file and I wasn’t sure if it was possible. The program recognizes a large set of document types but it’s not obvious how I’m supposed to scan the list. Since there is no obvious order I have to scroll through the entire list to check if my document type is there. If the list was alphabetic I could quickly scroll to either “V” or “M” to see if the program is in the list.

The same ordering principal is applicable when entering data. I was recently entering a form where the fields are ordered:
First Name, Last Name
Home Phone
Business Name
Mobile Phone
Home Address
Work Phone

In this case the proper order should be a cognitive order rather then alphabetic. Group all home things together, group all work things and group telephone information. This makes it easier to fill in the data because your brain mentally groups the information.
First Name, Last Name
Home Address
Home Phone
Mobile Phone
Work Phone
Business Name
Business Address

Review your UI choices and make sure the order of controls, lists and screen elements isn’t totally arbitrary.

Icon Overlap

Feb 06
21

Icons can be a great tool to quickly communicate a simple and familiar function.
Many people learn the icons for cut, copy and paste, others are familair with Print or Save. Unfortunately if you go icon-happy you can start to get confused.

icon example images

Here are four icons for different variations of the same idea of coloring in an object.
Icons can only go so far. As the number of icons increases the likeliness that users will remember the icon or understand the metaphor decreases.

What the heck is a folksonomy?

Feb 06
14

In the beginning there was Yahoo. Yahoo categorized web sites into logical groups and categories and it was good.

The categories allowed people to navigate and find information using a logical structure but it wasn’t long before this approach started to run into problems. The first problem was that certain web-pages and even certain categories didn’t seem like they fit into a particular location in the hierarchy. Many pages seem like they could fit into all sorts of locations. In addition different editors may make different decisions on where something belongs. It wasn’t long before the directory was getting confusing to navigate and as the directory grew people relied more and more on search.

Altavista, Excite, Lycos, MSN, Yahoo, and more recently Google poured themselves into search technology to solve the problem of categorization. By indexing and ranking pages users could perform a search and find any page that has something to do with a particular word. This was a great automatic approach to categorizing and is still the most popular way to find stuff. But searching has a serious problem. Search engines can’t tell what something is about.

For example, let’s say I write a joke, it’s particularly funny, witty and clever. People reading it may think it’s funny but anyone using a search engine to find things that are ‘funny’ would be unlikely to find my joke since it didn’t use the ‘funny’ or ‘witty’ keywords. This is where Folksonomies can help.

The word Folksonomy is a combination of Folklore and Taxonomy. The idea is that you allow the community to categorize the page and add keywords or tags to your page. The idea is similar to the original Yahoo categorization only anyone can be the editor.

Folksonomies need a fairly large population to properly work but they allow the actual users of the data to organize it dynamically by adding text ‘tags.’ If some people think of something as a “Funny” and others think of it as “Penguin” and still others think of it as “Lame” the democracy of the tags allow the page to be properly categorized. The more people add tags the more trust that the popular tags are correct. As tags get added you also learn more about the content of the page. You also can easily find related pages that have similar tags. In addition it’s harder to spam or fool users with fake pages. Traditional search engines have a hard time detecting a bogus websites but real users can see a bogus website almost instantly. Real people can even tag visual content such as pictures, this is something that computers have a really hard time doing.

What problems do Folksonomies have? Well one major problem is that they don’t guarantee completeness. You can’t tell if you have a complete result set or a partial result set. You also can’t tell if people are abusing the tagging system. Folksonomies have a higher level of trust and anyone using these techniques needs to be aware that they can be abused by users who self-tag their own pages and content to improve rankings.

As search engines develop I expect Folksonomies will become a larger part of the search engine algorithm. Using a combination of traditional editorial categories, web-crawling and folksonomies will produce better search results for the search engine of the future.

If the IRS was an electric company

Feb 06
13

I was figuring out some tax things and it struck me how complicated and backwards the tax system is. Imagine if the IRS was an electric company

  • If the IRS was an electric company…You would have to compute your electric bill based on how much electricity you used last year and expected to use next year
  • The more money you make the more expensive the electricity gets
  • Electricity would change costs if you had more kids
  • Electricity would cost more or less depending on if you used it for work or personal use.
  • You would pay part of your electric bill twice. Once to your local electric company and the rest to the central electric company each would have different rules.
  • The electric company would charge you differently if you where single or married
  • If you owned a business you could be charged for the same electricity twice
  • If you didn’t pay your electric bill correctly the electric company could throw you in jail.
  • You would never actually receive a bill, you have to read your own meter and correctly calculate your bill per Kilowatt hour.
  • You would have to itemize your appliances

Don’t get me wrong I don’t have a problem paying taxes for government services that help this country grow. I just wish the system for doing so wasn’t completely backwards.

IE 7 PNG support

Feb 06
10

On the heals of my IE 7 review I took a closer look at the performance issues in IE and it looks like the performance issue I was seeing is heavily tied to the new native PNG support. One of the projects that we (at Raizlabs) are working is a fairly complex AJAX application that makes fairly heavy use of transparencies. To support both IE and Firefox we’ve been using conditional comments with an ActiveX control to render PNG’s on both IE and Firefox.

We had previously assumed that when IE7 was released the native support would allow us to use the native support but it looks like the ActiveX trick renders significantly faster then the new native support. It’ll be interesting to see if IE7 ships with this issue.

IE7 Review

Feb 06
6

Overview

IE 7 includes a number of new features however I believe this release will do more to send people over to FireFox then it will to bring people from Firefox back to IE.

Why?

  • The core features that IE adds are already in Firefox
    • RSS bookmaking
    • Tabbed browsing
    • Better CSS support
    • Built in search toolbar
  • Many of the features that IE has changed look non-standard and will make corporations consider Firefox to resume some level of consistency in the browser.
    • Hidden menus or menus in the middle of a toolbar feel awkward and are unusual. People have been trained to look for menus at the top of a window. Hiding the menu will cause all sorts of support calls by users that don’t know about keyboard shortcuts.
    • There is less space for customization. The space for custom buttons, and commands has shrunk by almost 50% because toolbar buttons share space with tabs.
    • There is no longer integration with explorer. So typing C:\ or FTP:// will not work as it used to work. IE will now kick you back to explorer.
    • There is no longer a waving flag or spinning globe. This has been a standard feature since the first version of Mosaic. It’s now difficult to tell if a page has actually finished loading.
  • Rendering and resizing performance seems to be significantly worse
    • The IE team has always been very diligent about performance however in my initial experimentation the browser seems to be significantly slower.
      • Noticeably slower then Firefox when loading pages with heavy PNG usage.
      • Noticeably slower in initial startup then FireFox
      • Slower at refreshing a loaded page
      • Slower at initial load and startup time
    • My tests where not scientific but overall it just feels slower.

Overview

  • The back and forward button are now conjoined twins.
  • The Go and Refresh buttons are now modal switching modes to Go when you are typing an address and then changing to refresh when the page is loaded. They could have perhaps even gone one step further and integrate the stop button into the same location while the page is actually loading. The refresh button is noticeably smaller and harder to click. The stop and refresh are always on the address line and it’s not possible to add either to the larger toolbar area.
  • The tools for managing favorites have been tweeked but has not improved dramatically. The new version of IE uses a floating menu that displays an in-place tree control with a list of favorites. This solution is marginally better then a menu but still doesn’t work well once you have over 100 favorites. There are no obvious tools to search your favorites or organize larger sets of favorites. Drag and Drop is awkward since clicking an item will close the panel and navigate the page.
  • The History and RSS Feeds have been integrated into the favorites center. The interaction model is a little awkward with hover-links, hover delete, and right click to create new folders. There is still no ability to search your favorites.
  • Adding to favorites now forces the selection of a folder. Previously the default was to store favorities in a flat list. This also introduces a new control that’s a tree view inside a combo-selector.

Top Toolbar Chrome

  • Back and forward buttons are joined together. Interestingly the history drop-down is also joined to both. This is an interesting touch that makes a lot of sense since there is really only one history stack.
  • Address bar is now primary at the top of the browse
  • A search box has been added into the top toolbar (similar to firefox), interestingly the search icon looks a lot like the apple icon and much less like the XP search icon.

What the heck happened to the menu?
The menu is accessible from the keyboard but it’s not very accessible with a mouse. You have to go into a special mode to turn on the “Classic” menu.

  • I find it really strange that the menu appears from the middle of the address bar and the toolbar. There’s no obvious advantage and it is unusual and awkward compared with every single other windows app. Even media player and MSN messenger that also does some wacky menu hiding places it at the top. This seems like a case of being different just for the sake of being different.There will be two types of users. The ones who like it hidden and the ones that want it back the way it was. The people who like it hidden won’t care where it is. The ones who want it back will want it back at the top. Putting the menu in the middle doesn’t help either user group.

Tabs

  • IE now has tabs, and not only does it have it but they are on by default. This is a little odd. This implies that the default person using a browser will work with tabs. While I personally think they are useful I’m not sure beginners will have the same usage. I expect most people will stick with one tab navigate primarily within that tab.
  • This version of IE encourages multiple homepages with each homepage opening in a separate tab. This is one of the hidden features of FireFox and although it may be useful to some I find it strange that this is promoted as a key default feature.
  • Vertical screen space in IE and Firefox take up almost exactly the same amount of screen space. IE with tabs on by default and menu off by default and Firefox with menus on by default and tabs off by default.
    • One nice thing that IE does is make it easy to create new tabs:

      They use a little mini-tab that when clicked creates a new tab. For some reason the icon is only shown on hover. This will encourage beginners to create tabs making the feature more appealing.
  • If there are too many tabs to shown then IE will hide the older tabs in a collapsed menu. Unlike regular overflow menus this overflows is on the left side of the tabs rather then the right side as is usually done with toolbars and menus:

    Clicking on the grid icon will give a grid representation of all your web-page tabs. This is a nice feature that gives you a quick visual overview. The actual rendering seems to be done in HTML and could use some visual polish but the overall effect is nice helping you quickly identify the tab that you need.
  • One problem with the tabs in IE 7 is that the close action is on the individual tab:

    This is in combination with the fact that the width of the individual tabs can change makes it hard to quickly close multiple tabs. Having either a fixed location for the close box or a fixed width for the tabs could eliminate this problem.

Zooming

  • IE now support zooming. True zooming not just increasing the font size. I talked about this a few months back (http://www.raizlabs.com/blog/2005/06/text-size-vs-zoom.html) and it looks like the IE team got it right.
    • In the status bar is a small zoom icon:

      This icon cycles through a number of zoom states. I would have preferred a slider but I guess this will work.
    • Zooming is great as an accessibility feature and it’s also great for those sites where the CSS isn’t coded to adjust with the users font size choice.
    • The zooming seems to work in most places although I did notice problems in the new RSS reader. I also noticed problems with some add-ins like Google Desktop that don’t work quite right when zoomed.

RSS Features

  • IE 7 adds a number of RSS features that may be of interest to users who have never used RSS. The features are very basic and provide little advantage over traditional favorites.
  • The RSS icon on the mini-toolbar lights up when an RSS feed is available.
  • Clicking on the RSS icon allows you to view the feed within the browser.
  • The browser/reader view allows basic searching and filtering functions. These functions are often less then what many web-logs already have built in.
  • IE can then track the RSS feed telling you when new content is available.
    • OK, it doesn’t actually tell you. You have to open the secret unlabeled star drop-down, navigate to the Feeds section and then realize that bolded items are new content.
  • One nice thing about these RSS feeds is that they can be read offline. So if you’re traveling with a laptop it does make it easier to bring some reading material along for the ride. It’s also possible to download enclosure documents such as podcasts, although doing so is not an obvious setting.
  • Overall I’m not impressed. Although it’s good that IE is adding support for RSS this reader lacks many features that would make it a viable newsreader. As a comparison the Outlook-express newsreader that was built in ‘98 and pretty much abandoned since has many more features for reading and aggregating news feeds. An update version of the news-reader with RSS support would have leveraged existing technologies and provided a lot more features. The RSS support in IE7 is much less then what is provided on RSS websites like bloglines, yahoo, google newsreader and others.

Printing

  • Printing in IE 7 seems to be much improved.
    • Accurate print-preview
    • Ability to adjust margins within the print-preview
    • Ability to easily hide/customize the header and footer
    • Ability to quickly change from portrait to landscape
    • Shrink to fit – actually fit the web-page onto the paper you are printing.
    • One wish-list feature that’s still not there is the ability to print exactly what I see on the screen rather then a reformatted printer version. Many times web-pages that have background images, table fills and other screen elements are much harder to read when printed then on screen.
    • Overall I was really happy with the changes to this area.

Under the hood

The new version of IE has added a number of features that are under the hood helping the browsing experience. These include improved rendering of CSS, clear type, RSS infrastructure, security filters, international support and more. These improvements are unlikely to be seen or understood by the average user of IE 7.

  • Cleartype support will make online text look better.
  • The phishing security filter is a good thing although it’s currently hard-wired to Microsoft server to determine the trust and quality of a site. It would have been good to leave this open so Symantec, Norton, CyberNanny and others could add value in this space. The response time of the filter is pretty slow and it seems to be done after the page has loaded. This may pose a security risk as the potentially bad site has a window of opportunity.
  • Improved CSS support, PNG support and other standards are a good thing. It’s likely that every round of browser updates will introduce a new set of issues and workarounds but the hope is that these workaround continue to get smaller and smaller. Initial testing shows that most sites work without a problem although more complex sites that rely on HTML editing such as blogger.com do have problems with the new browser.

Overall: 3 out of 5

  • Interface 3/5 – I think overall it’s not as good or as flexible as IE 6 or Firefox 1.5. I think the menus and toolbar interactions are odd and the smaller buttons will make the core browser a little awkward to use and to get used to. The added support for tabbing is nice but falls short of innovative or spectacular.
  • CSS Support – 3/5 – A lot better then it was and definitely on it’s way. The acid test2 is still pretty far from where it’s supposed to be. This test is becoming the yard stick for how browser CSS is judged and IE has already stated that they don’t expect that they will pass the test.
  • RSS Reader – 2/5 – IE has a base level of what you could do for RSS. Anyone familiar with RSS will likely continue using their current reader. This may engage some new users but the design doesn’t have much advantage over favorites. To be fair Firefox is also equally lacking in the RSS reader department.
  • Printing – 4/5 – Much improved and offering all the base features that users will look for.
  • Security – 3/5 – The new security filter is a good thing but the information bar introduced in XP SP2 will still confuse and get in peoples way as they try to download legitimate files. It’s not clear to me that browsing with IE is more or less secure then with any other browser.