The Pioneer

Overview

WhitmanPioneer.com is the online presence of The Pioneer, the weekly student-run newspaper of Whitman College. I redesigned it from the ground up with a tailor-made Wordpress theme, a MySQL database, HTML5, LESS, and jQuery. It was my first web project. The result won several awards from the Associated Collegiate Press (ACP).

Requirements

After serving as The Pioneer's Art Director, I was approached by the editors-in-chief to take on the project because of my previous Art Director role at the paper and my interest in web design.

After conducting a site audit and examining a number of other newspaper sites, we established a list of goals for the redesign:

• cleaner overall look and feel
• simpler navigation
• more articles on homepage
• specialized section pages
• improved SEO
• enhanced search and archive access
• reduced plugin count and dependencies

Challenges

The site has a large amount of dynamic content. As with many sites that publish new articles frequently, it has relatively high traffic. Search engine optimization was crucial, as was a solid back-end. Additionally, an interface enabling student journalists and editors to write, share, edit, and publish their articles was needed. Student newspapers evolve quickly: There is complete staff turnover every four years, so the site had to be flexible enough to withstand major changes.

Process

Design

I prepared mockups in Fireworks that addressed our objectives. The new layout was neat and colorful, with a grid structure reminiscent of the multi-column layouts of traditional newspapers. The Pioneer’s beautiful artwork was a focal point.

An article sidebar listed other relevant and popular content. This helped to engage readers and decreased our bounce rate.

Development

I built the site using Wordpress as the CMS and a MySQL database as the content repository. Wordpress provided a search engine-friendly template structure with clean page titles and permalinks and took care of the worst of the database administration. Another benefit was the built-in administration portal, which provided a browser-based workflow for Pioneer staff to write/edit articles and article metadata.

I used the Wordpress codex and function library to build around twenty template pages, including individualized section pages (News, Sports, A&E, etc.). The stylesheets were written in LESS, a dynamic stylesheet language, which kept the styles concise. It also made them versatile if the site was overhauled by new editors down the line.

Award-winning

The redesigned site won "Online Pacemaker" awards from the Associated Collegiate Press (ACP), the highest honor a university newspaper website can win in the U.S., each year since its relaunch (2013, 2012). The site has also won 1st place in the "Best in Show" category in every ACP convention competition (2013, 2012, 2011) Pioneer staff have attended.