vanderwal.net

Redesign explained

You most likely have noticed. There has been a redesign here. This new site is nearly all XHTML and using CSS box model. Going through this process introduces one to all the bug that browsers have that you need to work around. I found that IE 5.5 and up on the PC is horribly buggy and does not follow standard box model too well. Netscape 7 on the PC is the best browser. On Mac OS X the best browser has been Navigator/Chimera and IE 5.2 (through this Chimera became my favorite browser on most any platform).

You dare ask why the redesign? Well it was well past time. The last design had been around for a year or so and the CSS was giving me fits. I really wanted cleaner markup and I wanted to have a font size that scales. I believe that the font scales on all web standards compliant browsers and platforms. It should even scale on the PC's IE 5.5 and 6 browser (this has had broken functionality since day one, if you need a browser to scale font sizes properly get a real browser, one that is Mozilla based will do just fine). I am trying to remove the thin white line under the logo graphic and above the menu bar, it is showing up in IE on the PC and on versions of Mozilla on the Mac (Please contact if you have a solution).

I also wanted a better layout that would permit a cleaner layout. I moved the global navigation to the top bar and it uses and unordered list and CSS to put it in line and give it the roll-over (I stole part of the code from Scott and tweaked it). I also moved the local navigation to the left, which has been a joy as it is near the scroll bar and has made life a little easier. The right navigation may also be a place for other goodies. The right navigation has also helped me on the links page as there are a ton of links and I wanted a sub-navigations (yes, the links page is going to be getting an over haul in the near future with some needed integration with other elements in the site). The redesign also give the opportunity to introduce some small photos or images on the pages and not have other colors overwhelm them.

The box model drove me crazy, but I created some cheats I hope to share in the near future, once I get some minor tweaks around here done. The redesign was done solely on the TiBook and using a combination of the Macromedia MX Studio (Dreamweaver MX is a decent text editor, but I could not find a way to have it show a passable rendering of the pages in its own browser) and BBEdit. I started the process with outlines in Omni Outliner (a tool that rocks and is unparralled) as well as Omni Graffle to put together some wireframes to help me sort out the layout and functionality. This set of tools has been one of the best combinations I have used, I wish I could use this combo at work. I really am missing Adobe Photoshop, which may become my next software purchase, as it is a great tool that saves time.

Please, please write wit questions or bugs found. Thank you. I did this for me, but I hope you enjoy it.

James found

I finally found James site and I am much better off for it. Two guesses what James professional leaning is from the header?

Conferenece envy

Matt has been chronicling his experience at Doors of Perception held in Amsterdam. Matt offers his notes from: day 1, day 2 morning, day 2 afternoon, day 3, and day 3 final notes. This and ASIS&T were two conferences I really wanted to attend this Fall, but the move and house have eaten my money. I am saving myself for the Spring for SXSW, ASIS&T IA Summit, and possiblly DUX along with the possibility of Good Experience Live.

I did pop up to Philly to meet-up with some AIfIA Board members, other leadership counsel folks, and members. It was a great treat. I really wished I was staying for the ASIS&T conference (next year) and spending more time with these folks.

The train up was good as I got a lot of writing done (remember to take headphones if you are not on a "quiet" car, which do not run on weekends). The seat I was in on the way up did not have a functioning electrical socket, so I was pulling on batteries (not to worry I have a TiBook with 4 to 5 hours of battery). I was able to edit, read, write, and work on some graphics last evening and on the train back today. What a wonderful way to travel, particularly to Philly.

Rusty gets Matt in OJR

Matt Jones is interviewed in the Online Journalism Review by Rusty Foster of Kuro5hin. The interview is quite worth the read as Matt is the IA behind the BBC site (if you did not know already).

Buttons have info cramming illness

This week I have dealt with folks that have created design elements without giving thought to how they or their users would use these elements. The oddity in the three cases was creating a design that used image buttons with text. The size of the button's was fixed with the design. In all three cases one or more of the buttons tried to cram way too much text on to the tiny space. The buttons were unreadable.

Graphical buttons demand forethought. They should only contain one or two short words. Graphical buttons should be clear and easy to read. If the words on buttons are more than one or two words you and the user may be better off using text links. A good button would be "Animals 2001" not "Emprical Study of Animals in Tropical and Non-Tropical Environments - 2001". To convey the full text of the information you may be much better off using headers to structure the information, in this case using "Animal Reports" and "Emprical Study of Tropical and Non-Tropical Environments" then list the years offered in buttons or in a list. This provides much better scanning and can help break the information in to more scanable chunks.

Peter explains IA and AIfIA

Peter explains IA as he describe the role of Asilomar Institute for Information Architecture. The list of organizations that have members that have joined AIfIA in 10 days or so that AIfIA has been in existence is rather impressive to me. But hey, that is just me.

White paper on taxonomy and classification

Michael points to and discusses a Delphi Group white paper on taxonomy and content classification. A quick perusal of this 58 page PDF is leading me think I will want to clear some time for this sucker.

5 things CIOs cna do for project managers

Builder.com offers 5 things a CIO can do for project managers. This seems to be bacic. I would think having a central data resource would also be essential. How much time have we lost trying to find where a certain data element is stored and who is the owner of that item. Often we can not find the needed element and create our own, only to find out there was a resource, which now needs to be used, then we spend hours and money to rebuild the application.

In the years just before the Web boom, many large organizations created positions to be just this resource and many were called information architects. A Google search on "information architect" and enterprise will find current descriptions and pre-1995 descriptions. Some organizations understand the positive impact this can have and many more should.

Understanding and options for information overload

George Siemens provides understanding and options for "Impact of Too Much Information". [hat tip [Rebecca]

Tablet Hotels gets Experience Design and IA right

The November 2002 edition of ID Magazine reviews Tablet Hotels. For those that are not familiar, Tablet Hotels is a Web site that focusses on well designed hotels that are not from the cookie cutter molds of the large chains. These boutique hotels presented are from around the world. The site allows users the ability to select by location, amenities, and the traveler's agenda.

The response to "What was the biggest design challenge in creating the site?" points to the success:

The booking path was the greatest design challenge. We built our own proprietary real-time reservation engine, and when we began, we really wanted to create something outstanding and above and beyond the sterile process that's out there now. However, as we got into it, we found ourselves handcuffed by the antiquated systems that the engine had to connect to (GDS and hotel inventory systems). Throw in the fact that our site caters to an international audience and that the language terms and general policies of hotels vary greatly throughout the world, and we had our work cut out for us in our information architecture.

The small site of Tablet Hotels had not only their own information architecture (micro IA) to work through be the semantic variations of an industry so to digitally interact with various players (macro IA). The pairing of these two extremes seems to be wonderfully executed. The visual design of the site attracts the international customers searching for design and customer focussed hotels. Each hotel has a well written snippet and are photographed from design friendly perspectives. The reviews also offer a "citysense", which is a, self described, sensory guide to region covering: look, listen, taste, touch, and smell. The interactive components are also executed very well with allowing the user a the ability to select the elements/facets that are important to them when making the selection for their hotel.

The Tablet Hotel site is very well thought through and has spent much time and consideration walking through the whole array of Experience Design/User-Centered Design roles, including information architecture, to make a site that raises the bar for other hotel sites.

Go back

I had an early preview of a site this past week so to add comments. It is odd to me that sites are still being built with the frame of reference that the user will come through the "font door". If you read your log files the users come in at every opening. It is about even odds that a new user to the site will come there from a search engine, an external link, or from another pointer (e-mail or article). The frame of reference should always try to provide some orientation to the user, such as breadcrumbs or some other link out to related or parent information.

The item that I found a little jarring was a "Go back to the previous page" and it was not a javascript, but a link to what the developer thought was a next level up page. Pure linear navigation is a practice that is no longer a practice, if it ever was. Somebody last night at the DC-IA book club asked whether we navigated or searched, as always it seems to depend. With sites like Amazon we mostly searched, while some smaller sites we would click around. It seemed the greater volume of information lead to a greater instance of searching.

We did not talk about this for long, but it has been resonating all day. One of the things that Amazon does extremely well is end-search navigation. Most folks seem to search Amazon to find a particular item, but then Amazon's navigation and related offerings that could attract the user to the item, which they were searching for or to a similar item. The search result pages offer links to narrow the results or to ensure the user is looking for the musician Paul Young or author Paul Young. A user arriving at an Amazon book page would have all the options and information they needed to find related information and where they are in the Amazon site.

DC-IA book club

Those of you in the DC area the DC-IA group has their book reading tonight at Barnes and Noble in Bethesda at 7:30pm. The book for this month is Information Architecture for the World Wide Web, 2nd edition (the polar bear). Dan Brown who organizes the book club is reminding folk of the free coffee.

v-2 redesign

V-2.org redesigns, which is making reading the wonderful content much easier. Adam and others at V-2 provide great insights in user-centered design and information architecture. Adam is also a fellow Boxes and Arrows alumni.

AIfIA launches

A group of around 20 Information Architects gathered together in person and in digital environments over the last half year to put together a non-profit organization to help the Information Architect profession. We are proud to announce The Asilomar Institute for Information Architecture has opened its doors to provide resources to full-time IAs as well as part-time IAs and even to those curious about Information Architecture. We would love your help and support and we will give all we can professionally to support you and the industry.

IA primer

This evening I went to Content and Coffee a networking/information sharing event for content editors and writers for the Web. This evenings event was focussed on IA and had Thom Haller, Cinnamon Melchor, Vera Rhoads, and Sharyn Horowitz on a panel. This was essentially a light overview of IA, but the folks did a really nice job explaining IA and how they sell IA and its benefits to their clients or management. I may also go to the November 11 event covering 508 accessibility issues as it is a fun topic and it is good to get other perspectives.