It’s time to adopt object oriented thinking

Paul Boag

Have you heard the term object oriented? Have you dismissed it as something that only applies to developers and techies? If so, think again.

If you work in the web the chances are you’ve heard the term object-oriented. However, if you are not a developer then you have probably come to the conclusion that it does not apply to you. If you have ever heard a developer tried to explain it, then you have almost certainly dismissed it as something only techies could possibly understand.

Interestingly that perception has begun to shift over the last few years and we are now beginning to see website owners, designers and content specialists interested in the idea of being object-oriented.

What is object-oriented

This is the point in this article where I make the toes of every developer curl in horror as I describe being object-oriented. My desire is not to describe object-oriented programming, but rather to introduce the overarching principle that can be applied outside of the role of developer.

When looked at within the context of a website, being object-oriented involves breaking the user interface and content down into its component parts, otherwise known as objects. For example, if you were running then a tweet would be considered an individual object. On an e-commerce site a single product would also be an object.
Twitter is made up of tweets and each tweet is an object with multiple components.

Each object consists of a number of elements that make up the entirety. An object also consists of a number of behaviours. In the case of a tweet this would include:

  • Retweeting the tweet
  • Deleting the tweet
  • Replying to the tweet
  • Favouriting the tweet

Each object can also have multiple states. This concept is a little trickier to explain. It basically means the object may alter based on different contexts (more on this later).

By this point you may be thinking I sound far too much like a developer, but I promise this applies to other web professionals too. Let me explain.

Applying object-oriented thinking to content

Traditionally we have thought about content we put online as pages on our website. For years this model generally held up, but that is no longer the case. Our content is now appearing online in all kinds of different contexts.

Sometimes content is viewed within an RSS feed, other times it might be syndicated to a third party website. Google has even started grabbing some content types and displaying them within the search results. The list could go on.

Google showing extracts from Wikipedia
Google has started pulling content from some websites and showing it directly in the search results.

The arrival of Siri and Google Glasses further complicates the context of our content, as these technologies extract content from websites and deliver it to users in a custom format. These tools display ‘snippets’ of data rather than web pages.

Siri displaying results from websites
Siri pulls in content from a website and displays it in its own custom format.

With that in mind we need to start looking at our content differently. We need to start looking at it with an object-oriented viewpoint.

Take for example this blog. You could easily think of it as a series of web pages. Actually it is a lot more than that. For a start it is made up of a number of objects. These include (but are not limited to):

  • Posts
  • Podcast episodes
  • Seasons
  • Categories
  • Series
  • Comments
  • Products (books and talks)
  • Questions
  • Testimonials

Each of those objects are made up of a number of components. For example if you look at something as simple as a comment, it is made up of:

  • The content
  • Poster
  • Date
  • Email address

These different objects may be displayed on a website, but could just as easily be delivered via email, RSS, instapaper or even appear on somebody else’s website. Hell, it might even be a print out that is handed about the office. This means there is no guarantee the user will have the context of the rest of the site to refer to. Each object has to exist in its own right. It needs to be able to stand alone.

As content owners we should be looking at our content as objects that could appear anywhere. We need to be actively looking for ways to further spread this content by providing APIs, marking up content with meta data and allowing content to be spread.

The Guardian understand that opening up their content means that more people are exposed to it. That is why they built the Guardian Open Platform.

Stop forcing users to come to your site if they wish to read your content. It doesn’t matter if they don’t see your fancy website design as long as they hear your message. By allowing your content to spread you will reach a far bigger audience than ever before.

Look at the success of Twitter compared to Google Plus. Twitters growth in the early years was driven by the fact that anybody could build an app that grabbed their content. Google Plus on the other hand generally forces users to go to their site and their app.

Another great example is Amazon. Amazon’s affiliate scheme allows anybody to display their products on any website. They want to share their content as widely as possible. They don’t need everybody to visit their website.

Thinking in terms of objects makes that mental shift easier and also helps facilitate the practicalities too. Its hard to imagine sharing pages from my website, but much easier to imagine sharing posts or podcast episodes. Also if you think in terms of objects it is easier to technically build content in a sharable and accessible way.

But object-oriented thinking shouldn’t be limited to content providers. Its also a design question.

Applying object-oriented thinking to design

The last few years has seen a radical shift towards object-oriented thinking within the design community. There was a time when most designers thought in terms of templates that content was poured into. You would have different templates for different page types but essentially they were just buckets for content.

Now many web designers have started thinking in terms of pattern libraries. A pattern library is essentially a collection of designs for different content objects and components.

For example a pattern library could contain designs for everything from articles and navigation to calendars and biographies.

A particular thing to note is that an object could have multiple states (as I mentioned earlier) and so would appear in multiple formats within a pattern library. For example a news story will look different on a details page than it would on a listing page. On the details page it would show all components that make up the story including the main content. However, on a listing page you may only show the title and a short extract.

This shift towards object-oriented thinking in design hasn’t just moved designers away from templates towards pattern libraries, it has also impacted aesthetics.

Look around a lot of modern websites and you will quickly notice a trend towards tile or card based design. Pinterest is probably one of the best known, but I have also seen the technique used on sites as diverse as universities or tech blogs.

University of Surrey News Section
A growing number of websites are using cards to represent content objects.

It would be easy to dismiss this as just another passing fad, but I believe it is more than that. Card based design is the manifestation of this underlying shift towards object oriented thinking. Cards allow objects to be displayed in various ways based on different contexts either within your own website or elsewhere. Furthermore card based design is ideally suited to responsive design because the position and layout of these cards are easier to change than maybe more traditional design approaches.

We are seeing an evolution of the way we think about and design the content we are putting online. Where once it was all about your website, we now exist in a much more diverse online environment and our content needs to adapt accordingly.