About This Site's Design

(Early 2014) Although this site might not look like it, it has a design. Everything has a design. The visual design of this site comes primarily from the various frameworks we used to build the site. The content is handled by Drupal 7, and the layout is using the Bootstrap 2 framework. Design usually inherits a certain amount from the tools used. This site more than most. We have taken a "minimalist approach" to the visual design. Right now we are more interested in getting the content published and frankly did not have the budget (in time or dollars) to invest in a visual design that might "wow" you. It is a lot of work and just like any other business we must decide where limited resources are applied. Do you feel shortchanged? Probably not.

Don't get the wrong impression, we feel strongly about good web design, but visual design is only one aspect of a website.

Graphic design is important, but not the only design in a website. Realize that search engines do not rate your graphic design. Search engines read and evaluate your content — that is where all our effort is going in the short term. The visual design we will build up over time.

Invisible design

Much of this site's design is invisible. (As in 99% Invisible.) Much of the visual design comes about from thinking "no, we don't need that, it adds nothing". This naturally leads to a minimalist visual design. That is fine — less time spent on web page geegaws and less visual clutter around the real content.

One huge part of the site's design you will not notice is that the layout flexes and rearranges to accommodate the device used to view it. If you are on a desktop browser; make you browser window thinner, watch the page elements rework themselves to the thinner window. If you are using an iPad; change the orientation of the device, no zooming needed! This is known as "responsive web design" and is Google's recommended configuration.  Mobile web access will just continue to grow.

Some other things to notice.

Drop down menus.  That's right, there are no drop down menus here. Drop down menus are problematic as "touch" interactions begin to overtake "mouse" interactions. When you realize that consumer oriented sites are now crossing the 50% mobile threshold, the concept of "hovering" over a page element becomes moot.  Your finger may hover over the page, but until you touch the screen nothing happens. (I guess that could change with 3D touch.) Much of how drop down menus work in our half mobile/half desktop world is still being designed in the big-dollar user experience labs.  There are a lot of conundrums to sorted out. I believe there is innovation yet to come for menus on websites. That innovation will most likely come from the teams that have huge budgets and people to develop and test new ideas. Although, never underestimate a "Eureka moment" coming out of left field.

Fonts. This is a wonderful time for the Web. There are now sources for thousands of fonts for the Web. Until recently our only reliable font choices were Arial, Times, Verdana and a few other fonts common to all operating systems. There are many technologies that had to be developed to arrive at this ability. Web browsers have improved their rendering of fonts as well. Font foundries have developed licensing and delivery methods to satisfy all parties. And high quality Open Source fonts abound. That is where the fonts for this site come from. We use a pair of matched fonts from Google Fonts. A light weight of Roboto is used for headlines and Roboto Slab is used just about everywhere else. If you use an Android device you may recognize the sans serif font — it is the default font of Android version 4.0.

Typography. While fonts are big part of typography, and fonts have improved vastly for the Web, the general composition of text is still quite limited when it comes to your browser. In general, letter and word spacing is very poor and there is very little control over these aspects of composition. There is no auto-hyphenation and this limits how well justified text spaces out. Overall, Microsoft Word is better typographically than any Web browser.

This is just the beginning

Beyond the visual design and its "responsive layout" is the underlying programming framework—Drupal. Because of Drupal, the site is ready to take on more as we see the need to add features or new content. And then there is content. What we say here is much more important than the way it is presented. Visual design is important, but without substance it is irrelevant regardless of how pretty or edgy or interesting it is to look at. The visual design communicates a portion of the story, but the full story is told in the words. Also, remember that Google does not grasp the meaning of a design concept—only the words. Google does not look at a site and think "this is edgy looking" then show that site to searchers it thinks are "edgy". Google will rank an ugly site with high-value content over a beautiful site with little content. (Although Google needs to be able to find the content either way.)

Beyond the basic frameworks used to build this site, we did need to make some customizations. We did have about $1,000 of time expended on solving a specific issue  we wanted "just right". You will never figure out where we did this work... it is simply amazing how invisible good work can be.

Then the cycle is complete.

Over time we will need to update the modules and and core programming of this site, whether for security reasons or simply to keep up with changes made to the functions. Eventually the frameworks used to build this site will run their course and the site will need to be rebuilt using new frameworks built to take on the Internet we cannot see at this time. It has happened a couple of times over the last 20 years and there is no reason to think this progression of change will not continue.

Changes for November 10, 2015

We decided to remove some margins (actually in this case "padding") to allow the hero blocks (e.g. the main block of content on the home page and various other pages) to stretch across the content area of the page and the entire "viewport" on phones. The hero blocks were also allowed to butt against the content below this helped create some nice breaks on the home page. Also, we removed the rounded corners from content blocks - rounded corners are starting to signal old Web design. Not sure why... that is just the way the wind is blowing. Finally, still dissatisfied with the neutral gray body background, we chose a darker but warmer gray hoping this would help focus eyes to the content which is brighter.