When Worlds Collide: Marketing & Web Design

by Ryan Miller
on July 23, 2015

TL;DR

Marketing and web design are complimentary, not mutually exclusive. In fact, the best marketers will always be equally inculcated in both disciplines.

I’ve always maintained that marketing (and specifically, Internet marketing) essentially inhabits the same universe as web design. They are not as distinct as we might think, and there’s good reason to inculcate oneself in both in tandem.

My background is in writing, and consequently I’m primarily a marketer by trade. I did not go to school for design, photoshop, or web development. Yet, I learned these disciplines of my own volition because I would be unable to do my job as a marketer without them.

The Common Denominator

The job of a marketer can be described as many things, but at its most basic level it involves generating leads for the client. This might involve some form of direct advertising, such as sponsored search listings on Bing or Google. It may be more subtle, driving traffic and inbound links to improve the client’s organic rankings on search engines.

Any way you look at it, web design is involved on some level. Perfect ad copy means nothing if accompanied by second-rate creatives or landing pages. And good luck getting any inbound leads if your fonts and layouts are scattered and unappealing.

Need any further evidence that every marketer should dive headfirst into the unfamiliar terrain of web design and development? Here is just one example from my own personal experience.

Presentation vs. Content: The Case of Semantic Markup

At my first marketing job, I was assigned a site audit of an e-commerce store that sold CPAP supplies (for treating sleep apnea). It’s design was very well-thought out and executed (in fact, it was probably the only site in that industry that was responsive!). Yet, one thing became immediately apparent: from a content perspective its markup made no sense.

This website used H2 tags that preceded its H1!

What Semantic Markup Is

Even if they don’t know the technical definition of semantic markup, just about every SEO knows how to use proper heading tags. Every page gets a single H1, followed by multiple H2s, even more H3s, etc.

These HTML tags are referred to as “semantic” because they do more than simply convey a certain kind of presentation (fonts, sizing – i.e. design). They also contain information about the content itself. The H1 is the main theme of the page, while subsequent sub-headings are used to divide this one concept into sub-concepts that are semantically related.

This is what is meant by “semantic markup.” Markup is a reference to markup languages (XML, HTML, XHTML), which assign different tasks, styles and functions to elements in a web document. Heading tags are semantic in the sense that they are logically related with respect to each other, as well as to the content of the document as a whole.

What Semantic Markup Isn’t

In this website’s defense, I must say that its use of the H1 itself was par for the course. It not only contained the primary keyword that it was trying to rank for (“CPAP supplies”), but it also summed up the page’s fundamental idea: getting CPAP supplies at low cost.

So, kudos to them, but their use of subsequent heading tags was erroneous. The H2 preceded the H1, but how could a secondary concept of theme logically precede the primary one? The problem actually ran much deeper than this, but this one example will suffice to make my point: from the perspective of a designer, the slider in question looked pretty good. Yet, a clash of interests occurred when it became apparent that this would be deleterious to SEO.

What exactly does all this have to do with SEO? Semantic markup is a relatively new W3C standard (introduced in HTML5). So, the jury is still out on if and how it relates to search engine rankings in and of itself. Nevertheless, it’s an established fact that the purpose of semantics is to help users (both humans and, more importantly, Googlebot crawlers) understand the information on the webpage.

Sloppy semantics = sloppy content, and content is at the core of what SEO is all about. At its very best, improper use of semantic markup is a violation of W3C guidelines and best practices. At its worst (and this is most certainly an exaggeration to make my point), it compromises SEO for design and makes the two mutually exclusive, when they should in fact be complementary.

What a Marketer (Who Knows Web Design) Would Do

Fortunately, web design and marketing are anything but mutually exclusive, and I’m writing this to prove that they are actually one in the same. The whole point of “the semantic web”, as it’s called nowadays, is to separate presentation from content and make them accommodate one another.

This can be done in a few ways that satisfy both the designer and the marketer. The issue at hand with the aforementioned website was font sizes. Heading tags are styled to be descending in size, so it made sense to use the smaller H2 before the larger H1.

This can be easily resolved by using the <p></p> tag, with the only caveat being that <p> is to be used on paragraphs and not short statements. The semantic issue here involved not a paragraph, but a few words. In these cases, I prefer to use the <div></div> tag. <div> is the most basic block-level HTML tag, and it’s also a non-semantic element. Simply assign to it the id or class you want and style it accordingly.

On a personal not, I think W3C should come out with a semantic tag for calls-to-action. Obviously, every lead-generating website uses them, and it’s a great example of what semantics are intended to do: provide information about the content. Who knows — maybe it’ll come out in HTML6. If so, remember who came up with that idea first — the creative minds at TM34, where marketing and web design are just two peas in a pod.

Like This Article? You'll Love Our Work.