Alex Bea

Litehouse Foods

Screenshot of the new Litehouse Foods website

Litehouse Foods is an employee-owned packaged food business out of Idaho. They not only have a large variety of products in several categories, but also a huge number of blog posts and recipes they have used for content marketing. The new website needed to show off their products, present all company information clearly and beautifully, and create as smooth a path as possible from their legacy content on a proprietary CMS to the new open-source Drupal CMS.

When I joined Singlebrook, the project to replace their out-dated static site was underway, but very little front end work had been done. Desktop-sized designs were created by an agency out of New York City and were certainly beautiful. They also made use of many variations on components and lacked clear instruction for conversion to responsive styles. While my much more Drupal-experienced colleagues took on the back end work and data wrangling, I went to work on component styles and making it all responsive.

Working with the designers along the way, we ultimately produced a great responsive website that effectively shows off Litehouse’s full suite of products and made good use of legacy content within the new design. On the latter point, for example we built templates for blog posts and recipes that had smaller featured photos on the legacy site to stretch those photos up to the new size, while also adding a field to the articles for an updated photo–the smaller photos were still used for areas where the information was presented more compactly.

This project was a major learning process for me in regards to dealing with complex and varied legacy content. It was also during this project that I did some of my intentional study of the HTML5 element spec. The complexity of the various template layouts meant that I had a great opportunity to think hard how to best communicate the semantics of the markup.

As my first major project launched as a developer at an agency, the Litehouse launch was very momentous for me. I’m very proud of the work our team did and of the templates, styles, Javascript, and other code I wrote here. It isn’t all perfect, but our end product turned out very well, the clients were happy, and I learned a ton. Check out the new Litehouse Foods website.