Skip to main content

  • June 19, 2019

Art + Science: Creating a Comprehensive SEO Strategy That Complements a Beautiful Design

Let’s face it – SEO and UX design don’t have the greatest history together. In the early, nascent days of the web, designers used to joke that if you talked to an SEO professional, they’d advise that your website should include nothing more than a white background with black text, lots of hyperlinks, and repetitive, monotonous copy, all in the name of “keyword density.” Indeed, in the early days of search (going back to the era of Yahoo!, Excite, Hotbot, and Dogpile – before Google was even a public company), simplicity was key — and search engines could do little beyond scanning text on a page.

However, as is the case with most technologies, search technology has evolved. What were once mere “crawlers” are now complex algorithms driven by artificial intelligence, designed to anticipate the information that you seek before you can even type a word or phrase into the search box. This also means that a great design and an effective SEO strategy no longer need to compete with each other. In fact, great design can now enhance a site’s SEO rather than detract from it. Simply put, the SEO professionals and the design professionals have evolved from being foes to being friends.

Years ago, SEO professionals and digital marketers would insist that designers “design for Search Engine Optimization.” In reality, the whole concept was (and still is) nonsensical, as you don’t optimize search engines, you optimize for users. Circa 2019, designers should lead the process with insight and consideration from the SEO team to drive the project forward. It’s all about the user experience. The golden rule of SEO is that if you think about the user, the search engines will take care of you. That said, there are some key approaches that help a beautiful, thoughtful design peacefully co-exist with, and even enhance a site’s SEO strategy.

1. Have a Focused Navigation Experience

The goal of any web designer is to make a site easy to navigate in an effort to drive the user to take a desired action. Content hierarchies are developed to make the content locating process easier by breaking down large amounts of content into more digestible categories and subcategories. Consider a large apparel retailer that has thousands of products. They don’t typically have one massive category page featuring their entire product catalog. Instead, they have categories for items like “pants,” “shirts,” “shoes,” and subcategories for more specific types of apparel such as “polo shirts,” “tee shirts,” and “dress shirts.” Utilizing these subcategory pages enhances SEO because each page can be optimized and centered around a specific set of keyword phrases, and can be interlinked.

2. Use Faceted Navigation

We’ve all seen sites that have huge mega menus that clutter up the navigation and look intimidating. In contrast, a faceted navigation lets the user filter and refine content on their terms and allows the design team to keep things clean and simple. Faceted navigation can be very beneficial for SEO by creating pages focused on long-tail combinations of refinements that can be indexed and crawled. This increases the odds of the user landing on the right page directly from the Search Engine Results Page (SERP). There are development considerations to be mindful of here to avoid duplicate content and flooding the search engine indexes with pages that show no results, but with proper planning, the clean look of a filtered navigation can actually improve the site’s SEO performance

3. Think About Copy That Goes Beyond Large Blocks

When a website has a beautiful, clean look and a 300-word block of copy stuck in at the bottom of the page, the copy isn’t beneficial for users. Users usually can’t see it and it often reflects poorly on the website for overtly trying to jam in keywords just for the sake of jamming in keywords. Instead, copy that can be modular and distributed throughout an entire page in section headers and small blocks, can work with design elements and allow the text to motivate users throughout their journey on the website to take a desired action.

4. Use JavaScript Strategically

JavaScript has long been the bane of the SEO professional’s existence, while simultaneously sometimes being necessary for the site to function as the design team intended. JavaScript can be used without hurting a site’s ability to rank. The important part is to remember to surface content to the search engines and give search engines and users the same experience, even if some of that content is coming from JavaScript. One example is using the pushState JavaScript method when implementing infinite scrolling across multiple articles. This facilitates the generation of a new URL when a user hits a new part of the page. Another example is pre-rendering content on the server when building an application in JavaScript frameworks like React. Our development team often uses GatsbyJS for this. This allows SEO professionals to control titles, descriptions, and more so that all the pages can be indexed properly.

5. Coordinate Early

One of the most effective ways to blend the art of design with the science of SEO is to get the conversation between teams started early. Before the first mockup, wireframe, or page template has been designed, SEO professionals should sit in on audience discovery sessions and provide keyword research to the design team. With prior coordination, navigation elements can be designed to actually reflect user behavior. Frustration on the design front can be avoided when the design and SEO teams are aligned on requirements and priorities from the start.

What was once considered an oil and water situation during the website design process can now be thought about more holistically with designers and SEO professionals working together in unison. By aligning SEO and design objectives early on, sharing best practices, and keeping the lines of communication open throughout the process, the art of design and the science of SEO can blend seamlessly to give beautiful websites the visibility that they actually deserve.

Illustration by Ashlie Boyce

Back to Top

comments powered by Disqus