Exclusive: 7+ SEO Tips for Designers
Before starting your descent into the depths of the SEO business, you should know that your design itself has a massive impact on the search engine viability. You'll always fall short of an optimal findability if the design has been made sloppily.
No Chicken and Egg Problem: Design Came Long Before SEOWhen looking at it from a historical point of view, there's no doubt that design came first. SEO was not a thing until much later. First, we relied on the assumption that search engines, of which there was an entire pack in the nineties, would have a personal interest in filling their index. We didn't take any special measures to be easier to find. Then the web got fuller. Google took off, and the world's self-proclaimed SEO experts started looking for ways to manipulate the search engine to push their sites to the top of the ranks. This resulted in SEO done for all the wrong reasons. Since then, we've been more or less fascinated watching a cat and mouse game. SEO will find a new way to spam. Google shuts it down. Start over. [caption id="attachment_104291" align="aligncenter" width="1024"] The book on the left is the best SEO guide you can buy. (Photo: Pixabay)[/caption] Google is approaching its twentieth anniversary and has blocked most of the cheekiest and most stupid manipulation attempts for a while. Of course, it makes sense to help the search engines find your website. Google has defined options for that purpose specifically, while also explaining what a webmaster should or shouldn't do. But, taking a look back at the beginning of the indexing of the web, what did Google and Co. have to base their ranking on? Right, nothing but the websites created by designers. And they were already indexed back then. Huh? Looking at it like this. SEO is a made-up category which wouldn't be needed in a fair competition. Or, put it a bit more diplomatically: the origin of searching is not SEO, but design. This assessment results in the importance of design for being found in search engines, something we call SEO today, giving the so-called experts a neat abbreviation for their job descriptions. [caption id="attachment_104289" align="aligncenter" width="1024"] There are a lot more, and more complex technical terms in the made-up category. (Illustration: Pixabay)[/caption] Basically, planning for the criteria to be found is something that can be developed with common sense, without reading an 800-page tome on the topic.
Principle: The Best SEO is Structured, Standards-Compliant WebdesignThe web's origin lies in the invention of HTML. This markup language adds a logical structure to content and connects it via links. Search engines simply crawl through these structures, understanding them via markers, like H1, P, and so forth. This also allows for the content to be sorted by relevance. Then the engines follow the links, allowing them to capture the entirety of a website, as well as its embedding into the overall web structure. Logically, the search engine values the sites the more, the more external links they get, and less, if that isn't the case. [caption id="attachment_104287" align="aligncenter" width="1024"] You want it too. (Photo: Pixabay)[/caption] This applied back then, and it is still valid today. Once you've understood this context, you can figure out all findability contemplations by yourself. Thus, the best and most effective SEO is a standards-compliant web design that exhausts its markup options, which means actually using H1 where it makes sense, for instance. The first SEO measure for designers is writing standards-compliant HTML. Unfortunately, it is quite common to toss away standards-compliance in favor of achieving several visual effects. This has never been recommendable, and it won't be in the future. Let's see where us designers can become active.
Tip #1: Use Tags as DesignatedHTML is a structured language. Sadly, some CMS, WordPress above all others, act as if we didn't need tags, like P for paragraphs, at all. Works fine without it. This may be correct for the viewer of a site, but it contradicts the principles of the web. Page visitors that don't look with their eyes, naturally including the search engine crawlers, see this flaw right away, making it hard for them to correctly rank the content components.
Tip #2: Avoid Unnecessary ElementsIn the end, search engines only care about content, never about looks. (I'll get to the restrictions later on.) Thus, you should forgo design elements if they don't directly support the content. The content deserves all the attention. Consider carefully, whether the small survey in the sidebar, the funny mini-game, or the self-playing video really support the content. If not, leave them out. They are not just restraints during relevance rating; they could even advance to the visitor check. This results in what SEOs call a high bounce rate. The people leave shortly after entering your site. Google recognizes that, and rates it negatively. That behavior doesn't necessarily have something to do with the content, but could also be a result of your playful approach to the display area.
Tip #4: Use Images as Images, Buttons as Buttons, Fonts as FontsImages were not made to store text in them. Just because the regular visitor wouldn't recognize this trick right away, that doesn't mean that this wouldn't bother the search engine either. Images always need alt tags in order for Google and Co. to have the chance to guess what the image invisible to the crawler is about. You'll never find images without alt tags in the image search. Images are not a good call to action either. After all, the call to action has potential to be your most important interaction element. It's better to set it up as a button with text highlighting its importance. Typography is essential in modern design. In the past, we could only use fonts freely as text in an image. Today, we don't have to do this anymore. We have web fonts. In Google Fonts alone, there are over 800 font families. I'm sure everyone will find something they like. Web fonts possibly increase the loading time of your website, but they also take off the burden of images.
Tip #5: Place Essential Meta TagsTitle and description of a website should not be underestimated. Not because of the debatable ranking advantage, but mainly because the title and description are what represents your site in the search results. Obviously, both elements should be as crisp as possible. The title should be about 70 characters long, and the description should have a maximum of 160 characters. Here, I recommend placing identified keywords of the respective site as early on in the title and description as possible. Additionally, you should look into the topic of Rich Snippets.
Tip #6: Create Responsive WebsitesI just want to briefly mention this one, as I don't think anyone in this branch missed out on the "news" that Google has been including the criterion of mobile-friendliness in their ranking standards for years. [caption id="attachment_104288" align="aligncenter" width="1024"] A design for many devices has many advantages. (Illustration: Pixabay)[/caption] Responsive design also comes with the benefit that every content only exists once, and the fact that the design is kept slim simply by concept. This way, you don't have to deal with the topic of duplicate content, while maintaining the loading time in check at the same time.
Tip #7: Pay Attention to Your Website's PerformanceThe faster your website loads, the better. Your visitors like this, and thus, the search engine likes it as well. By now, there are countless studies proving that visitors tend to leave websites with long loading times. A side that is left can not be very relevant, so it doesn't deserve to be high up in the search results. At least, this is Google's conclusion. On the topic of performance, you'll find a whole bunch of material on our site, like this article, for example.
And what about the content?Content is king, right? Of course, that's correct, and the topic of content marketing is definitely worth a couple of dedicated posts. The designer won't really be the supplier of this content, which is why I excluded all SEO questions regarding the content topic. Generally, though, the higher the quality of the content, the higher the ranking. Here, we would need to deal with unpleasant evolutions as the practice of SEO and their approach to content marketing is a different story. We'll save that for another time. Other Related Sources
- Designing for SEO | Justin Taylor, Moz.com
- Random Boutique | Exemplary site for the synergy between SEO and design
- The Basics of Search Engine Friendly Design and Development | Moz.com
- Do I Need to Design With SEO in Mind? A Guide for Designers | Carrie Cousins, Design Shack
- Making SEO and UX Work Together (Provision-Link) | Sheena Lyonnais, Adobe Blog
Excellent tips, Dieter!
Well, you have covered the topic very well and shared some very important and useful designing point for SEO.
I would love to add one more point about designing interactive Call to Actions. Having interactive call to actions is also highly significant as it converts the visitors into customers. Having eye catching elements forces the visitors to take some action on your website.
We have to use fresh content and good structure content that search engine spider can crawl easily. Use heading tag properly. Use SEO friendly URL and optimize your URL along with the text on your website. Thanks for these useful tips for SEO designing.
Meta tags and fresh content plays a very important role in SEO. thanks for sharing with us some important points related to SEO.
Very helpful and Great information,
we appreciate advise especially coming from a professional.
Thanks again and keep up the great work!
Excellent tips Please keep sharing! It looks very beautiful and explained in a wonderful manner.
Thanks, Dieter Petereit, for such a comprehensive guide… but I want to make some correction here as you mentioned “The title should be about 70 characters long” I think this statement is quite old… The Google now treat your title length as a pixel (title length should be under 600 pix) nor as a character.
There is some really great information. Thanks so much for sharing with us all.