Blog

A number of years ago, everyone from sensationalist bloggers to your next-door neighbor was sure the traditional news media, from weekly and daily newspapers to magazines, was on its deathbed. Little did they know the sentiment they were hearing wasn't a death knell for the news industry but rather a signal that the industry was changing. Digital distribution was soon declared king, and from dedicated apps to revamped websites, traditional news publishers quickly adapted to shrinking subscriber pools and shifting news consumption habits. Now, on the heels of Newsweek's announcement of a new digital-only strategy, the Vineyard Gazette, a news institution on Martha's Vineyard, has launched a completely new, OHO-architected web experience that brings the local news publisher into the digital news age in style.

<!--break-->

A Web-First Newspaper Website Redesign

The new website, which launched today, features a completely new design for the paper, a robust multimedia section to showcase the stunning photography and video regularly captured around the island by Gazette staffers, and a new font style, which was made possible through collaboration with Boston-based Font Bureau, Inc.

Device-Agnostic Responsive Design for Desktop, Mobile, and Tablet

But perhaps the best (and likely most subtle) detail is the site rocks a responsive design, meaning regardless of a reader's screen size or device, content on the new Vineyard Gazette site, from breaking news and featured editorial content to local events calendars and an archive of tens of thousands of articles from the publication's past 10 years, will feel, function, and look great. Using a customized cascading style sheet (CSS), OHO was able to optimize the site for a wide range of smartphones, tablets, and widescreen desktop displays so users could enjoy the same great reading experience found on the desktop without sacrificing functionality while on the go. Most users will likely be completely unaware of this bit of design magic (which is sort of the point), but for a taste of what we're talking about, a side-by-side comparison of desktop, tablet, and mobile will do the trick. Go ahead: we challenge you to find a missing feature or block of content!

Streamlining the Editorial Workflow and Adobe Web Publishing Process

Of course, good looks aren't the only thing to be found here, as the all-new Gazette also features a number of under the hood enhancements to optimize the editorial process for the island-bound newspaper website. The site's backend, which is built on Drupal 7, features custom integration with the paper's classified ad management platform, a robust taxonomy and tagging system, synchronization with the newspaper's subscriber/circulation system, and bi-directional workflow capabilities, meaning when drafting content the editorial staff can both import from and export to the Adobe InCopy and Adobe InDesign platforms at will.

Building Subscribers, Driving Readership, and Monetizing Content

The site even features a customizable paywall (that news monetizer's oft-sought white whale) so the publisher can change what content is free and what content requires a subscription to suit their business model on the fly.

To get the latest happenings on the Vineyard, become a subscriber, or simply see the site for yourself, which was architected, designed, developed, and deployed by OHO, we proudly invite you to visit www.mvgazette.com.

We're proud to be supporting the second annual DrupalCampNH on the campus of Southern New Hampshire State University. Taking place all day on October 29, the event will be a gathering of the northern New England Drupal community for networking, connections, and learning. Our Christina Inge will be giving a presentation on best practices for Implementing Google Analytics and Testing Usability in Drupal. Stop by and you may just get a legenday OHO totebag! 

Boston Society for Architects (BSA) launched the completely revamped architects.org website this evening. The site was developed by Design&Co and OHO Interactive. The site is built upon Acquia Drupal and includes integration with the association management tool produced by ACGI.

Congratulations to the team at BSA – Adam, John, Jon, and Dan!

Internet Explorer has a 31 stylesheet limit for stylesheets that are added to pages using the link tag. Since this is such a large number this limit is usually not an issue but on more complex sites, especially Drupal sites with many enabled modules, hitting this limit is fairly easy. The consequence being that every stylesheet after the 31st will not load.

Thankfully many smart people have already tackled this issue and there are a few available solutions for Drupal 6 and a permanent fix in the core of Drupal 7.

There are two modules, IE CSS Optimizer and IE Unlimited CSS Loader, that you can drop in to resolve the issue.

There is also a way that you can resolve this issue in your theme's template.php file. The snippet posted below can be added to the YOURTHEME_preprocess_page function in your theme's template.php file. The original snippet was created by antoniodemarco and modified by ZoFreX. We have further modified it to include more comments and to only run if there are more than 29 stylesheets.

/*
 * Solve 31 CSS files limit in Internet Explorer
 * by converting link tags into @imports surrounded by style tags.
 * Only 15 @imports are included in each style tag.
 * This function will only run when there are over 29 stylesheets loaded.
 *
 * Notes: This problem can be solved by available modules but modules have the risk
 * of being overriden by other modules later in the load process. The theme layer
 * will one of the last things to have access to and alter $vars['styles']
 * 
 *
 * Original code - http://drupal.org/node/228818#comment-2609368
 * More info on IE limitation - http://support.microsoft.com/kb/262161
 */

 //Only run if Optimize CSS files is not on in /admin/settings/performance
 $preprocess_css = variable_get('preprocess_css', 0);
 if (!$preprocess_css) {

     //Get the total number of stylesheets, including those included with Conditional Styles Module
     $stylesheet_count = substr_count($vars['styles'], '<link');
     if (module_exists('conditional_styles')) {
        $stylesheet_count += substr_count($vars['conditional_styles'],0);
     }

     //Only run this function if there are over 29
     if ($stylesheet_count > 29) {
       $styles = '';
       foreach ($vars['css'] as $media => $types) {
         $import = '';
         $counter = 0;
         foreach ($types as $files) {
           foreach ($files as $css => $preprocess) {
             $import .= '@import "'. base_path() . $css .'";'."\n";
             $counter++;
             if ($counter == 15) {
               $styles .= "\n".'<style type="text/css" media="'. $media .'">'."\n". $import .'</style>';
               $import = '';
               $counter = 0;
             }
           }
         }
         if ($import) {
           $styles .= "\n".'<style type="text/css" media="'. $media .'">'."\n". $import .'</style>' . "\n";
         }
       }
       if ($styles) {
         //Adding styles configured with the Conditional Styles module
         $vars['styles'] = $styles . $vars['conditional_styles'];
       }
   }
 }

We've seen an increased desire by clients to add mapping to their websites – but they usually don't ask for it that way.

Clients begin by seeking new ways to visualize their information and make it easier to sort through information. In other words, they are looking for ways to make the content more relevant to the user.

Google Maps and Professional Associations

Some examples – I sat in a meeting today with an large professional association where the executive director talked about the "fire hose" of data their current site provides. It's too much; it's not relevant. His quick solution – not a better search or filters or better information architecture – is to show people and businesses near the user.

In his mind, nearer to me = more relevant to me.

A map view of search results is the ideal way to present this information rather than a filtered list. Why? Because maps offer a visualization of information that is easy to scan – and scanning is the way we all read on a screen.

Plot Custom Data on a Google Map for Universities

Here's another example – we launched a website for Lesley University last fall. Lesley offers off-campus programs in 250 sites across the US. I knew this – but it wasn't until I saw all 250 sites plotted that I understood at glance where they offer classes.

• I could see the clusters of regions where they work
• I could quickly see how far I would need to drive to take a course
• Clicking on the map pin showed me only the course available at that site

What's essential here is that the prospective student is asking a number of questions about the degree program: cost, time commitment, value, and course material. A standard text search is good for finding courses by name, but this isn't the only important decision factor. In this case a map more quickly answers other questions – how far will I have to drive? does this fit into my life?

Google Maps API and Google Maps Mash Up

The Google Maps API provides a way to plot your data on the Google Maps base. Plus you can plot third-party geo-coded information – such as transit stops – to add more value to your users. In addition, your users can add data to your maps such as polygons and lines plus the supporting meta-data.

See Examples of Google Maps Mash Ups

Drupal celebrates its 9th birthday today on January 15th.  Congratulations to Drupal creator and software visionary Dries Buytaert!  And what better way to celebrate the birthday of new software than to add a new release.  Today is also marks the official release of Version 7 Alpha 1.  9 years, 7 versions, and millions of users are quite a remarkable achievement.

We regularly see the power and efficiency that Drupal brings to website design and development projects.  Combining web content management, social networking, and work flow management Drupal is a great tool for many business needs.  It also is quite flexible as we've found out as we've been adding mapping and GIS functionality to social communities.  Drupal gives us a great productivity boost and gives our clients an easy to maintain and enhance website.

So Happy Birthday Drupal!  We're looking forward to another 9 years and seeing you turn 18!

The Google Map API provides a robust interface for developing custom maps using your custom data. These maps are much more than way-finding. They are powerful visualizations of data that can be manipulated by users. In addition, a map offers a unique method of displaying search results.

OHO Interactive has developed Google Maps integrations that combine map data, with proprietary data, with public data records (such as public transportation), to provide unique, valuable user experiences.

Learn More About Our Experience Free Webinar: December 16, 2009

Congratulations to Acquia, the commercial Drupal support company, for adding 200 new customers over the past 6 months.  That brings them to over 250 customers in less than a year!  Quite a feat at anytime but certainly impressive in today's economy.  

Drupal creator Dries Buytaert gives some insight on his blog and there is also a company press release from Acquia. 

As a veteran of of many content management system (CMS) implementations over the  past dozen years these facts from the press release just jump out at me:

• Over 400,000 active Drupal sites
• Over 4,000 contributed modules backed by thousands of active developers
• Nearly 60,000 downloads of Acquia Drupal, Acquia’s distribution of Drupal

These are astounding numbers that are driven by a very powerful product which jumps beyond the CMS category in many ways..  At OHO we work quite a bit with both Drupal and Acquia and one of most impressive parts of Drupal is how it can be powerful both business users and advanced developers.  It is a powerful building block for marketing and content driven websites.

We are now featuring an exciting new technology on one of our Web sites: Faceted Search.

Our new site for the Actors' Health Insurance Research Center uses a Faceted Search Drupal module. The module allows the user to browse the taxonomy hierarchy to retrieve and filter results.

The new site has been highlighted in the LA Times as well as the Washington Post.

OHO, a certified Acquia Drupal partner, had a significant presence at DrupalCon DC last week. OHO developers, designers, and project managers headed down from Boston to attend dozens of sessions, take pages & pages of notes, and grow a hat size or two. This week, the OHO blog will cover some of our favorite parts of the conference.
 
The "Drupal with XMPP Integration" session was a jaw-dropper. XMPP (Extensible Messaging and Presence Protocol) is an open standard IM protocol, most notably utilized by Google Talk. Darren Ferguson and his crew have made an outstanding set of modules that allow for real-time XMPP chat within a Drupal site!
 
The framework can be found here, and the presentation can be found here.

Located in Boston's historic Beacon Hill, the Congregational Library offers an extensive array of contemporary and classic religious material.  Founded in 1853, the organization was incorporated "for the purpose of establishing and perpetuating a library of religious history and literature of New England, and for the erection of a suitable building for the accommodation of the same, and for the use of charitable societies."
The library’s collection of over 225,000 items documents the history of one of the nation's oldest and most influential religious traditions.  OHO designed and developed the new web site for the library using the Drupal social media and content management system.  This robust platform will support the library’s move into a digital future for years to come.