5 Years Makes a Difference

Jeffrey Veen talks about how the web world has changed since he wrote his ‘Art and Scient of Web Design’ book 5 years ago.

I wrote The Art and Science of Web Design five years ago. That doesn’t seem like all that long ago, really, but when I recently paged through the book I was pleasantly surprised to find just how much had changed. When I started writing the book in the winter of 1999, there were no large-scale commercial sites built with standards-based markup. Every single design decision we made factored the dial-up experience. Personal home pages were still a handcrafted-html effort; blogs had only barely emerged on the scene.

I was frustrated with the state of things back then. I was building a team at HotWired, which had become a division of the Lycos search portal. That was the height of the boom, and hiring designers meant talking to dozens of people who thought being a good designer meant not collapsing layers before throwing the Photoshop file over to “one of those HTML people.”

The Technology Powering High Context

Ben asks for more tech content (while comparing me to Darth Vader) and I deliver! ๐Ÿ™‚

I made a few changes to the technology and hosting for my site as I re-did the design and content for my consulting biz. Here is an overview of the changes.

Content Management
I am using the latest version of WordPress to power the entire site. Not only can it blog, it can also host static content pages starting with the 1.5 version. I used the static front page plugin to have static introductory text as the home page. I also made a page template that included much of the markup from the main index template in order to move the blog to a /weblog/ subdirectory.

I was a bit torn about moving the blog off the home page but I ultimately decided that it was best to make a clean introduction on the home page for new visitors and regulars could go to the new blog page. This turned out to be a bit tricky to get to work. Drop me a line if you want my code, happy to share it.

Finally, sticking with WP had the added bonus of keeping all my existing RSS feeds in place without a lot of tweaking.

Design
The design for the site is a modified version of the Kubrick template that D. Keith Robinson just slammed today as way too common. I’m crushed but I don’t think I’ll redesign just yet. ๐Ÿ™‚ I think it is a very flexible template that can be pretty extensively modified if you want.

The logo was designed by my wife Jennifer. Being married to a graphic designer has its perks.

Hosting
The site is now hosted with Text Drive, a new hosting company that caters to cutting edge open source technology. In fact, when you sign up for an account a significant part of the proceeds go to the open source project of your choice. I dedicated mine to WordPress. As they are a start-up, there are pros and cons. On the pro side they are incredibly responsive and very willing to change and experiment. The con that comes with that is a bit more downtime than usual as they shake out their systems.

So, nothing too extraordinary, except that I was able to rapidly build a new site using open source technology and even an open source design template. If you have comments on the design, content or anything else, please post them to this entry. I’d love to hear the feedback.

s5 for Web Demo

I gave a demo of our intranet yesterday. I had a few slides of background material I wanted to cover first and then jump into the site for the rest of the presentation. So, I grabbed the S5 presentation template and created an HTML-based slideshow and linked to the intranet on the last slide. The beauty of this is that I didn’t have to do any awkward application switching between powerpoint and the browser. It really made the presentation much smoother by running the whole thing through the browser.

AJAX in CMS Screencast

CMS Watch posted a nice screencast a while back that demonstrates how some CMS packages are currently using AJAX techniques to enhance their user interfaces. Definitely worth checking out. I especially like the autocomplete feature for users tagging content with keywords from a controlled vocabulary. (Thanks to Mark T for posting about this and bringing it back to my attention.)

Managing Logins for a Members-only Web Site

How to manage member access to member-only areas of an association’s web site is a common question posted to the ASAE Technology listserv. Since I’ve answered it a few times I thought I would go ahead and post my stock reply here to save some typing in the future. ๐Ÿ™‚

Many associations, when they first create a member-only area of their web site, have used a member’s ID number and last name to control access. However, that same information is usually listed on mailing labels and membership cards. This method is very easy to set up, administer and communicate to members. However, having that info on mailing labels is definitely a security risk. The size of the risk really depends upon what they can do with the account once they login. If it’s just to view content (usually the case for early efforts), the risk is relatively low. If it can include e-commerce transactions or editing the members’ data in your association management system (what most associations want to add or expand upon now), then the risk is pretty high. Either way, I think it is smart to move to something more secure.

When I came to ASHA in 2000 we were using the same account number/last name scheme for access and that info was and is on every mailing label and membership card. We then implemented a username/password system that allowed the user to create their own login name and password. Over time, we found many members had problems remembering the login name they had created for themselves. A few years later we migrated to using their e-mail address as their login name which has dramatically reduced support calls for lost user names (many of our members call us instead of using the account help tools on the site). Based on our own experience, I would recommend going with e-mail as the login name. That seems to be the emerging standard around the web for many major sites out there (Amazon being the most notable).

Some gotchas to look out for when using e-mail as the username:

  • Each member must provide a unique e-mail address. Sometimes this is an issue when a spouse shares the same account and is also a member.
  • You should provide instructions on free services that members without an e-mail address can use to get one (there are still some people without e-mail addresses!). This is also useful in the spouse shared address situation.
  • Clearly state how the address will be used by the association when the members supplies it to ease privacy/spam concerns on the part of the member
  • Consider your response to members who refuse to supply you with an e-mail address but want access to the member-only content and services (I have encountered this a few times).
  • Members should be able to change their e-mail address at any time without having to re-register with the site. In technical terms, test for e-mail uniqueness but don’t use it as the primary key for the record.

Finally, you will need to associate the login with their account number in some way. You might ask for their member ID number at the time they register or associate the login with their account later through some other process. I strongly suggest automating the process as much as possible while still preventing the same ID number from being associated with more than one login.

Hopefully the above info will help you get a jump start on the design (or redesign) of your web site login system.

AJAX

Wondering how Google creates such great interfaces for web applications such as Gmail and Google Maps?

AJAX:

Google Suggest and Google Maps are two examples of a new approach to web applications that we at Adaptive Path have been calling Ajax. The name is shorthand for Asynchronous JavaScript + XML, and it represents a fundamental shift in whatย’s possible on the Web.

Defining Ajax

Ajax isnย’t a technology. Itย’s really several technologies, each flourishing in its own right, coming together in powerful new ways. Ajax incorporates:

* standards-based presentation using XHTML and CSS;
* dynamic display and interaction using the Document Object Model;
* data interchange and manipulation using XML and XSLT;
* asynchronous data retrieval using XMLHttpRequest;
* and JavaScript binding everything together.

It’s basically the creative use of several mature web technologies in combination. Follow the link above to read more in the very informative article by Jesse James Garrett.