7 SEO Essentials That All Web Designers Need to Know

Web designers and SEO experts tend to butt heads.

Why?

Because, while these two elements are absolutely essential to any website, if your strategy isn’t solid, these elements can sometimes work against each other.

While designers are focused on giving the user a great visual experience, SEO experts are concerned about giving search engines a realistic view of the site.

Without design, a website is under-appreciated. But without SEO, even a wonderfully designed website will never be found by readers.

Is there any way to mend the conflict?

In this article, we’re going to dive into seven ways designers can help the process of search engine optimization on any website. You’ll learn what design elements are important to SEO, and some interesting tips that make both web designers and SEO experts happy with the end result.

1. Let Search Engines “Read” Your Images

One of the biggest parts of web design is adding imagery to break up text. Google, however, doesn’t see those images in the same way people do.

The HTML <img> tag will tell the search engine that there is an image. The actual content of the image, however, is unreadable to the search engine bots.

So how can we let the search engine “read” that image?

The WordPress Media Manager gives us the ability to change the title and alt text of any image that we use.

All you have to do is click into the Media Manager, select the image you want to optimize, and add a title and alt text. This changes the HTML code, adding words that search engine bots can read.

For example, let’s say I’ve added a picture of the Eiffel Tower in a post about Paris. For alt text, I could add “Eiffel Tower in Paris.” Now search engines know not only that there is an image, but also what that image illustrates.

This helps SEO for that page, and also allows for the image to show up in an additional type of search: an image search.

2. Make Sure You’re Optimized for Mobile Access

Mobile web usage has officially surpassed desktop web usage. That means more and more people are using smartphones and tablets to browse the internet. As a result, search engines look more favorably on websites that adapt to mobile usage.

As a web designer, knowing how to make your designs mobile-friendly is now more important than ever.

There are two acceptable ways to make your website mobile-friendly, according to Google: responsive web design and dynamic serving. Both of these allow the URL to stay the same, while the site adapts automatically to the user’s mobile browser.

In staying mobile friendly, it’s also important to avoid Flash video in your site’s main content. We all know that Flash is going out of style, but avoiding this dying form of video is even more important when you’re optimizing for mobile use.

3. Use Web Fonts and HTML to Create Crawlable Designs

I mentioned before that using alt tags is a great way to allow search engines to “read” images, but what if your images have text in them? And what if that text is too large for the alt tag?

Here come webfonts to the rescue! If you’re designing banners or images with text, including webfonts from websites such as Fonts.com or Google will allow your designs to still be readable by search engine bots.

You can also combine these webfonts with HTML to ensure that the text in your design is truly “live.” By including HTML elements such as H1 or H2 headings, bold text, etc., crawl bots are still able to see what the graphic is about. Any keywords within this text are then readable, and this will help on-page SEO.

4. Insert an Expandable Div to Combine Minimalist Design with Optimized Content

If you’re intrigued by minimalist design but unsure of how to include text for SEO in the page, then listen up!

Let’s say you have a panel of product images on a web page. A great minimalist design would be just to leave these as images, and use alt tags to tell search engine bots what the images are.

Guess what: your SEO expert still isn’t happy.

Instead of just using alt tags to insert important text, try placing an expandable div for each image. That way, when you click on the image, a <div> will expand at the bottom, providing space for engaging and SEO-rich content that will make both users and search engines happy (not to mention your SEO expert!).

This text is fully crawlable by search engines. However, since it’s not visible until clicked on, you still get to keep your minimalist design.

5. Code with HTML5 and CSS3 for Advanced Site Function

There are many different advantages to using HTML5 and CSS3. More specific to today’s topics, these two improved markup languages can have a definite impact on a web page’s SEO.

If the web pages you design are not well structured, any other efforts for SEO can basically be thrown out the window. Using HTML5 helps web pages to be well-structured and semantically accurate, which leads to better search engine ranking.

More than that, HTML5 is a fantastic tool to replace the dreaded Flash! Plus, it can help reduce the amount of code on each web page, and lightweight code is easier for bots to crawl.

6. Optimize Designs for Fast Response

In 2010, Google announced they would include site speed as part of their ranking algorithm. Since then, site speed has become one of the most important factors in SEO.

So, how can your designs keep your website running fast?

The key lies in finding the balance between image quality and file size. Of course, we all know that larger files take longer to load, so you want your images to be smaller. However, make sure that you’re not compromising quality.

One tip that can help you optimize images for fast response: make sure you’re not reducing size with HTML. Instead of loading larger image and changing the HTML to display it in a smaller resolution, reduce the size of your image before uploading. This saves bandwidth and speeds up response time.

(Just a side note: Another advantage of using HTML5 and CSS3 is that they help speed up website response time. One more reason they’re great for SEO!)

7. Team Up With a Great Content Creator

If you haven’t already, this is one of the best tips for creating SEO-friendly designs. Content and design go hand-in-hand. Teaming up with an SEO content creator gives you an advantage that others may not have. Your content creator can help you by doing keyword research, optimizing content for web pages, and giving you tips on text to include in your designs.

For years the internet has touted the benefits of content-first design, and this is best achieved when content creators and designers work as a team.

Conclusion

Web designers: are you ready to improve your relationship with your SEO experts? After reading this article, you’ll be ready to provide SEO-friendly ideas within your designs that can make your whole team happy.

These tips about SEO are useful for more than just getting along with an SEO expert, however. Being able to improve on-page SEO with your designs will make you even more valuable as a designer.

Make use of these SEO tips in your web designs, and you’ll see better results than ever!