When we approached Impact Personnel in Connecticut about redesigning their site for mobile it was in desperate need of a refresh. It had become static and outdated. So we set a plan in motion and got them back online in a few weeks with a site that fits any screen on any device.
Here’s how we did it.
The Challenge
Turn ImpactPersonel.com into a modern website that represented the firm’s personality while optimizing all pages for mobile screens.
The Solution
The first step in going mobile is getting the right web host. Since Impact had a small site of only five pages (and no in-house webmaster) we switched them to Squarespace.com where, for just eight bucks a month, they get a highly reliable web site that they can edit themselves through a simple back-end.
We took all their existing webpage copy and put it into a word document so it could be reviewed and edited.
Then we set about finding images for the new site. We searched through online stock photo sites such as Shutterstock and Pixmac. We went to the Impact Personnel office and took a few pictures as well.
Use Real People
The trend in web design is moving towards a more visual site presence. That means you need to have lots of cool pictures (high resolution) to engage your site visitors. Bigger images are also great for mobile since they scale down more easily on smaller screens. So stop using those generic business people headshots. When you can, use your own employees. In the era of transparency, real is better than fake.
Social Media Linkup
Then we turned our attention to their Facebook and Twitter accounts. They weren’t using them that much and their brand (logo) wasn’t accurately reflected on their accounts. Since Impact had just moved offices, we used one of the pics of their new office that we took as the cover photo, and created one logo icon for both pages. Now they look more consistent.
(Ed note: In the several months since this was first written, the Facebook site has fallen fallow. However, the Twitter feed is still active and regularly posts referrals to articles as well as jobs.)
Note: When updating your company Facebook page you’ll need to make someone an admin so they can get access to it and make the necessary changes. While we were in there, we updated their address, hours and the about text, too!
Once that was finished we started back on the website by picking one of the pre-made templates that Squarespace offers and configured it for our client. You can get similar templates using WordPress themes but they are a little more “techie” to administer on a daily basis (you also have to regularly upgrade the software and plugins). Since we wanted to make future management of the site easy for the customer, Squarespace was the better option.
After some iteration and configuration we settled on the design you see here. It’s a simple structure with the logo and navigation centered on top, and a strong visual image of a city skyline.
We integrated a picture of their office as well to make it more personal and real. You’ll also notice their new, real-time Twitter feed, which displays along the right side. Since the company doesn’t Tweet a lot we automated some content into their account by retweeting the RSS feeds of some popular blogs. For this we used Twitterfeed.com which is a free service.
The Results
The new site offers a clean, crisp look that showcases the black and white Impact logo. Since launching in fall of 2013 there was a 9% increase in page views as of March 2014 (when this article was first published in The Fordyce Letter, March 2014.) The bounce rate (visitors arriving but leaving without accessing another page) has also dropped. And now, no matter what screen you view it on, the site resizes itself by stacking page elements on top of each other for easy scrolling.
We hope this mobile case study helps you with your site. It doesn’t have to cost a lot or take long to build. Just plan it out ahead of time especially if you need to change the text or content. We recommend working on the content before you start any design so that when it’s ready you can just hand it off to your designer to implement. There are really so many good options now for mobile ready templates there’s no excuse not to have one.