Colophon

An experiment

This site is an experiment in personal publishing. All of the content is managed by Denna herself without a local content management system. She controls everything from her existing accounts on sites like Flickr, Tumblr, Ma.gnolia, Twitter and Upcoming.

Before we started planning, we knew that Denna was already actively using the functionality of other web sites to share her work and thoughts. It made no sense to reproduce the functionality here when we knew we could import her content from other sites and use it on this one. It seemed like the perfect opportunity to create a site that would distill all of a person’s activity from around the Web on one site, painting a rich picture of who they are and what they do.

Most people have heard of Web 2.0. Many think of it as a type of visual aesthetic. In fact, it’s not about design, but about information. Web 2.0 is the reuse of information in new and interesting ways, often using what are called web services (web sites that allow people to manipulate information and share it with other like-minded folks). One problem is that people’s data ends up being distributed around their accounts on various sites. Technically-minded people (fellow geeks) solve this problem by using APIs or blog widgets to pull that information into their own site. We set out to do the same for Denna, but in a way that requires no extra technical knowledge at all.

These are the sites and services we used:

• Flickr for all the pictures used on this site, including the images and copy for Denna's work portfolio.
• Tumblr for Denna's blog and about page.
• Ma.gnolia for bookmarks.
• Twitter for random thoughts and snapshots of her day.
• Upcoming for events.
• Technorati for references to her posts in the wider blogosphere.
• Feedburner for feeds.
• Google for site search.

Design

The interface is deliberately simple. There are no purely decorative elements or images. Almost everything you see is content. Typography and layout have a touch of the Swiss modern using Helvetica Neue or Arial (depending on your platform) with a traditional scale. The design tries to get out of the way of the content as much as possible to give you an experience that is firmly controlled by Denna and what she chooses to publish. The layout is a hybrid—part fluid, part elastic—meaning it defaults to a 1024px viewport width, shrinks to fit 800px-wide viewports and grows with browser font size until it fills the available viewport and then wraps.

The information architecture mostly uses verbs in the directory names—an idea that first surfaced with Chris Shiflett during our recent OmniTI design. It means that web addresses make up sentences wherever useful. For example, a blog entry has a URL of http://dennajones.com/writes/entry-title.

Code

Plain old semantic HTML is used with CSS for styling. The interface was designed with accessibility firmly in mind; all JavaScript is introduced as a progressive enhancement to PHP-powered features. PHP is used to manage all of the web services and extra functionality such as blog archives, caching and feeds.

Microformats are used wherever appropriate: hCard for Denna’s contact details; hAtom for blog entries; hCalendar for Upcoming events.

We hope you enjoy the content!

— Designer, Jon Tan, and developer Jon Gibbins of Grow Collective.

Monday, 31st March, 2008

There’s more about this site in Denna’s own words in her first blog entry, Small but smart.