Kathryn Crawford
By Kathryn Crawford | Web Design | March 13, 2018

Content First Web Design

I play a lot of video games. I’ve always loved them and been enamored with their production. I’ve read so many books and articles about how games are made and how they affect our minds.

One thing that I know to be true about all good video games, is that the production of the game starts with a script. A writer comes up with an idea, and presents it to a studio. On the flip side, video games do not usually begin with concept art, or even more extreme, finished 3D animations. In order to conceptualize with the art, you have to have a basic setting at the very least. You have to know what kind of world your characters live in. What kind of technology they have access to, or whether you’re going to be making a farming simulator or a medieval-esque role playing game.

A story is the first step in a good production.

Visuals are important, but story is king

We’re visual creatures, and we often focus on the visuals of a movie or game. With movies, the whole point of seeing a film in the theater is to see it on a screen with high quality. Video game visuals are what drives a PC gamer to buy that $400 video card. Visuals are definitely important to us, but even a visually beautiful title can be bad if there’s not a solid script behind it. Focusing too much on visuals at the expense of the story can do so much damage to your creation. Visuals alone are not enough to carry a production by a long shot. 

Batman, Wonder woman and Superman from the Justice League movie

If only I could think of a good example…

This seems like a no-brainer when it comes to media like movies, tv shows, video games or graphic novels, but we often don’t apply this to the web. Websites, like other visual media, are complicated creatures, comprised of a mix of content, visuals, and functionality. There’s a whole complex mess of considerations like keywords, page load speeds, and user experience. Often we fail to focus on the most important piece of the website, which is the content. Without content, websites would just be a meaningless random collection of boxes on a screen.

Ultimately we want people to come to our websites to read our words, watch our videos, view our images, listen to our audio, and buy our stuff. So just like video games start with a script, we could conclude that web sites would be best suited to starting with content. Right?

Dr. Evil from Austin Powers saying "right..."

Unfortunately, this usually isn’t how people go about making a website.

So what’s the issue with websites?

The web is rife with build-it-yourself approaches to websites. Themes, templates and do-it-yourself services are in abundance. These can be a very good thing in some situations, a solid foundation for anyone to build an effective website. Small businesses and individuals without the time or knowledge to build a website now have that opportunity. This is awesome, but these pre-made designs, and the mindset they perpetuate, can also cause issues with the flow of website production.

An example of a website template

The web of preconceived designs

Many people, when considering a new website, have a list of pages or templates in their mind. A lot of times, people have certain elements in mind without having content to fill them. A couple of years ago sliding banners were all the rage. Everyone wanted a sliding banner in their site, but not everyone had good engaging content to fill the slider. The result was a lot of sites with a big full screen flashy designs, but very little engagement. They had a lack of meaningful content and good user experiences.  

People on the web are fickle, if the first thing they see on a site is visually beautiful, but offers no useful information, then many of them will leave without exploring the site further. The answer here would be to determine what good content you have, or can produce, and then consider if a slider is the best option for the content.

Content first design can seem like a drag. Sometimes people are visually minded, and it’s hard to know what content you need without seeing at least a rudimentary page design. It can definitely be a struggle, and one I sympathize with. However, the exciting part of content first design is all the amazing opportunities it opens up. With content out of the way we can build the visual direction around the content and utilize the visuals to enhance your content rather than dictating it.

But what are the benefits to me with content first design?

Mobile example of content first design

Content first design really allows User Experience Design to flourish. UX Design allows us to draw a visitor through your site in the most effective and easiest way for them. This leads to more conversions and less people leaving your site before they can experience what you have to offer. Engagement is the ultimate goal after all! Content first design can also improve SEO in that it makes designing for semantic HTML much easier

Content first can also solve lots of issues down the road, and save on time and money. When a designer has no idea what content will go on a page they end up building a generic page and hoping the content fits to it. If, when the content is done, it does not fit to the design, then you have to go back and redesign the page all over again, costing valuable time and resources. This problem is further compounded if a developer has already built the page without the content at hand. Content can also restrain a designer, which can be a good thing. Constraints will allow a designer to create quicker, and to design around the content.

How does this effect the mobile web?

Another big consideration in this day and age is mobile design. Over 50% of internet usage worldwide now comes from mobile phones. Mobile design can no longer be a secondary concern for us, when it’s the primary method of viewing our content. When content is optimized for mobile before a design is created, it helps the designer make better, more concise mobile designs.

A mobile phone with a well designed interface example

All of this is probably overwhelming, and I know writing content can be tough, but the web is much more like a conversation than a book. At the end of the day, we want to lead a viewer through a site to a specific conclusion (or conclusions), rather than letting them come to their own. Just like a good conversationalist, we also want our users to respond to us, so that we can keep the conversation going.



Need some help with your content first design? You’ve come to the right place. 

background dots

In the time it takes to read this sentence, you could be on your way to a well-oiled demand generation machine. Ready for your blueprint?

yes, i want my Digital blueprint