Really, it should never be content vs. design; it should always be content and design together, harmoniously collaborating to get you those conversions you want.
Sometimes, though, the design and content are at odds.
The example here is Tom Hapgood’s design mock up for Rocky Grove Sun Company, whose site we’re expecting to launch this month.
Tom is using WordPress, the Pods CMS plugin, the WP e-Commerce plugin and various other free plugins to produce a site that the guys at Rocky Creek can easily edit as technology and their business change.
This is important for Rocky Creek, since their website will have a wealth of technical information about solar power, as well as galleries of their work which they want to be able to update easily. The site owners are also writers and speakers on the subject of sustainable energy, and they expect to have new ideas to share (“Maybe the occasional rant,” says owner Jimis Damet) as well. But they’re not especially comfortable with internet technology and don’t want to be. Our goal, then, is a website with a content management system over which they can have a high level of control, without a steep learning curve.
Tom is also using an HTML5 Boilerplate as a starting point on this project, so there’s a lot of innovative technology happening. An attractive design, too, combining the down to earth feel of the company with a bright, fresh look.
But when I got the original mock up, I wasn’t completely happy. 
If you look at the two designs, you probably won’t be able to guess why. If you were to click on them, though, you’d probably notice that the text doesn’t read sensibly in the earliest one.
The text was written first, and I was sort of imagining a column on the left and a column on the right. Not a design decision — just what happened to be in my head as I was writing.
For the left-hand column, I wrote text in a classic formula:
- introduction
- point A
- point B
- point C
- and therefore conclusion
For the imaginary right-hand column, I had photos with captions.
When Tom created the page, he had the cool idea of putting the photos in a different spot: horizontally, right across the middle. He asked for a 75% reduction of text, and put the new, briefer paragraphs in the four corners of the page.
Reading right to left and top to bottom, as we English speakers do, it read like this:
- introduction
- point A
- point B
- captions
- conclusion
- point C
Now, I’ve had enough designers admit that they don’t read the text when they build a page to understand that interrupting the cogent flow of my argument wasn’t the plan. But it definitely weakened the page.
What’s the solution? I did offer to rewrite, since I didn’t have pods and things to work around. Writing the page nearly always takes less time than designing it, so rewriting can be a better choice than redesigning. However, we were able instead to move the elements around. The introduction is now at the top, updated to stand alone and complementing the rotating gallery which the client suggested. The conclusion and original tagline are set apart visually with check marks to make a strong statement for visitors to see immediately. The longer text setting out those proofs that Rocky Grove is the best source of solar power are below the photos, back in the right order.
For some visitors, the lengthier text will be below the fold, but that’s okay. The content above the fold is strong enough either to move visitors to call the company or to scroll down and read further. The keyword-rich text is there for search engines, too, to make sure that they offer the site to the people who need it. I think the second take is bolder, too, and Tom feels that it’s “sunnier” — which is a good thing for a solar power company.
When we build sites, we often do a certain amount of back and forth between content and design. There’s nothing wrong with that. Just make sure that the two work together when your site goes live.
Leave a Reply