Visual design of Web 2.0 sites and Access applications

I recently came across a blog post about common design elements for web 2.0 sites.

There are some things we in the Access world could learn to make our apps look and feel a bit more modern. Here are some concepts that Jonathan identifies:

  • Use of colors primary colors, rounded everything,
  • Providing something that is free to hook people on your idea.
  • A good web 2.0 app is clean and simple, easy to use and understand.
  • The use of large type to draw attention. "Large text is easy on the eye, and coupled with snappy copywriting makes information easy to absorb."
  • Give content room to breathe will make it more legible. "White space allows important information to stand apart, provides rest for the eye, and imparts a sense of calm and order."
  • Clever copy that makes the site interesting and readable. (Internally, we have standards that encourage and cajole our editors into a style that is different than I would use. We did fight against some of the corporate vocabulary/writing style in this version but not as much as I would like to see.)

Those are some good ideas for all of us to keep in mind when building our next data application. In Access 2007 we did do some work that makes it easier to build apps with a more web 2.0 feel. Here are some of the things that will help you on your way to a new looking application:

· You wouldn’t believe how much work it was to change the grid from the old 3-d look.

· I was very excited when we introduced the new preserve image format which allows you to use PNG images and transparency.

· The property sheet now displays colors in the web standard #FFFFFF hex format. This should make it much easier for you to pull in colors palettes from web properties. The new color pickers should make it easier for you to pull colors that work nicely together.

· The anchoring of controls and introduction of tabs help developers fill the screen with content the user cares about.

·  The new attachments control makes it so much easier to use rich media without bloating the database.

· The new report browse makes it so much easier to twiddle with the report look and feel. Don’t miss putting controls in stacks and playing around with gridlines and padding to draw lines. There are some great looking things you can do with the combination in reports.

· Alternate row color everywhere including datasheets. This makes reading tabular data so much easier.

· Transparent buttons and the Cursor on Hover. (I wish we would have provided some visual hints beyond the mouse change and why is that property on the Other tab, it should have been format.)

· Images and text on buttons. We also introduced a new set of icons in the picture builder that makes it easier to use better icons in your app.

· The Display as Hyperlink property also makes it much easier to use hyperlinks in your app without having all sorts of issues if you have # signs in your data. Also, the hyperlink prints as text without the color and underline when the user prints a report that has navigation.

· The ribbon definitely makes your application look modern and fresh. I wish we could have provided editing tools for those that had an investment in old menus and command bars and a visual designer for customizations. I’m working on a new paper that covers how to craft the XML that should be available in the next couple of weeks. Erik has posted about how to customize it with code as well.

· Finally, I’m a huge fan of the new Calibri and Cambria fonts—they look much newer and fresh than the venerable Tahoma/Arial mix we had going. We also turned on clear type to make text more legible. (Yes, you can turn it off in the Access options.)

I think we made some good progress but we didn’t get everything. Probably the feature I miss the most was events/properties (OnMouseIn, and OnMouseOut) that would make it easy to provide popular highlighting effects. Some kind of CSS style sheet would be very helpful as well.

Any ways, good luck making your app look a little more modern.